diff --git a/src/components/Map/Drawer/SearchDrawerWrapper/BioEntitiesResultsList/BioEntitiesPinsList/BioEntitiesPinsListItem/BioEntitiesPinsListItem.component.tsx b/src/components/Map/Drawer/SearchDrawerWrapper/BioEntitiesResultsList/BioEntitiesPinsList/BioEntitiesPinsListItem/BioEntitiesPinsListItem.component.tsx index 901eb2e67e0940fd4df55057d3b3556cb598ffd8..3f6e84393a449b56a2b19900afd74b6e5bc10e41 100644 --- a/src/components/Map/Drawer/SearchDrawerWrapper/BioEntitiesResultsList/BioEntitiesPinsList/BioEntitiesPinsListItem/BioEntitiesPinsListItem.component.tsx +++ b/src/components/Map/Drawer/SearchDrawerWrapper/BioEntitiesResultsList/BioEntitiesPinsList/BioEntitiesPinsListItem/BioEntitiesPinsListItem.component.tsx @@ -18,6 +18,8 @@ import { getSearchData } from '@/redux/search/search.thunks'; import { twMerge } from 'tailwind-merge'; import { getTypeBySBOTerm } from '@/utils/bioEntity/getTypeBySBOTerm'; import { ZERO } from '@/constants/common'; +import { AnnotationItem } from '@/components/Map/Drawer/BioEntityDrawer/AnnotationItem'; +import React from 'react'; import { PinListBioEntity } from './BioEntitiesPinsListItem.types'; import { isPinWithCoordinates } from './BioEntitiesPinsListItem.utils'; @@ -108,19 +110,16 @@ export const BioEntitiesPinsListItem = ({ {pin.references.length > ZERO && ( <ul className="leading-6"> <div className="font-bold">References:</div> - {pin.references.map(reference => { - return ( - <li key={reference.id} className="my-2 px-2"> - <a - href={reference.link ? reference.link : undefined} - target="_blank" - className="cursor-pointer text-primary-500 underline" - > - {reference.type} ({reference.resource}) - </a> - </li> - ); - })} + {pin.references.map(reference => ( + <li key={reference.id} className="ml-3"> + <AnnotationItem + key={reference.id} + type={reference.type} + link={reference.link} + resource={reference.resource} + /> + </li> + ))} </ul> )} </div>