diff --git a/src/landscape/components/LandscapeView.test.js b/src/landscape/components/LandscapeView.test.js index 3c381596b..6a06b8905 100644 --- a/src/landscape/components/LandscapeView.test.js +++ b/src/landscape/components/LandscapeView.test.js @@ -109,6 +109,7 @@ const baseViewTest = async ( })), }; + // Add files to the shared resources const sharedResources = { edges: Array(6) .fill(0) @@ -129,6 +130,25 @@ const baseViewTest = async ( }, })), }; + // Add a link to the shared resources + let index = 6; + sharedResources.edges.push({ + node: { + id: `sr-${index}`, + source: { + id: `de-${index}`, + createdAt: '2023-05-20T16:25:21.536679+00:00', + name: `Data Entry ${index}`, + createdBy: { id: 'user-id', firstName: 'First', lastName: 'Last' }, + description: `Description ${index}`, + size: null, + entryType: 'LINK', + resourceType: 'link', + url: `https://www.link-${index}.com`, + visualizations: { edges: [] }, + }, + }, + }); when(terrasoApi.requestGraphQL) .calledWith( @@ -218,10 +238,22 @@ test('LandscapeView: Display data', async () => { ).toBeInTheDocument(); const entriesList = within(sharedDataRegion.getByRole('list')); const items = entriesList.getAllByRole('listitem'); - expect(items.length).toBe(6); - const firstEntry = within(items[0]); - expect(firstEntry.getByText('Data Entry 0')).toBeInTheDocument(); - expect(firstEntry.getByText('txt')).toBeInTheDocument(); + expect(items.length).toBe(7); + const fileEntry = within(items[0]); + expect(fileEntry.getByText('Data Entry 0')).toBeInTheDocument(); + expect(fileEntry.getByText('txt')).toBeInTheDocument(); + expect(fileEntry.getByText('3 kB')).toBeInTheDocument(); + expect( + fileEntry.getByText('May 20, 2022, by First Last') + ).toBeInTheDocument(); + expect(fileEntry.getByText('Description 0')).toBeInTheDocument(); + const linkEntry = within(items[6]); + expect(linkEntry.getByText('Data Entry 6')).toBeInTheDocument(); + expect(linkEntry.getByText('www.link-6.com')).toBeInTheDocument(); + expect( + linkEntry.getByText('May 20, 2023, by First Last') + ).toBeInTheDocument(); + expect(linkEntry.getByText('Description 6')).toBeInTheDocument(); // Boundary expect( diff --git a/src/sharedData/components/SharedDataEntryBase.js b/src/sharedData/components/SharedDataEntryBase.js index b588c69b4..cd28bfe8b 100644 --- a/src/sharedData/components/SharedDataEntryBase.js +++ b/src/sharedData/components/SharedDataEntryBase.js @@ -54,8 +54,7 @@ const SharedDataEntryBase = props => { EntryTypeIcon, DownloadComponent, ShareComponent, - fileSize, - resourceType, + InfoComponent, } = props; const [isEditingName, setIsEditingName] = useState(false); const [isEditingDescription, setIsEditingDescription] = useState(false); @@ -214,23 +213,16 @@ const SharedDataEntryBase = props => { - {resourceType} - - - {fileSize} + {InfoComponent && } - + + {t('sharedData.file_date_and_author', { diff --git a/src/sharedData/components/SharedDataEntryFile.js b/src/sharedData/components/SharedDataEntryFile.js index 239c53d52..ff1e14ff9 100644 --- a/src/sharedData/components/SharedDataEntryFile.js +++ b/src/sharedData/components/SharedDataEntryFile.js @@ -62,6 +62,27 @@ const StackRow = props => ( ); +const InfoComponent = ({ sharedResource }) => { + const fileSize = filesize(sharedResource.dataEntry.size, { round: 0 }); + const fileType = sharedResource.dataEntry.resourceType; + return ( + <> + + {fileType} + + + {fileSize} + + + + ); +}; + const Visualizations = props => { const { baseOwnerUrl } = useCollaborationContext(); const { i18n, t } = useTranslation(); @@ -373,8 +394,7 @@ const SharedDataEntryFile = props => { )} DownloadComponent={DownloadComponent} ShareComponent={ShareComponent} - fileSize={filesize(sharedResource.dataEntry.size, { round: 0 })} - resourceType={sharedResource.dataEntry.resourceType} + InfoComponent={InfoComponent} > diff --git a/src/sharedData/components/SharedDataEntryLink.js b/src/sharedData/components/SharedDataEntryLink.js index 8ee037f4c..5126ebbb5 100644 --- a/src/sharedData/components/SharedDataEntryLink.js +++ b/src/sharedData/components/SharedDataEntryLink.js @@ -17,7 +17,7 @@ import React, { useMemo } from 'react'; import { useTranslation } from 'react-i18next'; import OpenInNewIcon from '@mui/icons-material/OpenInNew'; -import { IconButton } from '@mui/material'; +import { Grid, IconButton } from '@mui/material'; import { useCollaborationContext } from 'collaboration/collaborationContext'; import ExternalLink from 'common/components/ExternalLink'; @@ -60,9 +60,7 @@ const DownloadComponent = props => { ); }; -const SharedDataEntryLink = props => { - const { t } = useTranslation(); - const { sharedResource } = props; +const InfoComponent = ({ sharedResource }) => { const dataEntry = useMemo( () => sharedResource.dataEntry, [sharedResource.dataEntry] @@ -73,6 +71,17 @@ const SharedDataEntryLink = props => { return url.hostname; }, [dataEntry.url]); + return ( + + {domain} + + ); +}; + +const SharedDataEntryLink = props => { + const { t } = useTranslation(); + const { sharedResource } = props; + return ( { }} /> )} + InfoComponent={InfoComponent} DownloadComponent={DownloadComponent} - info={domain} /> ); };