Mmt 3492: Creating a resuable table Component (#1114)

* MMT-3492: Saving progress on table component * MMT-3492: Adjusting RenderRows * MMT-3492: Finish writing tests * MMT-3492: Addressing PR Comments * MMT-3492: Fixing 'data' structure * MMT-3492: eslint error fixes * MMT-3492: reverting changes to ManagePage * MMT-3492: Fixing shortName and title * MMT-3492: Editing table and ManagePage * MMT-3492: Trying to get tests to run on github * MMT-3492: Addressing comments * MMT-3492: Changing all conceptTypes to ummMetadata * MMT-3492: lint
nasa · Feb 2, 2024 · 18d0d12 · 18d0d12
1 parent c5087ad
commit 18d0d12
Show file tree

Hide file tree

Showing 8 changed files with 58 additions and 48 deletions.
diff --git a/static/src/js/components/DraftList/DraftList.jsx b/static/src/js/components/DraftList/DraftList.jsx
@@ -56,10 +56,11 @@ const DraftList = ({ draftType }) => {
   // Building a Table using Data in items
   const data = (items.map((item) => {
     const {
-      conceptId, revisionDate, previewMetadata: {
-        name, longName, shortName, title
-      }
+      conceptId, revisionDate, ummMetadata
     } = item
+    const {
+      ShortName, EntryTitle, Name, LongName
+    } = ummMetadata || {}
 
     const draftLink = `/drafts/${`${paramDraftType}`}/${conceptId}`
 
@@ -72,14 +73,14 @@ const DraftList = ({ draftType }) => {
               value:
               (
                 <Link to={draftLink}>
-                  {name || shortName || '<Blank Name>'}
+                  {Name || ShortName || '<Blank Name>'}
                 </Link>
               )
             },
             {
               value:
               (
-                longName || title || '<Untitled Record>'
+                LongName || EntryTitle || '<Untitled Record>'
               )
             },
             {

diff --git a/static/src/js/components/DraftList/__tests__/DraftList.test.js b/static/src/js/components/DraftList/__tests__/DraftList.test.js
@@ -97,16 +97,19 @@ describe('DraftList', () => {
             {
               conceptId: 'TD1200000092-MMT_2',
               revisionDate: '2023-12-08T17:56:09.385Z',
+              ummMetadata: {
+                Name: 'Tool TD1200000092 short name',
+                LongName: 'Tool TD1200000092 long name'
+              },
               previewMetadata: {
-                name: 'Tool TD1200000092 short name',
-                longName: 'Tool TD1200000092 long name',
                 __typename: 'Tool'
               },
               __typename: 'Draft'
             },
             {
               conceptId: 'TD1200000093-MMT_2',
               revisionDate: '2023-11-08T17:56:09.385Z',
+              ummMetadata: {},
               previewMetadata: {
                 __typename: 'Tool'
               },
@@ -115,9 +118,11 @@ describe('DraftList', () => {
             {
               conceptId: 'TD1200000094-MMT_2',
               revisionDate: '2023-10-08T17:56:09.385Z',
+              ummMetadata: {
+                Name: 'Tool TD1200000094 short name',
+                LongName: 'Tool TD1200000094 long name'
+              },
               previewMetadata: {
-                name: 'Tool TD1200000094 short name',
-                longName: 'Tool TD1200000094 long name',
                 __typename: 'Tool'
               },
               __typename: 'Draft'

diff --git a/static/src/js/operations/queries/getCollectionDrafts.js b/static/src/js/operations/queries/getCollectionDrafts.js
@@ -8,12 +8,7 @@ export const GET_COLLECTION_DRAFTS = gql`
       items {
         conceptId
         revisionDate
-        previewMetadata {
-          ... on Collection {
-            shortName
-            title
-          }
-        }
+        ummMetadata
       }
     }
   }

diff --git a/static/src/js/operations/queries/getServiceDrafts.js b/static/src/js/operations/queries/getServiceDrafts.js
@@ -8,6 +8,7 @@ export const GET_SERVICE_DRAFTS = gql`
       items {
         conceptId
         revisionDate
+        ummMetadata
         previewMetadata {
           ... on Service {
             name

diff --git a/static/src/js/operations/queries/getToolDrafts.js b/static/src/js/operations/queries/getToolDrafts.js
@@ -8,6 +8,7 @@ export const GET_TOOL_DRAFTS = gql`
       items {
         conceptId
         revisionDate
+        ummMetadata
         previewMetadata {
           ... on Tool {
             name

diff --git a/static/src/js/operations/queries/getVariableDrafts.js b/static/src/js/operations/queries/getVariableDrafts.js
@@ -8,6 +8,7 @@ export const GET_VARIABLE_DRAFTS = gql`
       items {
         conceptId
         revisionDate
+        ummMetadata
         previewMetadata {
           ... on Variable {
             name

diff --git a/static/src/js/pages/ManagePage/ManagePage.jsx b/static/src/js/pages/ManagePage/ManagePage.jsx
@@ -20,7 +20,6 @@ import './ManagePage.scss'
 
 /**
  * Renders a `ManagePage` component
- *
  * @component
  * @example <caption>Renders a `ManagePage` component</caption>
  * return (
@@ -120,30 +119,31 @@ const ManagePage = () => {
                                       {
                                         ({
                                           conceptId,
-                                          previewMetadata: {
-                                            longName,
-                                            name,
-                                            shortName,
-                                            title
-                                          },
+                                          ummMetadata,
                                           revisionDate
-                                        }) => (
-                                          <ListGroup.Item key={conceptId} action className="mb-0">
-                                            <Link
-                                              className="text-decoration-none text-primary"
-                                              to={`/drafts/${type}/${conceptId}`}
-                                            >
-                                              <div>
-                                                <span className="text-black d-block d-xl-inline">{new Date(revisionDate).toLocaleString('en-US', { hour12: false })}</span>
-                                                <span className="d-none d-xl-inline"> | </span>
-                                                <span>{name || shortName || '<Blank Name>'}</span>
-                                              </div>
-                                              <div>
-                                                <span className="text-secondary">{longName || title || '<Untitled Record>'}</span>
-                                              </div>
-                                            </Link>
-                                          </ListGroup.Item>
-                                        )
+                                        }) => {
+                                          const {
+                                            ShortName, EntryTitle, Name, LongName
+                                          } = ummMetadata || {}
+
+                                          return (
+                                            <ListGroup.Item key={conceptId} action className="mb-0">
+                                              <Link
+                                                className="text-decoration-none text-primary"
+                                                to={`/drafts/${type}/${conceptId}`}
+                                              >
+                                                <div>
+                                                  <span className="text-black d-block d-xl-inline">{new Date(revisionDate).toLocaleString('en-US', { hour12: false })}</span>
+                                                  <span className="d-none d-xl-inline"> | </span>
+                                                  <span>{Name || ShortName || '<Blank Name>'}</span>
+                                                </div>
+                                                <div>
+                                                  <span className="text-secondary">{LongName || EntryTitle || '<Untitled Record>'}</span>
+                                                </div>
+                                              </Link>
+                                            </ListGroup.Item>
+                                          )
+                                        }
                                       }
                                     </For>
                                   )

diff --git a/static/src/js/pages/ManagePage/__tests__/ManagePage.test.js b/static/src/js/pages/ManagePage/__tests__/ManagePage.test.js
@@ -40,19 +40,23 @@ const setup = (overrideMocks) => {
               {
                 conceptId: 'TD1000000000-TESTPROV',
                 revisionDate: '2023-11-30 00:00:00',
+                ummMetadata: {
+                  Name: 'Tool Draft 1 Name',
+                  LongName: 'Tool Draft 1 Long Name'
+                },
                 previewMetadata: {
-                  __typename: 'Tool',
-                  name: 'Tool Draft 1 Name',
-                  longName: 'Tool Draft 1 Long Name'
+                  __typename: 'Tool'
                 }
               },
               {
                 conceptId: 'TD1000000001-TESTPROV',
                 revisionDate: '2023-11-30 00:00:00',
+                ummMetadata: {
+                  Name: 'Tool Draft 2 Name',
+                  LongName: 'Tool Draft 2 Long Name'
+                },
                 previewMetadata: {
-                  __typename: 'Tool',
-                  name: 'Tool Draft 2 Name',
-                  longName: 'Tool Draft 2 Long Name'
+                  __typename: 'Tool'
                 }
               }
             ]
@@ -198,10 +202,12 @@ describe('ManagePage component', () => {
                   {
                     conceptId: 'TD1000000000-TESTPROV',
                     revisionDate: '2023-11-30 00:00:00',
+                    ummMetadata: {
+                      Name: null,
+                      LongName: null
+                    },
                     previewMetadata: {
-                      __typename: 'Tool',
-                      name: null,
-                      longName: null
+                      __typename: 'Tool'
                     }
                   }
                 ]