Merge pull request #3543 from OpenNeuroOrg/feature/app-contributors-gql-components

feat(app): Query and display components for contributors

Author: nellh

packages/openneuro-app/src/scripts/datalad/dataset/dataset-query-fragments.js

@@ -65,6 +65,12 @@ export const DRAFT_FRAGMENT = gql`
         familyName 
         orcid 
       }
+      contributors {
+        name
+        givenName 
+        familyName 
+        orcid 
+      }
     }
   }
 `
@@ -247,6 +253,12 @@ export const SNAPSHOT_FIELDS = gql`
       familyName 
       orcid 
     }
+    contributors {
+      name
+      givenName 
+      familyName 
+      orcid 
+    }
   }
   ${SNAPSHOT_ISSUES}
 `

packages/openneuro-app/src/scripts/dataset/__tests__/__snapshots__/snapshot-container.spec.tsx.snap

@@ -786,14 +786,14 @@ OCI-1131441 (R. Poldrack, PI) in any publications.
             N/A
           </div>
           <div
-            class="dataset-meta-block dmb-inline-list"
+            class="dataset-meta-block "
           >
             <h2
               class="dmb-heading"
             >
               Authors
             </h2>
-            J. Doe, J. Doe, J. Doe
+            N/A
           </div>
           <div
             class="dataset-meta-block dmb-modalities"

packages/openneuro-app/src/scripts/dataset/draft-container.tsx

@@ -35,6 +35,7 @@ import { TabRoutesDraft } from "./routes/tab-routes-draft"
 import { FollowToggles } from "./common/follow-toggles"
 import { DateDistance } from "../components/date-distance"
 import { CreatorListDisplay } from "../users/creators-list"
+import { ContributorsListDisplay } from "../users/contributors-list"
 
 export interface DraftContainerProps {
   dataset
@@ -184,8 +185,18 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
                   />
                 }
               />
+              <MetaDataBlock
+                heading="Authors"
+                item={
+                  <ContributorsListDisplay
+                    contributors={dataset.draft.contributors}
+                  />
+                }
+              />
 
-              <EditDescriptionList
+              {
+                /* do we need to account for inline editing on the author list
+               <EditDescriptionList
                 className="dmb-inline-list"
                 datasetId={datasetId}
                 field="Authors"
@@ -194,7 +205,8 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
                 editMode={hasEdit}
               >
                 {description?.Authors?.length ? description.Authors : ["N/A"]}
-              </EditDescriptionList>
+              </EditDescriptionList> */
+              }
               {summary && (
                 <ModalitiesMetaDataBlock
                   items={summary.modalities}

packages/openneuro-app/src/scripts/dataset/snapshot-container.tsx

@@ -40,6 +40,7 @@ import schemaGenerator from "../utils/json-ld.js"
 import { FollowToggles } from "./common/follow-toggles"
 import { DateDistance } from "../components/date-distance"
 import { CreatorListDisplay } from "../users/creators-list"
+import { ContributorsListDisplay } from "../users/contributors-list"
 
 // Helper function for getting version from URL
 const snapshotVersion = (location) => {
@@ -186,14 +187,15 @@ export const SnapshotContainer: React.FC<SnapshotContainerProps> = ({
                   />
                 }
               />
-
               <MetaDataBlock
                 heading="Authors"
-                item={description?.Authors?.length
-                  ? description.Authors.join(", ")
-                  : "N/A"}
-                className="dmb-inline-list"
+                item={
+                  <ContributorsListDisplay
+                    contributors={snapshot.contributors}
+                  />
+                }
               />
+
               <>
                 {summary && (
                   <ModalitiesMetaDataBlock

packages/openneuro-app/src/scripts/search/components/SearchResultDetails.tsx

@@ -8,6 +8,7 @@ import type { SearchResultItemProps } from "./SearchResultItem"
 import { ModalityLabel } from "../../components/formatting/modality-label"
 import { MetaListItemList } from "./MetaListItemList"
 import { CreatorListDisplay } from "../../users/creators-list"
+import { ContributorsListDisplay } from "../../users/contributors-list"
 import "../scss/search-result-details.scss"
 
 interface SearchResultDetailsProps {
@@ -127,13 +128,21 @@ export const SearchResultDetails: FC<SearchResultDetailsProps> = (
       {itemData?.id}
     </Link>,
   )
-  const authors = renderMetaItem(
-    "Authors",
+  const creators = renderMetaItem(
+    "Creators",
     <CreatorListDisplay
       creators={itemData.latestSnapshot?.creators}
       separator=", "
     />,
   )
+
+  const contributors = renderMetaItem(
+    "Contributors",
+    <ContributorsListDisplay
+      contributors={itemData.latestSnapshot?.contributors}
+      separator=", "
+    />,
+  )
   const uploaderDisplay = renderMetaItem(
     "Uploader by",
     <div>
@@ -154,7 +163,8 @@ export const SearchResultDetails: FC<SearchResultDetailsProps> = (
           &times;
         </button>
         {moreDetailsHeader}
-        {authors}
+        {creators}
+        {contributors}
         {modalityList}
         {taskList}
         {accessionNumberDisplay}

packages/openneuro-app/src/scripts/search/components/SearchResultItem.tsx

@@ -9,7 +9,7 @@ import "../scss/search-result.scss"
 import activityPulseIcon from "../../../assets/activity-icon.png"
 import { hasEditPermissions } from "../../authentication/profile"
 import { ModalityHexagon } from "../../components/modality-cube/ModalityHexagon"
-import type { Creator } from "../../types/creators"
+import type { Contributor, Creator } from "../../types/datacite"
 import { SearchResultsCitation } from "../../components/citation/search-results-citation"
 
 export const formatDate = (dateObject) =>
@@ -88,6 +88,7 @@ export interface SearchResultItemProps {
         DatasetDOI: string
       }
       creators: Creator[]
+      contributors: Contributor[]
     }
     analytics: {
       views: number

packages/openneuro-app/src/scripts/search/use-search-results.tsx

@@ -104,6 +104,13 @@ const searchQuery = gql`
               familyName 
               orcid 
             }
+            contributors {
+              name
+              givenName 
+              familyName 
+              orcid 
+              contributorType
+            }
           }
           analytics {
             views
@@ -176,6 +183,7 @@ export const useSearchResults = () => {
         "latestSnapshot.description.Name^6",
         "latestSnapshot.description.Authors^3", // TODO: Nell - do we need this still?
         "latestSnapshot.creators.name^3",
+        "latestSnapshot.contributors.name^2",
       ]),
     )
   }
@@ -271,13 +279,23 @@ export const useSearchResults = () => {
     )
   }
   if (authors.length) { // TODO - NELL - this was switched to creators - is that correct?
+    const authorQuery = matchQuery(
+      "latestSnapshot.creators.name",
+      joinWithOR(authors),
+      "2",
+    )
+    const contributorQuery = matchQuery(
+      "latestSnapshot.contributors.name",
+      joinWithOR(authors),
+      "2",
+    )
     boolQuery.addClause(
       "must",
-      matchQuery(
-        "latestSnapshot.creators.name",
-        joinWithOR(authors),
-        "2",
-      ),
+      {
+        bool: {
+          should: [authorQuery, contributorQuery],
+        },
+      },
     )
   }
   if (sex_selected !== "All") {

packages/openneuro-app/src/scripts/types/creators.ts

@@ -0,0 +1,14 @@
+export interface Creator {
+  name?: string
+  givenName?: string
+  familyName?: string
+  orcid?: string
+}
+
+export interface Contributor {
+  name?: string
+  givenName?: string
+  familyName?: string
+  orcid?: string
+  contributorType?: string
+}

packages/openneuro-app/src/scripts/types/datacite.ts

@@ -0,0 +1,81 @@
+import React from "react"
+import { render, screen } from "@testing-library/react"
+import { MemoryRouter } from "react-router-dom"
+import { MockedProvider } from "@apollo/client/testing"
+import { vi } from "vitest"
+import { SingleContributorDisplay } from "../contributor"
+
+// --- Mock Dependencies ---
+vi.mock("../../queries/user", () => ({
+  useUser: vi.fn(() => ({
+    user: null,
+    loading: false,
+    error: undefined,
+  })),
+}))
+
+import { useUser } from "../../queries/user"
+
+vi.mock("../../assets/ORCIDiD_iconvector.svg", () => ({
+  default: "mock-orcid-logo.svg",
+}))
+
+describe("SingleContributorDisplay - Basic Loading", () => {
+  const renderComponent = (props: {
+    contributor: { name?: string; orcid?: string | null }
+    isLast?: boolean
+    separator?: React.ReactNode
+  }) => {
+    return render(
+      <MemoryRouter>
+        <MockedProvider>
+          <SingleContributorDisplay
+            contributor={props.contributor}
+            isLast={props.isLast ?? true}
+            separator={props.separator ?? null}
+          />
+        </MockedProvider>
+      </MemoryRouter>,
+    )
+  }
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+    vi.mocked(useUser).mockImplementation((userId) => {
+      if (userId) {
+        return {
+          user: { id: userId, name: `Mock User ${userId}` },
+          loading: false,
+          error: undefined,
+        }
+      }
+      return { user: null, loading: false, error: undefined }
+    })
+  })
+
+  it("renders the component and displays the contributor name", async () => {
+    const contributor = { name: "Jane Doe", orcid: null }
+    renderComponent({ contributor })
+    expect(screen.getByText("Jane Doe")).toBeInTheDocument()
+  })
+
+  it("renders 'Unknown Contributor' if the contributor name is missing", async () => {
+    const contributor = { name: undefined, orcid: null }
+    renderComponent({ contributor })
+    expect(screen.getByText("Unknown Contributor")).toBeInTheDocument()
+  })
+
+  it("renders the component and displays the ORCID link if an ID is provided", async () => {
+    const testOrcid = "0000-0000-0000-0000"
+    const contributor = { name: "Author With ORCID", orcid: testOrcid }
+    renderComponent({ contributor })
+    const orcidLink = screen.getByLabelText(
+      `ORCID profile for ${contributor.name}`,
+    )
+    expect(orcidLink).toBeInTheDocument()
+    expect(orcidLink).toHaveAttribute(
+      "href",
+      expect.stringContaining(testOrcid),
+    )
+  })
+})