@openneuro/app 4.20.4 → 4.20.6-alpha.2

package/src/scripts/pages/admin/users.jsx

@@ -1,18 +1,18 @@
 // dependencies -------------------------------------------------------
 
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Query } from '@apollo/client/react/components'
-import { gql } from '@apollo/client'
-import parseISO from 'date-fns/parseISO'
-import formatDistanceToNow from 'date-fns/formatDistanceToNow'
-import { Input } from '@openneuro/components/input'
-import { Loading } from '@openneuro/components/loading'
-import { formatDate } from '../../utils/date.js'
-import Helmet from 'react-helmet'
-import { pageTitle } from '../../resources/strings.js'
-import { UserTools } from './user-tools'
-import { USER_FRAGMENT } from './user-fragment'
+import React from "react"
+import PropTypes from "prop-types"
+import { Query } from "@apollo/client/react/components"
+import { gql } from "@apollo/client"
+import parseISO from "date-fns/parseISO"
+import formatDistanceToNow from "date-fns/formatDistanceToNow"
+import { Input } from "@openneuro/components/input"
+import { Loading } from "@openneuro/components/loading"
+import { formatDate } from "../../utils/date.js"
+import Helmet from "react-helmet"
+import { pageTitle } from "../../resources/strings.js"
+import { UserTools } from "./user-tools"
+import { USER_FRAGMENT } from "./user-fragment"
 
 export const GET_USERS = gql`
   query {
@@ -56,8 +56,8 @@ class Users extends React.Component {
   // life cycle events --------------------------------------------------
   render() {
     const users = this.props.users.map((user, index) => {
-      const adminBadge = user.admin ? 'Admin' : null
-      const userEmail = user.hasOwnProperty('email') ? user.email : user.id
+      const adminBadge = user.admin ? "Admin" : null
+      const userEmail = user.hasOwnProperty("email") ? user.email : user.id
       if (this.state.adminFilter && !user.admin) {
         return null
       }
@@ -76,7 +76,7 @@ class Users extends React.Component {
         <div className="fade-in user-panel  panel panel-default" key={index}>
           <div className="user-col uc-name">
             <div>
-              {user.name}{' '}
+              {user.name}{" "}
               {adminBadge && <span className="badge">{adminBadge}</span>}
               <UserTools user={user} refetch={this.props.refetch} />
             </div>
@@ -109,7 +109,7 @@ class Users extends React.Component {
               name="Search Name Or Email"
               type="text"
               placeholder="Search Name or Email"
-              onKeyDown={e => this.setState({ stringFilter: e.target.value })}
+              onKeyDown={(e) => this.setState({ stringFilter: e.target.value })}
             />
           </div>
 
@@ -118,36 +118,32 @@ class Users extends React.Component {
               <div className="filters">
                 <label>Filter By:</label>
                 <button
-                  className={this.state.adminFilter ? 'active' : null}
+                  className={this.state.adminFilter ? "active" : null}
                   onClick={() =>
-                    this.setState({ adminFilter: !this.state.adminFilter })
-                  }>
+                    this.setState({ adminFilter: !this.state.adminFilter })}
+                >
                   <span className="filter-admin">
                     <i
-                      className={
-                        this.state.adminFilter
-                          ? 'fa fa-check-square-o'
-                          : 'fa fa-square-o'
-                      }
-                    />{' '}
+                      className={this.state.adminFilter
+                        ? "fa fa-check-square-o"
+                        : "fa fa-square-o"}
+                    />{" "}
                     Admin
                   </span>
                 </button>
                 <button
-                  className={this.state.blacklistFilter ? 'active' : null}
+                  className={this.state.blacklistFilter ? "active" : null}
                   onClick={() =>
                     this.setState({
                       blacklistFilter: !this.state.blacklistFilter,
-                    })
-                  }>
+                    })}
+                >
                   <span className="filter-admin">
                     <i
-                      className={
-                        this.state.blacklistFilter
-                          ? 'fa fa-check-square-o'
-                          : 'fa fa-square-o'
-                      }
-                    />{' '}
+                      className={this.state.blacklistFilter
+                        ? "fa fa-check-square-o"
+                        : "fa fa-square-o"}
+                    />{" "}
                     Blocked
                   </span>
                 </button>
@@ -157,7 +153,9 @@ class Users extends React.Component {
 
           <div>
             <div className="users-panel-wrap">
-              {users.filter(u => u !== null).length ? users : this._noResults()}
+              {users.filter((u) => u !== null).length
+                ? users
+                : this._noResults()}
             </div>
           </div>
         </div>
@@ -177,15 +175,16 @@ class Users extends React.Component {
     return (
       <>
         <div className="summary-data">
-          <b>Signed Up:</b>{' '}
+          <b>Signed Up:</b>{" "}
           <div>
             {formatDate(created)} - {formatDistanceToNow(parseISO(created))} ago
           </div>
         </div>
         <div className="summary-data">
-          <b>Last Signed In:</b>{' '}
+          <b>Last Signed In:</b>{" "}
           <div>
-            {formatDate(lastLogin)} - {formatDistanceToNow(parseISO(lastLogin))}{' '}
+            {formatDate(lastLogin)} - {formatDistanceToNow(parseISO(lastLogin))}
+            {" "}
             ago
           </div>
         </div>

package/src/scripts/pages/api.jsx

@@ -1,12 +1,12 @@
-import React from 'react'
-import { Loading } from '@openneuro/components/loading'
-import { CopyToClipboard } from 'react-copy-to-clipboard'
-import Helmet from 'react-helmet'
-import { pageTitle } from '../resources/strings.js'
-import { Button } from '@openneuro/components/button'
-import LoggedIn from '../authentication/logged-in'
-import LoggedOut from '../authentication/logged-out'
-import { config } from '../config'
+import React from "react"
+import { Loading } from "@openneuro/components/loading"
+import { CopyToClipboard } from "react-copy-to-clipboard"
+import Helmet from "react-helmet"
+import { pageTitle } from "../resources/strings.js"
+import { Button } from "@openneuro/components/button"
+import LoggedIn from "../authentication/logged-in"
+import LoggedOut from "../authentication/logged-out"
+import { config } from "../config"
 
 /**
  * Create API Key
@@ -16,8 +16,8 @@ import { config } from '../config'
  */
 export const createAPIKey = async () => {
   const req = await fetch(`${config.api}keygen`, {
-    method: 'POST',
-    credentials: 'same-origin',
+    method: "POST",
+    credentials: "same-origin",
   })
   const res = await req.json()
   return res?.key
@@ -36,7 +36,7 @@ class APIKeyGen extends React.Component {
   _requestKey() {
     this.setState({ loading: true })
     createAPIKey()
-      .then(key => {
+      .then((key) => {
         this.setState({ key, loading: false })
       })
       .catch(() => {
@@ -71,9 +71,10 @@ class APIKeyGen extends React.Component {
         <div className="copy-key ck-wrap">
           <CopyToClipboard
             text={this.state.key}
-            onCopy={this._onCopy.bind(this)}>
+            onCopy={this._onCopy.bind(this)}
+          >
             <span className="copy-key">
-              <i className="fa fa-link" aria-hidden="true" />{' '}
+              <i className="fa fa-link" aria-hidden="true" />{" "}
               {this._copyNotification()}
             </span>
           </CopyToClipboard>
@@ -88,9 +89,9 @@ class APIKeyGen extends React.Component {
   }
   _copyNotification() {
     const copyClass = this.state.linkCopied
-      ? 'copy-notification-active copy-notification-copied'
-      : 'copy-notification-active'
-    const copyText = this.state.linkCopied ? 'Copied!' : 'Copy key to clipboard'
+      ? "copy-notification-active copy-notification-copied"
+      : "copy-notification-active"
+    const copyText = this.state.linkCopied ? "Copied!" : "Copy key to clipboard"
     return (
       <span>
         <span className={copyClass}>{copyText}</span>
@@ -107,8 +108,8 @@ class APIKeyGen extends React.Component {
 
   render() {
     const helperText = this.state.key
-      ? 'Your API Key:'
-      : 'Click the button below to generate an API key'
+      ? "Your API Key:"
+      : "Click the button below to generate an API key"
     return (
       <>
         <Helmet>

package/src/scripts/pages/citation-page.tsx

@@ -1,7 +1,7 @@
-import React from 'react'
-import Helmet from 'react-helmet'
-import { frontPage } from './front-page/front-page-content'
-import styled from '@emotion/styled'
+import React from "react"
+import Helmet from "react-helmet"
+import { frontPage } from "./front-page/front-page-content"
+import styled from "@emotion/styled"
 
 const CitationPageStyle = styled.div`
   background: white;

package/src/scripts/pages/faq/faq.tsx

@@ -1,7 +1,7 @@
-import React from 'react'
+import React from "react"
 
 const Faq = (): React.ReactElement => {
-  window.location.replace('https://docs.openneuro.org/faq')
+  window.location.replace("https://docs.openneuro.org/faq")
   return null
 }
 

package/src/scripts/pages/front-page/aggregate-queries/aggregate-counts-container.tsx

@@ -1,7 +1,7 @@
-import React from 'react'
-import useParticipantCount from './use-participant-count'
-import usePublicDatasetsCount from './use-publicDatasets-count'
-import { AggregateCount } from '@openneuro/components/aggregate-count'
+import React from "react"
+import useParticipantCount from "./use-participant-count"
+import usePublicDatasetsCount from "./use-publicDatasets-count"
+import { AggregateCount } from "@openneuro/components/aggregate-count"
 
 export interface AggregateCountsContainerProps {
   modality?: string
@@ -26,7 +26,7 @@ const AggregateCountsContainer: React.FC<AggregateCountsContainerProps> = ({
 
   if (loading) return <>...</>
   else if (error) return null
-  else
+  else {
     return (
       <>
         <AggregateCount
@@ -39,6 +39,7 @@ const AggregateCountsContainer: React.FC<AggregateCountsContainerProps> = ({
         />
       </>
     )
+  }
 }
 
 export default AggregateCountsContainer

package/src/scripts/pages/front-page/aggregate-queries/use-participant-count.ts

@@ -1,4 +1,4 @@
-import { gql, useQuery } from '@apollo/client'
+import { gql, useQuery } from "@apollo/client"
 
 const PARTICIPANT_COUNT = gql`
   query participantCount($modality: String) {
@@ -9,7 +9,7 @@ const PARTICIPANT_COUNT = gql`
 const useParticipantCount = (modality?: string) => {
   return useQuery(PARTICIPANT_COUNT, {
     variables: { modality },
-    errorPolicy: 'all',
+    errorPolicy: "all",
   })
 }
 

package/src/scripts/pages/front-page/aggregate-queries/use-publicDatasets-count.ts

@@ -1,4 +1,4 @@
-import { gql, useQuery } from '@apollo/client'
+import { gql, useQuery } from "@apollo/client"
 
 const PUBLIC_DATASETS_COUNT = gql`
   query publicDatasetCount($modality: String) {
@@ -13,7 +13,7 @@ const PUBLIC_DATASETS_COUNT = gql`
 const usePublicDatasetsCount = (modality?: string) => {
   return useQuery(PUBLIC_DATASETS_COUNT, {
     variables: { modality },
-    errorPolicy: 'all',
+    errorPolicy: "all",
   })
 }
 

package/src/scripts/pages/front-page/front-page-content.ts

@@ -1,56 +1,56 @@
-import ljaf from '../../../assets/ljaf.png'
-import nsf from '../../../assets/nsf.png'
-import nih from '../../../assets/nih.png'
-import squishymedia from '../../../assets/squishymedia.png'
-import stanford from '../../../assets/stanford.png'
-import logo_app from '../../../assets/logo_app.png'
-import logo_cube from '../../../assets/logo_cube.png'
-import logo_data from '../../../assets/logo_data.png'
-import logo_users from '../../../assets/logo_users.png'
-import brand_mark from '../../../assets/brand_mark.png'
+import ljaf from "../../../assets/ljaf.png"
+import nsf from "../../../assets/nsf.png"
+import nih from "../../../assets/nih.png"
+import squishymedia from "../../../assets/squishymedia.png"
+import stanford from "../../../assets/stanford.png"
+import logo_app from "../../../assets/logo_app.png"
+import logo_cube from "../../../assets/logo_cube.png"
+import logo_data from "../../../assets/logo_data.png"
+import logo_users from "../../../assets/logo_users.png"
+import brand_mark from "../../../assets/brand_mark.png"
 
 export const frontPage = {
-  pageTitle: 'OpenNeuro',
+  pageTitle: "OpenNeuro",
   copyright: {
-    holder: 'Stanford Center for Reproducible Neuroscience',
+    holder: "Stanford Center for Reproducible Neuroscience",
   },
   pageDescription:
-    'A free and open platform for sharing MRI, MEG, EEG, iEEG, ECoG, ASL, and PET data',
+    "A free and open platform for sharing MRI, MEG, EEG, iEEG, ECoG, ASL, and PET data",
   titlePanel: {
     logos: [
       {
-        class: 'logo-layer-users',
+        class: "logo-layer-users",
         src: logo_users,
-        alt: 'OpenNeuro Logo',
+        alt: "OpenNeuro Logo",
       },
       {
-        class: 'logo-layer-cube',
+        class: "logo-layer-cube",
         src: logo_cube,
-        alt: 'OpenNeuro Logo',
+        alt: "OpenNeuro Logo",
       },
       {
-        class: 'logo-layer-app',
+        class: "logo-layer-app",
         src: logo_app,
-        alt: 'OpenNeuro Logo',
+        alt: "OpenNeuro Logo",
       },
       {
-        class: 'logo-layer-data',
+        class: "logo-layer-data",
         src: logo_data,
-        alt: 'OpenNeuro Logo',
+        alt: "OpenNeuro Logo",
       },
     ],
     logoText: true,
-    privacyDetail: '',
-    privacyLink: 'https://www.stanford.edu/site/privacy/',
+    privacyDetail: "",
+    privacyLink: "https://www.stanford.edu/site/privacy/",
   },
   navBar: {
     brand: {
       src: brand_mark,
-      alt: 'OpenNeuro Logo',
-      title: 'OpenNeuro Link to Home Page',
+      alt: "OpenNeuro Logo",
+      title: "OpenNeuro Link to Home Page",
       text: {
-        first: 'Open',
-        second: 'Neuro',
+        first: "Open",
+        second: "Neuro",
       },
     },
   },
@@ -58,42 +58,42 @@ export const frontPage = {
   collaborators: true,
   support: [
     {
-      title: 'Arnold Foundation',
-      alt: 'Arnold Foundation',
+      title: "Arnold Foundation",
+      alt: "Arnold Foundation",
       logo: ljaf,
-      link: 'http://www.arnoldfoundation.org/',
+      link: "http://www.arnoldfoundation.org/",
       width: 4,
       offset: 0,
     },
     {
-      title: 'NSF',
-      alt: 'National Science Foundation',
+      title: "NSF",
+      alt: "National Science Foundation",
       logo: nsf,
-      link: 'https://www.nsf.gov/',
+      link: "https://www.nsf.gov/",
       width: 4,
       offset: 0,
     },
     {
-      title: 'NIH',
-      alt: 'National Institute on Drug and Abuse',
+      title: "NIH",
+      alt: "National Institute on Drug and Abuse",
       logo: nih,
-      link: 'https://nih.gov',
+      link: "https://nih.gov",
       width: 4,
       offset: 0,
     },
     {
-      title: 'Stanford',
-      alt: 'Stanford',
+      title: "Stanford",
+      alt: "Stanford",
       logo: stanford,
-      link: 'https://www.stanford.edu',
+      link: "https://www.stanford.edu",
       width: 3,
       offset: 3,
     },
     {
-      title: 'Squishymedia',
-      alt: 'Squishymedia',
+      title: "Squishymedia",
+      alt: "Squishymedia",
       logo: squishymedia,
-      link: 'https://squishymedia.com',
+      link: "https://squishymedia.com",
       width: 3,
       offset: 0,
     },

package/src/scripts/pages/front-page/front-page.tsx

@@ -1,18 +1,18 @@
-import { apm } from '../../apm'
-import React from 'react'
-import { gql, useQuery } from '@apollo/client'
-import { Mutation } from '@apollo/client/react/components'
-import styled from '@emotion/styled'
+import { apm } from "../../apm"
+import React from "react"
+import { gql, useQuery } from "@apollo/client"
+import { Mutation } from "@apollo/client/react/components"
+import styled from "@emotion/styled"
 
 import {
-  AffiliateBlock,
   ActivityHeader,
+  AffiliateBlock,
   Contributors,
   GetUpdates,
   Infographic,
-} from '@openneuro/components/front-page'
-import { Loading } from '@openneuro/components/loading'
-import { ActivitySlider } from '@openneuro/components/activity-slider'
+} from "@openneuro/components/front-page"
+import { Loading } from "@openneuro/components/loading"
+import { ActivitySlider } from "@openneuro/components/activity-slider"
 
 const SUBSCRIBE_TO_NEWSLETTER = gql`
   mutation subscribeToNewsletter($email: String!) {
@@ -100,7 +100,7 @@ const responsive = {
 
 export const FrontPageTopQuery = ({ query }) => {
   const result = useQuery(query, {
-    errorPolicy: 'all',
+    errorPolicy: "all",
   })
   if (result.loading) {
     return (
@@ -114,7 +114,9 @@ export const FrontPageTopQuery = ({ query }) => {
     return <div>Failed to load top datasets, please try again later.</div>
   } else {
     // Remove any edges which could not be loaded
-    const edges = result.data.datasets.edges.filter(dataset => dataset !== null)
+    const edges = result.data.datasets.edges.filter((dataset) =>
+      dataset !== null
+    )
     return (
       <ActivitySlider
         data={edges}
@@ -131,7 +133,7 @@ export const FrontPageTopQuery = ({ query }) => {
 
 export const FrontPageNewQuery = ({ query }) => {
   const result = useQuery(query, {
-    errorPolicy: 'all',
+    errorPolicy: "all",
   })
   if (result.loading) {
     return <Loading />
@@ -140,7 +142,9 @@ export const FrontPageNewQuery = ({ query }) => {
     return <div>Failed to load top datasets, please try again later.</div>
   } else {
     // Remove any edges which could not be loaded
-    const edges = result.data.datasets.edges.filter(dataset => dataset !== null)
+    const edges = result.data.datasets.edges.filter((dataset) =>
+      dataset !== null
+    )
     return (
       <ActivitySlider
         data={edges}
@@ -193,7 +197,7 @@ const FrontPageContainer: React.FC = () => (
     </FrontPageSection>
     <FrontPageSection className="gray-bg">
       <Mutation mutation={SUBSCRIBE_TO_NEWSLETTER}>
-        {subscribeToNewsletter => (
+        {(subscribeToNewsletter) => (
           <GetUpdates
             subscribe={(email, cb) => {
               subscribeToNewsletter({ variables: { email } }).then(cb).catch(cb)

package/src/scripts/pages/front-page-comp.tsx

@@ -1,5 +1,5 @@
-import React from 'react'
-import styled from '@emotion/styled'
+import React from "react"
+import styled from "@emotion/styled"
 
 const FrontPageSection = styled.section`
   margin: 100px 0;
@@ -33,7 +33,7 @@ export const FrontPage: React.FC<FrontPageProps> = ({
   className,
 }) => (
   <>
-    <div className={className + ' page'}>
+    <div className={className + " page"}>
       <FrontPageSection>{renderAffiliateBlock()}</FrontPageSection>
       <FrontPageSection>
         <div className="container">{renderInfographic()}</div>

package/src/scripts/pages/import-dataset.tsx

@@ -1,11 +1,11 @@
-import React, { useState } from 'react'
-import styled from '@emotion/styled'
-import { ImportDatasetMutation } from '../dataset/mutations/import-dataset'
-import { useLocation } from 'react-router-dom'
-import LoggedIn from '../authentication/logged-in'
-import LoggedOut from '../authentication/logged-out'
-import { testAffirmed } from '../uploader/upload-disclaimer'
-import { UploadDisclaimerInput } from '../uploader/upload-disclaimer-input'
+import React, { useState } from "react"
+import styled from "@emotion/styled"
+import { ImportDatasetMutation } from "../dataset/mutations/import-dataset"
+import { useLocation } from "react-router-dom"
+import LoggedIn from "../authentication/logged-in"
+import LoggedOut from "../authentication/logged-out"
+import { testAffirmed } from "../uploader/upload-disclaimer"
+import { UploadDisclaimerInput } from "../uploader/upload-disclaimer-input"
 
 function useQuery() {
   const { search } = useLocation()
@@ -22,7 +22,7 @@ const ImportDatasetPageStyle = styled.div`
 `
 
 export const ImportDataset: React.VoidFunctionComponent = () => {
-  const url = useQuery().get('url')
+  const url = useQuery().get("url")
   const [affirmedDefaced, setAffirmedDefaced] = useState(false)
   const [affirmedConsent, setAffirmedConsent] = useState(false)
   return (
@@ -30,7 +30,7 @@ export const ImportDataset: React.VoidFunctionComponent = () => {
       <div className="container">
         <h2>Import a dataset from remote URL</h2>
         <p>
-          Use this page to import a new OpenNeuro dataset from{' '}
+          Use this page to import a new OpenNeuro dataset from{" "}
           <a href="https://brainlife.io/ezbids/">ezBIDS</a>. After submitting an
           import, please allow some time for processing and you will receive an
           email notification when complete.

package/src/scripts/pages/metadata/dataset-metadata.tsx

@@ -1,9 +1,9 @@
-import React from 'react'
-import styled from '@emotion/styled'
-import { DataTable } from '../../components/data-table'
-import { gql, useQuery } from '@apollo/client'
-import { Loading } from '@openneuro/components/loading'
-import { makeCsv } from '../../utils/csv'
+import React from "react"
+import styled from "@emotion/styled"
+import { DataTable } from "../../components/data-table"
+import { gql, useQuery } from "@apollo/client"
+import { Loading } from "@openneuro/components/loading"
+import { makeCsv } from "../../utils/csv"
 
 const MetadataPageStyle = styled.div`
   background: white;
@@ -50,7 +50,7 @@ const METADATA_QUERY = gql`
 
 export function DatasetMetadata(): React.ReactElement {
   const { loading, error, data } = useQuery(METADATA_QUERY, {
-    errorPolicy: 'all',
+    errorPolicy: "all",
   })
   if (loading || error) {
     return <Loading />
@@ -64,8 +64,8 @@ export function DatasetMetadata(): React.ReactElement {
             className="on-button on-button--small on-button--primary icon-text"
             aria-label="Download"
             onClick={() =>
-              makeCsv(data?.publicMetadata, 'openneuro-metadata.csv')
-            }>
+              makeCsv(data?.publicMetadata, "openneuro-metadata.csv")}
+          >
             <i className="fa fa-download css-0" aria-hidden="true"></i>Download
             CSV
           </MetadataPageButton>
@@ -75,11 +75,12 @@ export function DatasetMetadata(): React.ReactElement {
           data={data?.publicMetadata}
           downloadFilename="openneuro-metadata.csv"
           hideColumns={[
-            '__typename',
-            'datasetUrl',
-            'affirmedDefaced',
-            'affirmedConsent',
-          ]}></DataTable>
+            "__typename",
+            "datasetUrl",
+            "affirmedDefaced",
+            "affirmedConsent",
+          ]}
+        />
       </MetadataPageStyle>
     )
   }

package/src/scripts/pages/pet-redirect.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
-import { Navigate } from 'react-router-dom'
+import React from "react"
+import { Navigate } from "react-router-dom"
 
 export const PETRedirect = () => <Navigate to="/search/modality/pet" replace />