@openneuro/app 4.30.2 → 4.31.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openneuro/app",
-  "version": "4.30.2",
+  "version": "4.31.0",
   "description": "React JS web frontend for the OpenNeuro platform.",
   "license": "MIT",
   "main": "public/client.js",
@@ -16,11 +16,11 @@
   "dependencies": {
     "@apollo/client": "3.11.8",
     "@artsy/fresnel": "^1.3.1",
-    "@bids/validator": "npm:@jsr/bids__validator@^2.0.0",
+    "@bids/validator": "npm:@jsr/bids__validator@^2.0.2",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
     "@niivue/niivue": "0.45.1",
-    "@openneuro/components": "^4.30.2",
+    "@openneuro/components": "^4.31.0",
     "@sentry/react": "^8.25.0",
     "@tanstack/react-table": "^8.9.3",
     "buffer": "^6.0.3",
@@ -68,11 +68,11 @@
     "sass": "^1.32.8",
     "stream-browserify": "^3.0.0",
     "typescript": "5.6.3",
-    "vite": "5.4.8",
+    "vite": "5.4.12",
     "vitest": "2.1.2"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "7a6abc827a38daa177038e85fd1130daa810fbd0"
+  "gitHead": "428e6902d79ee14a402054cceeaa13fa37192849"
 }

package/src/client.jsx

@@ -1,5 +1,5 @@
 /**
- * Browser client entrypoint - see server.tsx for SSR entrypoint
+ * Browser client entrypoint
  */
 import "./scripts/utils/global-polyfill"
 import "./scripts/sentry"

package/src/scripts/datalad/dataset/dataset-query-fragments.js

@@ -135,13 +135,8 @@ export const DATASET_ISSUES = gql`
         ${ISSUE_FIELDS}
       }
       validation {
-        codeMessages {
-          code
-          message
-        }
-        issues {
-          ${VALIDATION_FIELDS}
-        }
+        errors
+        warnings
       }
     }
   }
@@ -154,13 +149,8 @@ export const SNAPSHOT_ISSUES = gql`
       ${ISSUE_FIELDS}
     }
     validation {
-      codeMessages {
-        code
-        message
-      }
-      issues {
-        ${VALIDATION_FIELDS}
-      }
+      errors
+      warnings
     }
   }
 `

package/src/scripts/dataset/__tests__/__snapshots__/snapshot-container.spec.tsx.snap

@@ -181,124 +181,7 @@ exports[`SnapshotContainer component > renders successfully 1`] = `
                   </div>
                   <div
                     class="accordion-item  collapsed "
-                  >
-                    <div
-                      class="accordion-content"
-                    >
-                      <div>
-                        <span
-                          class="message error fade-in"
-                        >
-                          We found 
-                          <strong>
-                            1 Warning
-                          </strong>
-                           in your dataset. You are not required to fix warnings, but doing so will make your dataset more BIDS compliant.
-                        </span>
-                      </div>
-                      <br />
-                      <div
-                        class="validation-messages on-accordion-wrapper"
-                      >
-                        <article
-                          class="plain accordion fade-in upload-panel warning-wrap"
-                        >
-                          <div
-                            class="accordion-title "
-                            role="switch"
-                          >
-                            <span>
-                              view 1 warning in 1 file
-                            </span>
-                          </div>
-                          <div
-                            class="accordion-item  collapsed "
-                          >
-                            <div
-                              class="accordion-content"
-                            >
-                              <div
-                                class=" on-accordion-wrapper"
-                              >
-                                <article
-                                  class="plain accordion validation-error fade-in"
-                                >
-                                  <div
-                                    class="accordion-title "
-                                    role="switch"
-                                  >
-                                    <span
-                                      class="file-header"
-                                    >
-                                      <h4
-                                        class="em-header"
-                                      >
-                                        <strong
-                                          class="em-header "
-                                        >
-                                          Warning: 1
-                                        </strong>
-                                        <span
-                                          class="file-issue-count"
-                                        >
-                                          1 file
-                                        </span>
-                                      </h4>
-                                      Tabular file contains custom columns not described in a data dictionary
-                                    </span>
-                                  </div>
-                                  <div
-                                    class="accordion-item  collapsed "
-                                  >
-                                    <div
-                                      class="accordion-content"
-                                    >
-                                      <div
-                                        class="em-body"
-                                      >
-                                        <span
-                                          class="e-meta"
-                                        >
-                                          <span>
-                                            <label>
-                                              Location:
-                                            </label>
-                                            <p>
-                                              /participants.tsv
-                                            </p>
-                                          </span>
-                                        </span>
-                                        <span
-                                          class="e-meta"
-                                        >
-                                          <label>
-                                            Reason:
-                                          </label>
-                                          <p>
-                                            Tabular file contains custom columns not described in a data dictionary
-                                          </p>
-                                        </span>
-                                        <span
-                                          class="e-meta"
-                                        >
-                                          <label>
-                                            Evidence: 
-                                          </label>
-                                          <p>
-                                            Columns: sex, age not defined, please define in: /participants.json
-                                          </p>
-                                        </span>
-                                      </div>
-                                    </div>
-                                  </div>
-                                </article>
-                              </div>
-                            </div>
-                          </div>
-                        </article>
-                      </div>
-                    </div>
-                  </div>
+                  />
                 </article>
               </div>
             </div>
@@ -670,174 +553,7 @@ OCI-1131441 (R. Poldrack, PI) in any publications.
                       </div>
                       <div
                         class="accordion-item  collapsed "
-                      >
-                        <div
-                          class="accordion-content"
-                        >
-                          <ul
-                            class="child-files"
-                          >
-                            <li
-                              class="clearfix filetree-item filetree-file"
-                            >
-                              <span
-                                aria-label=""
-                                class=" on-icon  "
-                                role="img"
-                                style="color: orange;"
-                              >
-                                <i
-                                  class="fas fa-file-alt"
-                                />
-                              </span>
-                                CHANGES
-                              <span
-                                class="filetree-editfile"
-                              />
-                            </li>
-                            <li
-                              class="clearfix filetree-item filetree-file"
-                            >
-                              <span
-                                aria-label=""
-                                class=" on-icon  "
-                                role="img"
-                                style="color: deepskyblue;"
-                              >
-                                <i
-                                  class="fab fa-markdown"
-                                />
-                              </span>
-                                README
-                              <span
-                                class="filetree-editfile"
-                              />
-                            </li>
-                            <li
-                              class="clearfix filetree-item filetree-file"
-                            >
-                              <span
-                                aria-label=""
-                                class=" on-icon  "
-                                role="img"
-                                style="color: limegreen;"
-                              >
-                                <i
-                                  class="fab fa-node-js"
-                                />
-                              </span>
-                                T1w.json
-                              <span
-                                class="filetree-editfile"
-                              />
-                            </li>
-                            <li
-                              class="clearfix filetree-item filetree-file"
-                            >
-                              <span
-                                aria-label=""
-                                class=" on-icon  "
-                                role="img"
-                                style="color: limegreen;"
-                              >
-                                <i
-                                  class="fab fa-node-js"
-                                />
-                              </span>
-                                dataset_description.json
-                              <span
-                                class="filetree-editfile"
-                              />
-                            </li>
-                            <li
-                              class="clearfix filetree-item filetree-file"
-                            >
-                              <span
-                                aria-label=""
-                                class=" on-icon  "
-                                role="img"
-                                style="color: lightgreen;"
-                              >
-                                <i
-                                  class="fas fa-file-excel"
-                                />
-                              </span>
-                                participants.tsv
-                              <span
-                                class="filetree-editfile"
-                              />
-                            </li>
-                            <li
-                              class="clearfix filetree-item filetree-dir"
-                            >
-                              <article
-                                class="file-tree accordion "
-                              >
-                                <div
-                                  class="accordion-title "
-                                  role="switch"
-                                >
-                                  <span
-                                    aria-label="sub-01"
-                                    class="file-icon on-icon icon-text "
-                                    role="img"
-                                  >
-                                    <i
-                                      class="fas fa-folder"
-                                    />
-                                    sub-01
-                                  </span>
-                                </div>
-                                <div
-                                  class="accordion-item  collapsed "
-                                >
-                                  <div
-                                    class="accordion-content"
-                                  >
-                                    <div>
-                                      Loading...
-                                    </div>
-                                  </div>
-                                </div>
-                              </article>
-                            </li>
-                            <li
-                              class="clearfix filetree-item filetree-dir"
-                            >
-                              <article
-                                class="file-tree accordion "
-                              >
-                                <div
-                                  class="accordion-title "
-                                  role="switch"
-                                >
-                                  <span
-                                    aria-label="sub-02"
-                                    class="file-icon on-icon icon-text "
-                                    role="img"
-                                  >
-                                    <i
-                                      class="fas fa-folder"
-                                    />
-                                    sub-02
-                                  </span>
-                                </div>
-                                <div
-                                  class="accordion-item  collapsed "
-                                >
-                                  <div
-                                    class="accordion-content"
-                                  >
-                                    <div>
-                                      Loading...
-                                    </div>
-                                  </div>
-                                </div>
-                              </article>
-                            </li>
-                          </ul>
-                        </div>
-                      </div>
+                      />
                     </article>
                   </div>
                 </div>
@@ -1003,15 +719,7 @@ OCI-1131441 (R. Poldrack, PI) in any publications.
                                 </div>
                                 <div
                                   class="accordion-item  collapsed "
-                                >
-                                  <div
-                                    class="accordion-content"
-                                  >
-                                    <div>
-                                      Loading...
-                                    </div>
-                                  </div>
-                                </div>
+                                />
                               </article>
                             </li>
                             <li
@@ -1037,15 +745,7 @@ OCI-1131441 (R. Poldrack, PI) in any publications.
                                 </div>
                                 <div
                                   class="accordion-item  collapsed "
-                                >
-                                  <div
-                                    class="accordion-content"
-                                  >
-                                    <div>
-                                      Loading...
-                                    </div>
-                                  </div>
-                                </div>
+                                />
                               </article>
                             </li>
                           </ul>

package/src/scripts/dataset/components/ValidationBlock.tsx

@@ -1,7 +1,6 @@
 import React from "react"
-import { Validation } from "../../validation/validation"
+import { Validation, ValidationPending } from "../../validation/validation"
 import LegacyValidation from "../../validation-legacy/validation.jsx"
-import { DatasetIssues } from "@bids/validator/issues"
 import type { Issue } from "@bids/validator/issues"
 
 // TODO - Generate from GraphQL
@@ -14,10 +13,13 @@ interface CodeMessageInput {
 interface ValidationFragment {
   issues: Issue[]
   codeMessages: CodeMessageInput[]
+  warnings: number
+  errors: number
 }
 
 export interface ValidationBlockProps {
   datasetId: string
+  version?: string
   issues?: object
   validation?: ValidationFragment
 }
@@ -29,6 +31,7 @@ export interface ValidationBlockProps {
  */
 export const ValidationBlock: React.FC<ValidationBlockProps> = ({
   datasetId,
+  version,
   issues,
   validation,
 }) => {
@@ -40,26 +43,21 @@ export const ValidationBlock: React.FC<ValidationBlockProps> = ({
     )
   } else {
     // If data exists, populate this. Otherwise we show pending.
-    if (validation?.issues) {
-      // Reconstruct DatasetIssues from JSON
-      const datasetIssues = new DatasetIssues()
-      datasetIssues.issues = validation.issues
-      datasetIssues.codeMessages = validation.codeMessages.reduce(
-        (acc, curr) => {
-          acc.set(curr.code, curr.message)
-          return acc
-        },
-        new Map<string, string>(),
-      )
+    if (validation?.warnings + validation?.errors > 0) {
       return (
         <div className="validation-accordion">
-          <Validation issues={datasetIssues} />
+          <Validation
+            datasetId={datasetId}
+            version={version}
+            warnings={validation.warnings}
+            errors={validation.errors}
+          />
         </div>
       )
     } else {
       return (
         <div className="validation-accordion">
-          <Validation issues={null} />
+          <ValidationPending />
         </div>
       )
     }

package/src/scripts/dataset/components/__tests__/ValidationBlock.spec.tsx

@@ -26,6 +26,8 @@ describe("ValidationBlock component", () => {
       codeMessages: [
         { code: "JSON_KEY_RECOMMENDED", message: "message" },
       ],
+      warnings: 1,
+      errors: 0,
     }
     render(
       <ValidationBlock

package/src/scripts/dataset/draft-container.tsx

@@ -13,7 +13,7 @@ import {
   hasEditPermissions,
 } from "../authentication/profile"
 import { useCookies } from "react-cookie"
-import { DatasetAlertDraft } from "./fragments/dataset-alert-draft"
+import { DatasetAlertDraft } from "./fragments/dataset-alert"
 import { CloneDropdown } from "./components/CloneDropdown"
 import { DatasetGitAccess } from "./components/DatasetGitAccess"
 import { DatasetHeader } from "./components/DatasetHeader"
@@ -135,6 +135,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
               <div className="dataset-validation">
                 <ValidationBlock
                   datasetId={dataset.id}
+                  version={dataset.draft.head}
                   issues={dataset.draft.issues}
                   validation={dataset.draft.validation}
                 />

package/src/scripts/dataset/files/__tests__/__snapshots__/file-tree.spec.jsx.snap

@@ -21,15 +21,7 @@ exports[`FileTree component > renders with default props 1`] = `
     </div>
     <div
       class="accordion-item  collapsed "
-    >
-      <div
-        class="accordion-content"
-      >
-        <ul
-          class="child-files"
-        />
-      </div>
-    </div>
+    />
   </article>
 </DocumentFragment>
 `;

package/src/scripts/dataset/fragments/__tests__/{dataset-alert-draft.spec.tsx → dataset-alert.spec.tsx}

@@ -1,7 +1,7 @@
 import React from "react"
 import { render, screen } from "@testing-library/react"
 import { MemoryRouter } from "react-router-dom"
-import { DatasetAlertDraft } from "../dataset-alert-draft"
+import { DatasetAlertDraft, DatasetAlertPrivate } from "../dataset-alert"
 
 describe("DatasetAlertDraft component", () => {
   it("renders the correct text for private drafts with changes", () => {
@@ -69,3 +69,35 @@ describe("DatasetAlertDraft component", () => {
     ).toBeInTheDocument()
   })
 })
+
+describe("DatasetAlertPrivate component", () => {
+  it("renders the correct text for private snapshots with no changes", () => {
+    render(
+      <DatasetAlertPrivate
+        datasetId="test00001"
+        hasDraftChanges={false}
+      />,
+      { wrapper: MemoryRouter },
+    )
+
+    expect(
+      screen.queryByText(/this dataset has not been published/i),
+    ).toBeInTheDocument()
+    expect(
+      screen.queryByText(/there have been changes to the draft/i),
+    ).not.toBeInTheDocument()
+  })
+  it("renders the correct text for private snapshots with changes", () => {
+    render(
+      <DatasetAlertPrivate
+        datasetId="test00001"
+        hasDraftChanges
+      />,
+      { wrapper: MemoryRouter },
+    )
+
+    expect(
+      screen.queryByText(/there have been changes to the draft/i),
+    ).toBeInTheDocument()
+  })
+})

package/src/scripts/dataset/fragments/{dataset-alert-draft.tsx → dataset-alert.tsx}

@@ -2,6 +2,11 @@ import React from "react"
 import { Link } from "react-router-dom"
 import { DatasetAlert } from "../components/DatasetAlert"
 
+export interface DatasetAlertPrivateProps {
+  datasetId: string
+  hasDraftChanges: boolean
+}
+
 export interface DatasetAlertDraftProps {
   isPrivate: boolean
   datasetId: string
@@ -9,6 +14,30 @@ export interface DatasetAlertDraftProps {
   hasSnapshot: boolean
 }
 
+export const DatasetAlertPrivate: React.FC<DatasetAlertPrivateProps> = ({
+  datasetId,
+  hasDraftChanges,
+}) => {
+  return (
+    <DatasetAlert
+      alert="This dataset has not been published!"
+      footer={hasDraftChanges &&
+        "* There have been changes to the draft since your last version"}
+      level="warning"
+    >
+      <>
+        <Link
+          className="dataset-tool"
+          to={"/datasets/" + datasetId + "/publish"}
+        >
+          Publish this dataset
+        </Link>
+        &#32; to make all versions available publicly.
+      </>
+    </DatasetAlert>
+  )
+}
+
 export const DatasetAlertDraft: React.FC<DatasetAlertDraftProps> = ({
   isPrivate,
   datasetId,
@@ -17,24 +46,7 @@ export const DatasetAlertDraft: React.FC<DatasetAlertDraftProps> = ({
 }) => {
   if (isPrivate) {
     if (hasSnapshot) {
-      return (
-        <DatasetAlert
-          alert="This dataset has not been published!"
-          footer={hasDraftChanges &&
-            "* There have been changes to the draft since your last version"}
-          level="warning"
-        >
-          <>
-            <Link
-              className="dataset-tool"
-              to={"/datasets/" + datasetId + "/publish"}
-            >
-              Publish this dataset
-            </Link>
-            &#32; to make all versions available publicly.
-          </>
-        </DatasetAlert>
-      )
+      return DatasetAlertPrivate({ datasetId, hasDraftChanges })
     } else {
       return (
         <DatasetAlert