diff --git a/CHANGELOG-cat-977.md b/CHANGELOG-cat-977.md new file mode 100644 index 0000000000..af6469cadc --- /dev/null +++ b/CHANGELOG-cat-977.md @@ -0,0 +1 @@ +- Revise Collection DOI links to copy on click instead of opening a new tab that leads to the same page. diff --git a/context/app/static/js/components/detailPage/Citation/Citation.tsx b/context/app/static/js/components/detailPage/Citation/Citation.tsx index 0610f80052..213d6426c3 100644 --- a/context/app/static/js/components/detailPage/Citation/Citation.tsx +++ b/context/app/static/js/components/detailPage/Citation/Citation.tsx @@ -3,6 +3,10 @@ import Typography from '@mui/material/Typography'; import OutboundIconLink from 'js/shared-styles/Links/iconLinks/OutboundIconLink'; import LabelledSectionText from 'js/shared-styles/sections/LabelledSectionText'; +import ContentCopyIcon from '@mui/icons-material/ContentCopyRounded'; +import { useHandleCopyClick } from 'js/hooks/useCopyText'; +import IconLink from 'js/shared-styles/Links/iconLinks/IconLink'; +import { SecondaryBackgroundTooltip } from 'js/shared-styles/tooltips'; interface Contributor { last_name: string; @@ -24,11 +28,43 @@ interface CitationProps { doi_url: string; doi: string; className?: string; + internalDoi?: boolean; } -function Citation({ contributors, citationTitle, created_timestamp, doi_url, doi, className }: CitationProps) { +function ExternalDoiLink({ doi_url }: { doi_url: string }) { + return {doi_url}; +} + +function InternalDoiLink({ doi_url }: { doi_url: string }) { + const copy = useHandleCopyClick(); + return ( + + { + e.preventDefault(); + copy(doi_url); + }} + icon={} + > + {doi_url} + + + ); +} + +function Citation({ + contributors, + citationTitle, + created_timestamp, + doi_url, + doi, + className, + internalDoi, +}: CitationProps) { const citation = buildNLMCitation(contributors, citationTitle, created_timestamp); + const DOI = internalDoi ? InternalDoiLink : ExternalDoiLink; return ( - {citation} Available from: {doi_url} + {citation} Available from: View DataCite Page diff --git a/context/app/static/js/components/detailPage/summary/SummaryBody/SummaryBody.tsx b/context/app/static/js/components/detailPage/summary/SummaryBody/SummaryBody.tsx index 143ff67b7a..7f0b796127 100644 --- a/context/app/static/js/components/detailPage/summary/SummaryBody/SummaryBody.tsx +++ b/context/app/static/js/components/detailPage/summary/SummaryBody/SummaryBody.tsx @@ -108,6 +108,7 @@ function CollectionCitation() { contributors={contributors} citationTitle={title} created_timestamp={created_timestamp} + internalDoi /> ); } diff --git a/context/app/static/js/pages/Collection/Collection.tsx b/context/app/static/js/pages/Collection/Collection.tsx index 6526fa28fc..f896abe8d5 100644 --- a/context/app/static/js/pages/Collection/Collection.tsx +++ b/context/app/static/js/pages/Collection/Collection.tsx @@ -1,29 +1,13 @@ import React from 'react'; -import OutboundIconLink from 'js/shared-styles/Links/iconLinks/OutboundIconLink'; import Summary from 'js/components/detailPage/summary/Summary'; import CollectionDatasetsTable from 'js/components/detailPage/CollectionDatasetsTable'; import ContributorsTable from 'js/components/detailPage/ContributorsTable'; import useTrackID from 'js/hooks/useTrackID'; import { Collection } from 'js/components/types'; -import { getCollectionDOI } from './utils'; - -function DOILink({ doi_url }: Pick) { - if (!doi_url) { - return null; - } - const doi = getCollectionDOI(doi_url); - - return ( - - doi:{doi} - - ); -} - function CollectionDetail({ collection: collectionData }: { collection: Collection }) { - const { entity_type, hubmap_id, doi_url, datasets, contributors, contacts } = collectionData; + const { entity_type, hubmap_id, datasets, contributors, contacts } = collectionData; useTrackID({ entity_type, hubmap_id }); @@ -31,9 +15,7 @@ function CollectionDetail({ collection: collectionData }: { collection: Collecti
{collectionData && ( <> - - - + {'datasets' in collectionData && } {contributors && Boolean(contributors.length) && (