diff --git a/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.test.tsx b/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.test.tsx index e7e1a3ef90baa3db35e2a7779e0661d633a3a7ea..ef21f2dc7f3df531e4a1bc64d988af4546dceac7 100644 --- a/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.test.tsx +++ b/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.test.tsx @@ -69,12 +69,14 @@ describe('ProjectInfoDrawer', () => { const diseaseLink = screen.getByText(/Disease:/i); expect(diseaseLink).toBeInTheDocument(); - const linkelement = screen.getByRole('link', { name: projectFixture.diseaseName }); + const linkelement = screen.getByRole('link', { + name: projectFixture.diseaseName ? projectFixture.diseaseName : 'xyz', + }); expect(linkelement).toBeInTheDocument(); - expect(linkelement).toHaveAttribute('href', projectFixture.disease.link); + expect(linkelement).toHaveAttribute('href', projectFixture.disease?.link); }); - it('should fetch diesease name when diseaseId is provided', async () => { + it('should fetch disease name when diseaseId is provided', async () => { await act(() => { renderComponent(MOCKED_STORE); }); @@ -82,9 +84,11 @@ describe('ProjectInfoDrawer', () => { const organismLink = screen.getByText(/Organism:/i); expect(organismLink).toBeInTheDocument(); - const linkelement = screen.getByRole('link', { name: projectFixture.organismName }); + const linkelement = screen.getByRole('link', { + name: projectFixture.organismName ? projectFixture.organismName : 'xyz', + }); expect(linkelement).toBeInTheDocument(); - expect(linkelement).toHaveAttribute('href', projectFixture.organism.link); + expect(linkelement).toHaveAttribute('href', projectFixture.organism?.link); }); it('should render the source file download button', () => { diff --git a/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.tsx b/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.tsx index 73894aaf3e30bd33be35ea4d55c02b8d57b0227c..5a04b6fabcedce598ad481a6059e5ab30ee8c502 100644 --- a/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.tsx +++ b/src/components/Map/Drawer/ProjectInfoDrawer/ProjectInfoDrawer.component.tsx @@ -63,28 +63,32 @@ export const ProjectInfoDrawer = (): JSX.Element => { Manual </a> </li> - <li className="mt-2 text-hyperlink-blue"> - <span className="text-black">Disease: </span> - <a - href={diseaseLink} - target="_blank" - rel="noopener noreferrer" - className="font-semibold hover:underline" - > - {diseaseName} - </a> - </li> - <li className="mt-2 text-hyperlink-blue"> - <span className="text-black">Organism: </span> - <a - href={organismLink} - target="_blank" - rel="noopener noreferrer" - className="font-semibold hover:underline" - > - {organismName} - </a> - </li> + {diseaseName && ( + <li className="mt-2 text-hyperlink-blue"> + <span className="text-black">Disease: </span> + <a + href={diseaseLink} + target="_blank" + rel="noopener noreferrer" + className="font-semibold hover:underline" + > + {diseaseName} + </a> + </li> + )} + {organismName && ( + <li className="mt-2 text-hyperlink-blue"> + <span className="text-black">Organism: </span> + <a + href={organismLink} + target="_blank" + rel="noopener noreferrer" + className="font-semibold hover:underline" + > + {organismName} + </a> + </li> + )} </ul> <LinkButton className="mt-6" href={sourceDownloadLink} download="sourceFile.txt"> Download source file diff --git a/src/redux/project/project.selectors.ts b/src/redux/project/project.selectors.ts index aa0c62aee628115e23e91adb0099a84490989218..7ab9a0c284f2677f824887e702c7f2eaa334b859 100644 --- a/src/redux/project/project.selectors.ts +++ b/src/redux/project/project.selectors.ts @@ -49,12 +49,12 @@ export const diseaseNameSelector = createSelector( export const diseaseLinkSelector = createSelector( projectDataSelector, - projectData => projectData?.disease.link, + projectData => projectData?.disease?.link, ); export const organismLinkSelector = createSelector( projectDataSelector, - projectData => projectData?.organism.link, + projectData => projectData?.organism?.link, ); export const organismNameSelector = createSelector(