Transition DOI related works to REST API

cypress/e2e/searchWork.test.ts

@@ -29,7 +29,8 @@ describe('Search Works', () => {
         expect($facet.eq(4)).to.contain('Language')
         expect($facet.eq(5)).to.contain('Field of Science')
         expect($facet.eq(6)).to.contain('Registration Agency')
-        expect($facet.eq(7)).to.contain('Repository Type')
+        expect($facet.eq(7)).to.contain('Repository')
+        expect($facet.eq(8)).to.contain('Repository Type')
       })
   })
 

package.json

@@ -61,7 +61,7 @@
     "linkify-react": "^4.2.0",
     "linkifyjs": "^4.2.0",
     "maltipoo": "https://github.com/datacite/maltipoo#2.0.3",
-    "next": "15.4.8",
+    "next": "15.4.10",
     "next-plausible": "^3.12.5",
     "node-fetch": "^2.6.0",
     "nuqs": "^1.16.0",

src/app/(main)/doi.org/[...doi]/Content.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { Suspense } from 'react'
 import Container from 'react-bootstrap/Container'
 import Row from 'react-bootstrap/Row'
 import Col from 'react-bootstrap/Col'
@@ -15,6 +15,8 @@ import DownloadMetadata from 'src/components/DownloadMetadata/DownloadMetadata'
 import Work from 'src/components/Work/Work'
 // import { isProject } from 'src/utils/helpers';
 import ExportMetadata from 'src/components/DownloadMetadata/ExportMetadata'
+import RelatedContent from './RelatedContent'
+import RelatedAggregateGraph from './RelatedAggregateGraph'
 
 interface Props {
   doi: string
@@ -27,6 +29,17 @@ export default async function Content(props: Props) {
 
   const { data, error } = await fetchDoi(doi)
 
+  const relatedIdentifiers = data?.work.relatedIdentifiers || []
+  const relatedDois: string[] = Array.from(new Set(
+    relatedIdentifiers
+      ?.filter((identifier) => identifier.relatedIdentifierType === 'DOI')
+      ?.map((identifier) => {
+        const match = identifier.relatedIdentifier?.match(/(?:https?:\/\/doi\.org\/)?(.+)/)
+        const doi = match ? match[1] : identifier.relatedIdentifier
+        return doi && doi.toLowerCase()
+      }) || []
+  )).slice(0, 150)
+
   if (error) return (
     <Col md={{ span: 9, offset: 3 }}>
       <Error title="An error occured." message={error.message} />
@@ -42,6 +55,7 @@ export default async function Content(props: Props) {
       : 'https://doi.org/' + work.doi
 
   return (
+    <>
     <Container fluid>
       <Row className="mb-4">
         <Col md={{ offset: 3 }}>
@@ -82,6 +96,13 @@ export default async function Content(props: Props) {
           <Work doi={work} />
         </Col>
       </Row>
+      <Row>
+        <Suspense>
+          <RelatedAggregateGraph doi={doi} />
+        </Suspense>
+      </Row>
     </Container>
+    <RelatedContent work={work} relatedDois={relatedDois} />
+    </>
   )
 }

src/app/(main)/doi.org/[...doi]/RelatedContent.tsx

@@ -1,34 +1,34 @@
 'use client'
 
 import React from 'react'
-import { useParams, useSearchParams } from 'next/navigation'
+import { useSearchParams } from 'next/navigation'
 import Container from 'react-bootstrap/Container'
 import Col from 'react-bootstrap/Col'
 import Row from 'react-bootstrap/Row'
 
 import Loading from 'src/components/Loading/Loading'
 
 import { useDoiRelatedContentQuery } from 'src/data/queries/doiRelatedContentQuery'
-import { Works } from 'src/data/types'
+import { Work, Works } from 'src/data/types'
 
 import Error from 'src/components/Error/Error'
 import WorksListing from 'src/components/WorksListing/WorksListing'
 import mapSearchparams from './mapSearchParams'
 import { isDMP, isProject } from 'src/utils/helpers'
 
 interface Props {
+  work: Work,
+  relatedDois: string[],
   isBot?: boolean
 }
 
 export default function RelatedContent(props: Props) {
-  const { isBot = false } = props
-  const doiParams = useParams().doi as string[]
-  const doi = decodeURIComponent(doiParams.join('/'))
+  const { isBot = false, work, relatedDois } = props
 
   const searchParams = useSearchParams()
-  const { variables, connectionType } = mapSearchparams(Object.fromEntries(searchParams.entries()) as any)
+  const { variables } = mapSearchparams(Object.fromEntries(searchParams.entries()) as any)
 
-  const vars = { id: doi, ...variables }
+  const vars = { relatedToDoi: work.doi, relatedDois, ...variables }
   const { loading, data, error } = useDoiRelatedContentQuery(vars)
 
   if (isBot) return null
@@ -42,55 +42,31 @@ export default function RelatedContent(props: Props) {
       </Col>
     </Row>
 
-  if (!data) return
+  if ((!data || data.works.totalCount === 0) && !searchParams) return
 
-  const showSankey = isDMP(data.work) || isProject(data.work)
-  const relatedWorks = data.work
+  const relatedWorks = (data?.works ?? { 
+    nodes: [], 
+    totalCount: 0, 
+    pageInfo: { endCursor: '', hasNextPage: false } 
+  }) as Works
+
+  const showSankey = isDMP(work) || isProject(work)
 
-  const allRelatedCount = relatedWorks.allRelated?.totalCount || 0
-  const referenceCount = relatedWorks.references?.totalCount || 0
-  const citationCount = relatedWorks.citations?.totalCount || 0
-  const partCount = relatedWorks.parts?.totalCount || 0
-  const partOfCount = relatedWorks.partOf?.totalCount || 0
-  const otherRelatedCount = relatedWorks.otherRelated?.totalCount || 0
-
-  if (referenceCount + citationCount + partCount + partOfCount + otherRelatedCount === 0) return ''
-
-  const url = '/doi.org/' + relatedWorks.doi + '/?'
-
-  const connectionTypeCounts = {
-    allRelated: allRelatedCount,
-    references: referenceCount,
-    citations: citationCount,
-    parts: partCount,
-    partOf: partOfCount,
-    otherRelated: otherRelatedCount
-  }
-
-  const defaultConnectionType =
-    allRelatedCount > 0 ? 'allRelated' :
-      referenceCount > 0 ? 'references' :
-        citationCount > 0 ? 'citations' :
-          partCount > 0 ? 'parts' :
-            partOfCount > 0 ? 'partOf' : 'otherRelated'
-
-  const displayedConnectionType = connectionType ? connectionType : defaultConnectionType
+  const defaultConnectionType = 'allRelated'
+  const connectionType = searchParams.get('connection-type') || defaultConnectionType
   //convert camel case to title and make first letter uppercase
   //convert connectionType to title, allRelated becomes All Related Wokrs, references becomes References, citations becomes Citations, parts becomes Parts, partOf becomes Part Of, and otherRelated becomes Other Works
   const displayedConnectionTitle =
-    displayedConnectionType === 'allRelated' ? 'All Related Works' :
-      displayedConnectionType === 'otherRelated' ? 'Other Works' :
-        displayedConnectionType.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())
-
-
-
+    connectionType === 'allRelated' ? 'All Related Works' :
+      connectionType === 'otherRelated' ? 'Other Works' :
+        connectionType.replace(/([A-Z])/g, ' $1').replace(/^./, str => str.toUpperCase())
 
-  const works: Works = displayedConnectionType in relatedWorks ?
-    relatedWorks[displayedConnectionType] :
-    { totalCount: 0, nodes: [] }
+  const url = '/doi.org/' + work.doi + '/?'
 
-  const hasNextPage = works.pageInfo ? works.pageInfo.hasNextPage : false
-  const endCursor = works.pageInfo ? works.pageInfo.endCursor : ''
+  const hasNextPage = relatedWorks.pageInfo.hasNextPage
+  const endCursor = relatedWorks.pageInfo
+    ? relatedWorks.pageInfo.endCursor
+    : ''
 
   return (
     <Container fluid>
@@ -101,14 +77,14 @@ export default function RelatedContent(props: Props) {
       </Row>
       <Row>
         <WorksListing
-          works={works}
+          works={relatedWorks}
           loading={loading}
-          connectionTypesCounts={connectionTypeCounts}
+          vars={vars}
           showAnalytics={true}
           showSankey={showSankey}
           sankeyTitle={`Contributions to ${displayedConnectionTitle}`}
           showClaimStatus={true}
-          hasPagination={works.totalCount > 25}
+          hasPagination={relatedWorks.totalCount > 25}
           hasNextPage={hasNextPage}
           model={'doi'}
           url={url}

src/app/(main)/doi.org/[...doi]/mapSearchParams.ts

@@ -26,9 +26,10 @@ export default function mapSearchparams(searchParams: SearchParams) {
       license: searchParams.license,
       fieldOfScience: searchParams['field-of-science'],
       registrationAgency: searchParams['registration-agency'],
+      clientId: searchParams['client-id'],
+      connectionType: searchParams['connection-type'],
     },
 
-    connectionType: searchParams['connection-type'],
     isBot: false
   }
 }

src/app/(main)/doi.org/[...doi]/page.tsx

@@ -9,8 +9,6 @@ import { rorFromUrl } from 'src/utils/helpers'
 import { fetchCrossrefFunder } from 'src/data/queries/crossrefFunderQuery'
 import Content from './Content'
 import { fetchDoi } from 'src/data/queries/doiQuery'
-import RelatedContent from './RelatedContent'
-import RelatedAggregateGraph from './RelatedAggregateGraph'
 import Loading from 'src/components/Loading/Loading'
 import { COMMONS_URL, LOGO_URL } from 'src/data/constants'
 
@@ -94,10 +92,6 @@ export default async function Page(props: Props) {
     <Suspense fallback={<Loading />}>
       <Content doi={doi} />
     </Suspense>
-    <Suspense>
-      <RelatedAggregateGraph doi={doi} />
-    </Suspense>
-    <RelatedContent />
     <Script type="application/ld+json" id="schemaOrg">{data.work.schemaOrg}</Script>
   </>
 }

src/app/(main)/doi.org/page.tsx

@@ -21,7 +21,8 @@ export default async function SearchDoiPage(props: Props) {
     resourceTypeId: vars['resource-type'],
     fieldOfScience: vars['field-of-science'],
     registrationAgency: vars['registration-agency'],
-    clientType: vars['repository-type']
+    clientType: vars['repository-type'],
+    clientId: vars['client-id'],
   }
 
   // Show example text if there is no query

src/app/(main)/orcid.org/[orcid]/mapSearchParams.ts

@@ -24,6 +24,7 @@ export default function mapSearchparams(searchParams: SearchParams) {
       license: searchParams.license,
       fieldOfScience: searchParams['field-of-science'],
       registrationAgency: searchParams['registration-agency'],
+      clientId: searchParams['client-id'],
     },
 
     isBot: false

src/app/(main)/ror.org/[rorid]/Content.tsx

@@ -13,7 +13,6 @@ import DownloadReports from 'src/components/DownloadReports/DownloadReports'
 import OrganizationMetadata from 'src/components/OrganizationMetadata/OrganizationMetadata'
 import SummarySearchMetrics from 'src/components/SummarySearchMetrics/SummarySearchMetrics'
 import Loading from 'src/components/Loading/Loading'
-import RelatedContent from 'src/app/(main)/ror.org/[rorid]/RelatedContent';
 
 interface Props {
   rorid: string
@@ -25,7 +24,6 @@ export default function Content(props: Props) {
   const { data, error, loading } = useROROrganization(rorId)
   if (loading) return <Loading />
   const organization = data?.organization || {} as OrganizationType
-  const rorFundingIds = organization.identifiers?.filter((id) => id.identifierType === 'fundref').map((id) => id.identifier) || []
 
   if (error || !organization) return (
     <Col md={{ span: 9, offset: 3 }}>
@@ -35,43 +33,42 @@ export default function Content(props: Props) {
 
   return (
     <>
-        <Container fluid>
-          <Row className="mb-4">
-            <Col md={{ offset: 3 }}>
-              <Title title={organization.name} titleLink={organization.id} link={organization.id} />
-            </Col>
-          </Row>
+      <Container fluid>
+        <Row className="mb-4">
+          <Col md={{ offset: 3 }}>
+            <Title title={organization.name} titleLink={organization.id} link={organization.id} />
+          </Col>
+        </Row>
 
-          <Row>
-            <Col md={3}>
-              <DownloadReports
-                links={[
-                  {
-                    title: 'Related Works (CSV)',
-                    helpText: 'Includes descriptions and formatted citations in APA style for up to 200 DOIs associated with this organization.',
-                    type: 'ror/related-works',
-                  },
-                  {
-                    title: 'Funders (CSV)',
-                    helpText: 'Includes up to 200 funders associated with related works.',
-                    type: 'ror/funders',
-                  }
-                ]}
-                variables={{ rorId }}
-              />
-            </Col>
-            <Col md={9} className="px-0">
-              <SummarySearchMetrics rorId={organization.id} rorFundingIds={rorFundingIds} />
-              {organization.inceptionYear && (
-                <p className="mb-3">Founded {organization.inceptionYear}</p>
-              )}
-              <OrganizationMetadata metadata={organization}
-                linkToExternal={false}
-                showTitle={false} />
-            </Col>
-          </Row>
-        </Container>
-      <RelatedContent isBot={props.isBot} rorId={rorId} rorFundingIds={rorFundingIds} />
+        <Row>
+          <Col md={3}>
+            <DownloadReports
+              links={[
+                {
+                  title: 'Related Works (CSV)',
+                  helpText: 'Includes descriptions and formatted citations in APA style for up to 200 DOIs associated with this organization.',
+                  type: 'ror/related-works',
+                },
+                {
+                  title: 'Funders (CSV)',
+                  helpText: 'Includes up to 200 funders associated with related works.',
+                  type: 'ror/funders',
+                }
+              ]}
+              variables={{ rorId }}
+            />
+          </Col>
+          <Col md={9} className="px-0">
+            <SummarySearchMetrics rorId={organization.id}/>
+            {organization.inceptionYear && (
+              <p className="mb-3">Founded {organization.inceptionYear}</p>
+            )}
+            <OrganizationMetadata metadata={organization}
+              linkToExternal={false}
+              showTitle={false} />
+          </Col>
+        </Row>
+      </Container>
     </>
   )
 }

src/app/(main)/ror.org/[rorid]/RelatedContent.tsx

@@ -17,17 +17,18 @@ import mapSearchparams from './mapSearchParams';
 interface Props {
   isBot?: boolean
   rorId: string
-  rorFundingIds: string[]
 }
 
 export default function RelatedContent(props: Props) {
-  const { isBot = false, rorId, rorFundingIds } = props
+  const { isBot = false, rorId } = props
 
   const searchParams = useSearchParams()
   const { variables } = mapSearchparams(Object.fromEntries(searchParams.entries()) as any)
 
-  const vars = { rorId, rorFundingIds, ...variables }
+  const vars = { rorId, ...variables }
   const { loading, data, error } = useOrganizationRelatedContentQuery(vars)
+
+  const showMetrics = searchParams.size > 0
 
   if (isBot) return null
 
@@ -60,7 +61,9 @@ export default function RelatedContent(props: Props) {
       </Row>
       <WorksListing
         works={relatedWorks}
+        vars={vars}
         loading={loading}
+        showMetrics={showMetrics}
         showAnalytics={true}
         showClaimStatus={true}
         hasPagination={relatedWorks.totalCount > 25}

src/app/(main)/ror.org/[rorid]/mapSearchParams.ts

@@ -25,7 +25,9 @@ export default function mapSearchparams(searchParams: SearchParams) {
       fieldOfScience: searchParams['field-of-science'],
       license: searchParams.license,
       registrationAgency: searchParams['registration-agency'],
-      clientType: searchParams['repository-type']
+      clientId: searchParams['client-id'],
+      clientType: searchParams['repository-type'],
+      organizationRelationType: searchParams['organization-relation-type'] || 'allRelated',
     },
 
     isBot: false