From 8d6ebb63eb9d82edcadbc928124c42cc4f3e6735 Mon Sep 17 00:00:00 2001
From: Ellen Kraffmiller <ekraffmiller@hmdc.harvard.edu>
Date: Fri, 18 Aug 2023 15:45:41 -0400
Subject: [PATCH] add more dataset details to page

---
 client/cypress/e2e/my-data-details.cy.js | 29 +---------------
 client/src/views/MyDataDetails.vue       | 43 ++++++++++++++++++------
 2 files changed, 33 insertions(+), 39 deletions(-)

diff --git a/client/cypress/e2e/my-data-details.cy.js b/client/cypress/e2e/my-data-details.cy.js
index 76469655..14290034 100644
--- a/client/cypress/e2e/my-data-details.cy.js
+++ b/client/cypress/e2e/my-data-details.cy.js
@@ -24,39 +24,12 @@
         it('successfully loads', () => {
             cy.url().should('contain', 'my-data-details')
 
-            cy.get('h1').should('contain', 'Data File')
+            cy.get('h1').should('contain', 'Dataset')
             cy.get('h1').should('contain',
                 'PUMS5extract1000.csv')
 
         })
-        it('handles delete action', () => {
-            // Test Cancel Delete
-            cy.get('[data-test="deleteButton"]').should('be.visible')
-            cy.get('[data-test="deleteButton"]').click({force: true})
-            cy.get('[data-test="deleteDatasetDialogTitle"]').should('be.visible')
 
-            cy.get('[data-test="deleteDatasetCancel"]').click({force: true})
-            cy.url().should('contain', 'my-data-details')
-            cy.get('h1').should('contain', 'Data File')
-            cy.get('h1').should('contain',
-                'PUMS5extract1000.csv')
-
-            // Test Confirm Delete
-            cy.get('[data-test="deleteButton"]').click({force: true})
-            cy.get('[data-test="deleteDatasetConfirm"]').click({force: true})
-            cy.url().should('contain', 'my-data')
-            cy.get('tr').should('not.contain',
-                'PUMS5extract1000.csv')
-            // click to my-profile, then back to my-data page and make sure the dataset is still removed
-            cy.visit('/my-profile')
-            cy.get('h2').should('contain', 'Edit account information').should('be.visible')
-            cy.visit('/my-data')
-
-            cy.get('tr').should('not.contain',
-                'PUMS5extract1000.csv')
-
-
-        })
 
     })
 }
\ No newline at end of file
diff --git a/client/src/views/MyDataDetails.vue b/client/src/views/MyDataDetails.vue
index 70781a4b..20ddd6d1 100644
--- a/client/src/views/MyDataDetails.vue
+++ b/client/src/views/MyDataDetails.vue
@@ -3,22 +3,23 @@
     <v-container>
       <v-sheet rounded="lg">
         <v-container>
-          <h1 class="title-size-2" style="line-height:150%">
-            <br/><b>Dataset:</b> {{ datasetInfo.name }}</h1>
+          <h1 class="title-size-2 mb-4" style="line-height:150%">
+            <br/><b>Dataset: </b> {{ datasetInfo.name }}</h1>
           <v-container>
-            <v-row>
-              Created : {{ datasetInfo.created }}
+            <v-row class="mb-4">
+             <strong  class="mr-2"> Created: </strong>{{ datasetInfo.created }}
             </v-row>
-            <v-row>
-              Created By : {{ datasetInfo.creatorName }}
+            <v-row class="mb-4">
+              <strong  class="mr-2">Created By: </strong>{{ datasetInfo.creatorName }}
             </v-row>
-            <v-row>
-              Epsilon Budget : {{ datasetInfo.epsilon }}
+            <v-row class="mb-4">
+             <strong  class="mr-2"> Epsilon Budget: </strong> {{ datasetInfo.depositorSetupInfo.epsilon }}
+            </v-row>
+            <v-row class="mb-4">
+              <StatusTag class="my-5" :status="status"/>
             </v-row>
           </v-container>
-          Current Status:
-          <StatusTag class="my-5" :status="status"/>
-          <h1  v-if="datasetInfo.analysisPlans.length > 0" class="title-size-2" style="line-height:100%">
+           <h1  v-if="datasetInfo.analysisPlans.length > 0" class="title-size-2" style="line-height:100%">
             <br/>Analysis Plans:</h1>
           <v-row>
 
@@ -76,6 +77,26 @@
     <SupportBanner/>
   </div>
 </template>
+<style lang="scss" scoped>
+.my-data-details {
+  padding: 20px;
+
+  .title-size-2 {
+    font-size: 1.5rem;
+  }
+  .mr-2 {
+    margin-right: 0.5rem;
+  }
+  .mb-4 {
+    margin-bottom: 20px;
+  }
+
+  .ml-2 {
+    margin-left: 0.5rem;
+  }
+}
+</style>
+
 
 <script>
 import statusInformation from "../data/statusInformation";