diff --git a/src/assets/metadataMapping.jsx b/src/assets/metadataMapping.jsx index 25fc41a6..b62f4ade 100644 --- a/src/assets/metadataMapping.jsx +++ b/src/assets/metadataMapping.jsx @@ -42,11 +42,13 @@ export const defaultMetadataMapping = { if (data.length) { return [{ label: 'Bureau Code', value: data[0] }]; } + return []; }, programCode: (data) => { if (data.length) { return [{ label: 'Program Code', value: data[0] }]; } + return []; }, theme: (data) => { return [ diff --git a/src/assets/metadataMapping.test.jsx b/src/assets/metadataMapping.test.jsx new file mode 100644 index 00000000..37b2ac12 --- /dev/null +++ b/src/assets/metadataMapping.test.jsx @@ -0,0 +1,74 @@ +import React from 'react'; +import { defaultMetadataMapping } from './metadataMapping'; +import TransformedDate from '../components/TransformedDate'; +import * as dataset from '../tests/fixtures/dataset.json'; + + +describe('defaultMetadataMapping', () => { + test("Date Mapping return TransformedDate component", () => { + expect(defaultMetadataMapping.modified(dataset.modified)).toEqual([{ + label: "Modified", + value: + }]); + // expect(defaultMetadataMapping.issued(dataset.issued)).toEqual([{ + // label: "Issued", + // value: + // }]); + }); + // test("Strings are returned properly", () => { + // expect(defaultMetadataMapping.accrualPeriodicity(dataset.accrualPeriodicity)).toEqual([{ + // label: "Frequency", + // value: "Decennial" + // }]); + // expect(defaultMetadataMapping.identifier(dataset.identifier)).toEqual([{ + // label: "Identifier", + // value: "4eaa5ebe-62f7-402e-a407-963cd380688b" + // }]); + // expect(defaultMetadataMapping.bureauCode(dataset.bureauCode)).toEqual([{ + // label: "Bureau Code", + // value: "009:00" + // }]); + // expect(defaultMetadataMapping.programCode(dataset.programCode)).toEqual([{ + // label: "Program Code", + // value: "009:000" + // }]); + // expect(defaultMetadataMapping.accessLevel(dataset.accessLevel)).toEqual([{ + // label: "Public Access Level", + // value: "public" + // }]); + // expect(defaultMetadataMapping.spatial(dataset.spatial)).toEqual([{ + // label: "Spacial/Geographical Coverage", + // value: "Florida" + // }]); + // }); + // test("HTML is returned", () => { + // expect(defaultMetadataMapping.temporal(dataset.temporal)).toEqual([{ + // label: "Temporal Coverage", + // value: 2022-01-01/2022-12-31 + // }]); + // // expect(defaultMetadataMapping.license(dataset.license)).toEqual([{ + // // label: "License", + // // value: http://www.usa.gov/publicdomain/label/1.0/ + // // }]); + // // expect(defaultMetadataMapping.references(dataset.references)).toStrictEqual([{ + // // label: "Related Documents", + // // value: + // // }]); + // }); + // test("Contact point array is returned", () => { + + // }); + // test("Theme and Keywords are returned", () => { + + // }); + + // test("Publisher returns the correct object or empty array", () => { + + // expect(defaultMetadataMapping.publisher(dataset.publisher)).toEqual([{ + // label: "Publisher", + // value: "data.medicaid.gov" + // }]); + // expect(defaultMetadataMapping.publisher({data: { id: 1}})).toEqual([]); + // expect(defaultMetadataMapping.publisher({})).toEqual([]); + // }); +}); \ No newline at end of file diff --git a/src/components/DatasetAdditionalInformation/additional-information-table.scss b/src/components/DatasetAdditionalInformation/additional-information-table.scss index 8eb8ec7a..2c075b2e 100644 --- a/src/components/DatasetAdditionalInformation/additional-information-table.scss +++ b/src/components/DatasetAdditionalInformation/additional-information-table.scss @@ -12,3 +12,14 @@ word-break: break-word; overflow-wrap: anywhere; } + + +@media (max-width: 544px) { + .dc-c-additional-info-table table th { + display: none; + } + + .dc-c-additional-info-table table tbody tr:first-child { + border-top: 4px solid var(--table__border-color); + } +} diff --git a/src/components/DatasetAdditionalInformation/datasetadditionalinformation.test.jsx b/src/components/DatasetAdditionalInformation/datasetadditionalinformation.test.jsx new file mode 100644 index 00000000..e0f6050b --- /dev/null +++ b/src/components/DatasetAdditionalInformation/datasetadditionalinformation.test.jsx @@ -0,0 +1,160 @@ +import React from 'react'; +import { render, screen, within } from '@testing-library/react'; +import '@testing-library/jest-dom'; +import DatasetAdditionalInformation from './index'; +import { defaultMetadataMapping } from '../../assets/metadataMapping'; +import * as dataset from "../../tests/fixtures/dataset.json"; +import { MemoryRouter } from 'react-router-dom'; + +describe('', () => { + test("Renders correctly", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + render( + + + + ); + expect(screen.getByRole('heading', { level: 2 , name: 'Additional Information'})).toBeInTheDocument(); + const infoTable = screen.getByRole('table'); + const basicTableRows = [ + ['Modified', 'January 16, 2024'], + ['Issued', 'August 19, 2015'], + ['Frequency', 'Decennial'], + ['Publisher', 'data.medicaid.gov'], + ['Identifier', '4eaa5ebe-62f7-402e-a407-963cd380688b'], + ['Contact', 'Medicaid.gov'], + ['Contact Email', 'mailto:Medicaid.gov@cms.hhs.gov'], + ['Bureau Code', '009:00'], + ['Program Code', '009:000'], + ['Tags', 'keyword1 , tag2'], + ['Category', 'theme1 , theme 2'], + ['License', 'http://www.usa.gov/publicdomain/label/1.0/'], + ['Public Access Level', 'public'], + ['Temporal Coverage', '2022-01-01/2022-12-31'], + ['Spacial/Geographical Coverage', 'Florida'], + ['Related Documents', 'https://test.com https://test-2.com'] + ]; + + basicTableRows.forEach((rowData) => { + expect(screen.getByRole('row', { name: rowData[0] + ' ' + rowData[1]})); + expect(screen.getByRole('rowheader', { name: rowData[0]})); + expect(screen.getByRole('cell', { name: rowData[1]})); + }) + + expect(within(infoTable).getAllByRole('listitem').length).toBe(2); + + const tableLinks = [ + ['theme1', '/datasets?theme[]=theme1'], + ['theme 2', '/datasets?theme[]=theme 2'], + ['keyword1', '/datasets?keyword[]=keyword1'], + ['tag2', '/datasets?keyword[]=tag2'], + ['http://www.usa.gov/publicdomain/label/1.0/', 'http://www.usa.gov/publicdomain/label/1.0/'], + ['https://test.com', 'https://test.com'], + ['https://test-2.com', 'https://test-2.com'] + ]; + + tableLinks.forEach((tLink) => { + expect(within(infoTable).getByRole('link', { name: tLink[0]})).toHaveAttribute('href', tLink[1]); + }); + }); + test("Doesn't render missing keys", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + render( + + + + ) + const infoTable = screen.getByRole('table'); + expect(within(infoTable).getAllByRole('row').length).toBe(1); + }); + + test("Doesn't render publisher if data is missing", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + + render( + + + + ) + const infoTable = screen.getByRole('table'); + expect(within(infoTable).getAllByRole('row').length).toBe(1); + }); + test("Doesn't render publisher if data and data.name is missing", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + render( + + + + ) + const infoTable = screen.getByRole('table'); + expect(within(infoTable).getAllByRole('row').length).toBe(1); + }); + test("Doesn't render contact email if hasEmail is missing", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + render( + + + + ) + const infoTable = screen.getByRole('table'); + expect(within(infoTable).getAllByRole('row').length).toBe(1); + expect(within(infoTable).queryByText('Contact Email')).not.toBeInTheDocument(); + }); + test("Doesn't render contact if fn is missing", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + render( + + + + ) + const infoTable = screen.getByRole('table'); + expect(within(infoTable).getAllByRole('row').length).toBe(1); + expect(within(infoTable).queryByText('Contact')).not.toBeInTheDocument(); + }); + test("Doesn't render bureauCode or programCode if length is 0", () => { + const metadataMapping = { + ...defaultMetadataMapping, + } + render( + + + + ) + const infoTable = screen.getByRole('table'); + expect(within(infoTable).queryByText('Bureau Code')).not.toBeInTheDocument(); + expect(within(infoTable).queryByText('Program Code')).not.toBeInTheDocument(); + }); +}); diff --git a/src/components/DatasetAdditionalInformation/index.jsx b/src/components/DatasetAdditionalInformation/index.jsx index 8c308e2f..d8f1fb12 100644 --- a/src/components/DatasetAdditionalInformation/index.jsx +++ b/src/components/DatasetAdditionalInformation/index.jsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Table, TableHead, TableRow, TableCell, TableBody } from '@cmsgov/design-system'; +import { Table, TableRow, TableCell, TableBody } from '@cmsgov/design-system'; import './additional-information-table.scss'; export function buildRows(metadataMapping, datasetInfo) { @@ -14,27 +14,23 @@ export function buildRows(metadataMapping, datasetInfo) { return rows; } -const DatasetAdditionalInformation = ({ datasetInfo, id, metadataMapping}) => { - const rows = buildRows(metadataMapping, datasetInfo); +const DatasetAdditionalInformation = ({ metadata, metadataMapping}) => { + const rows = buildRows(metadataMapping, metadata); return ( -
-

Additional Information

- - - - Field - Value - - - - {rows.map((r) => ( - - {r.label} - {r.value} - - ))} - -
+
+

Additional Information

+ + + {rows.map((r) => ( + + + {r.label} + + {r.value} + + ))} + +
); }; diff --git a/src/components/DatasetOverviewTab/DatasetOverviewTab.test.jsx b/src/components/DatasetOverviewTab/DatasetOverviewTab.test.jsx index 76f0273b..6dc99e67 100644 --- a/src/components/DatasetOverviewTab/DatasetOverviewTab.test.jsx +++ b/src/components/DatasetOverviewTab/DatasetOverviewTab.test.jsx @@ -1,5 +1,5 @@ import React from 'react'; -import { render, screen } from '@testing-library/react'; +import { render, screen, within } from '@testing-library/react'; import '@testing-library/jest-dom'; import DatasetOverview from './index'; import { defaultMetadataMapping } from '../../assets/metadataMapping'; diff --git a/src/components/DatasetOverviewTab/index.tsx b/src/components/DatasetOverviewTab/index.tsx index de7e66a8..71b7e3a9 100644 --- a/src/components/DatasetOverviewTab/index.tsx +++ b/src/components/DatasetOverviewTab/index.tsx @@ -1,14 +1,9 @@ import React from 'react'; -import { useMediaQuery } from 'react-responsive'; -import { buildRows } from '../DatasetAdditionalInformation'; -import { Table, TableBody, TableRow, TableCell } from '@cmsgov/design-system'; +import DatasetAdditionalInformation from '../DatasetAdditionalInformation'; import Resource from '../Resource'; import { DatasetOverviewPropsType } from '../../types/dataset'; const DatasetOverview = ({ dataset, resource, distributions, metadataMapping } : DatasetOverviewPropsType) => { - const md = useMediaQuery({ minWidth: 0, maxWidth: 768 }); - const rows = buildRows(metadataMapping, dataset); - return ( <> -
-

Additional Information

- - - {rows.map((r) => ( - - {md ? ( - '' - ) : ( - - {r.label} - - )} - {r.value} - - ))} - -
-
+ ); }; diff --git a/src/templates/Dataset/index.tsx b/src/templates/Dataset/index.tsx index e2df5ee9..0f3c548d 100644 --- a/src/templates/Dataset/index.tsx +++ b/src/templates/Dataset/index.tsx @@ -127,8 +127,11 @@ const Dataset = ({ window.location.hash.substring(1) ? window.location.hash.substring(1) : getDefaultTab()) useEffect(() => { - setSelectedTab(getDefaultTab()) - }, [distribution]) + if (!window.location.hash.substring(1)) + setSelectedTab(getDefaultTab()) + else if (window.location.hash.substring(1) != selectedTab) + setSelectedTab(window.location.hash.substring(1)) + }, [distribution, window.location.hash]) return ( <> diff --git a/src/tests/fixtures/dataset.json b/src/tests/fixtures/dataset.json index 899cd065..e2f7f34b 100644 --- a/src/tests/fixtures/dataset.json +++ b/src/tests/fixtures/dataset.json @@ -6,7 +6,9 @@ "accessLevel": "public", "accrualPeriodicity": "R/P10Y", "modified": "2024-01-16T18:50:39+00:00", + "issued": "2015-08-19T22:29:45+00:00", "license": "http://www.usa.gov/publicdomain/label/1.0/", + "spatial": "Florida", "publisher": { "identifier": "4f3cccad-4fcd-5411-9d07-c23ed9e20068", "data": { @@ -18,11 +20,25 @@ "fn": "Medicaid.gov", "hasEmail": "mailto:Medicaid.gov@cms.hhs.gov" }, + "theme": [ + { + "identifier": "975f-3c7e202fcf5a", + "data": "theme1" + }, + { + "identifier": "5bb1", + "data": "theme 2" + } +], "keyword": [ { "identifier": "7c583fc5-6456-5bb1-975f-3c7e202fcf5a", - "data": "drug rebate program" - } + "data": "keyword1" + }, + { + "identifier": "7c583fc5-6456-5bb1", + "data": "tag2" + } ], "distribution": [ { @@ -48,11 +64,16 @@ } } ], + "temporal": "2022-01-01/2022-12-31", "bureauCode": [ "009:00" ], "programCode": [ "009:000" ], + "references": [ + "https://test.com", + "https://test-2.com" + ], "%modified": "2024-01-16T13:52:33-0500" } \ No newline at end of file