@openneuro/app 4.1.2 → 4.2.3

package/src/scripts/{datalad → refactor_2021/dataset}/download/__tests__/__snapshots__/shell-example.spec.jsx.snap

@@ -1,7 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`dataset/download/ShellExample renders successfully 1`] = `
-<ContextConsumer>
-  <Component />
-</ContextConsumer>
+<Fragment>
+  <Noop />
+  <pre
+    className="css-xak41w"
+  />
+</Fragment>
 `;

package/src/scripts/refactor_2021/dataset/download/download-datalad.jsx

@@ -1,22 +1,53 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { getConfig } from '../../../config'
+import { getConfig, config } from '../../../config'
 import ShellExample from './shell-example.jsx'
+import {
+  getUnexpiredProfile,
+  hasEditPermissions,
+} from '../../authentication/profile'
+import { useCookies } from 'react-cookie'
 
-const DownloadDataladExample = ({ datasetId, githubOrganization }) => (
-  <ShellExample>
-    datalad install https://github.com/
-    {githubOrganization}/{datasetId}
-    .git
-  </ShellExample>
-)
+const DownloadDataladExample = ({
+  datasetId,
+  githubOrganization,
+  workerId,
+  datasetPermissions,
+}) => {
+  const [cookies] = useCookies()
+  const profile = getUnexpiredProfile(cookies)
+  const isAdmin = profile?.admin
+  const hasEdit =
+    hasEditPermissions(datasetPermissions, profile?.sub) || isAdmin
+  return (
+    <>
+      <ShellExample>
+        datalad install https://github.com/
+        {githubOrganization}/{datasetId}
+        .git
+      </ShellExample>
+      {hasEdit && (
+        <ShellExample>
+          datalad install {config.url}/git/{workerId}/{datasetId}
+        </ShellExample>
+      )}
+    </>
+  )
+}
 
 DownloadDataladExample.propTypes = {
   datasetId: PropTypes.string,
   githubOrganization: PropTypes.string,
+  workerId: PropTypes.string,
+  datasetPermissions: PropTypes.object,
 }
 
-const DownloadDataladInstructions = ({ datasetId, githubOrganization }) => (
+const DownloadDataladInstructions = ({
+  datasetId,
+  githubOrganization,
+  workerId,
+  datasetPermissions,
+}) => (
   <div>
     <h4>Download with DataLad</h4>
     <p>
@@ -30,10 +61,12 @@ const DownloadDataladInstructions = ({ datasetId, githubOrganization }) => (
     <DownloadDataladExample
       datasetId={datasetId}
       githubOrganization={githubOrganization}
+      workerId={workerId}
+      datasetPermissions={datasetPermissions}
     />
     <p>
       Check out{' '}
-      <a href="http://handbook.datalad.org/r.html?openneuro">
+      <a href="https://handbook.datalad.org/en/latest/usecases/openneuro.html">
         getting started with DataLad
       </a>{' '}
       for more on how to use this download method.
@@ -44,6 +77,8 @@ const DownloadDataladInstructions = ({ datasetId, githubOrganization }) => (
 DownloadDataladInstructions.propTypes = {
   datasetId: PropTypes.string,
   githubOrganization: PropTypes.string,
+  workerId: PropTypes.string,
+  datasetPermissions: PropTypes.object,
 }
 
 const DownloadDatalad = props =>

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

@@ -112,8 +112,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
                   field="Name"
                   rows={2}
                   description={description.Name}
-                  editMode={hasEdit}
-                >
+                  editMode={hasEdit}>
                   {description.Name}
                 </EditDescriptionField>
               )}
@@ -174,6 +173,8 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
           <CloneDropdown
             gitAccess={
               <DatasetGitAccess
+                hasEdit={hasEdit}
+                configGithub={config.github}
                 configUrl={config.url}
                 worker={dataset.worker}
                 datasetId={datasetId}
@@ -197,8 +198,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
             fileTree={true}
             id="collapse-tree"
             expandLabel="Expand File Tree"
-            collapseabel="Collapse File Tree"
-          >
+            collapseLabel="Collapse File Tree">
             <Files
               datasetId={datasetId}
               snapshotTag={null}
@@ -220,13 +220,11 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
                 field="readme"
                 rows={12}
                 description={dataset.draft.readme}
-                editMode={hasEdit}
-              >
+                editMode={hasEdit}>
                 <ReadMore
                   id="readme"
                   expandLabel="Read More"
-                  collapseabel="Collapse"
-                >
+                  collapseLabel="Collapse">
                   <Markdown>{dataset.draft.readme || 'N/A'}</Markdown>
                 </ReadMore>
               </EditDescriptionField>
@@ -241,8 +239,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
               field="Authors"
               heading="Authors"
               description={description.Authors}
-              editMode={hasEdit}
-            >
+              editMode={hasEdit}>
               {description.Authors?.length ? description.Authors : ['N/A']}
             </EditDescriptionList>
 
@@ -374,8 +371,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
                   field="Acknowledgements"
                   rows={2}
                   description={description.Acknowledgements}
-                  editMode={hasEdit}
-                >
+                  editMode={hasEdit}>
                   <Markdown>{description.Acknowledgements || 'N/A'}</Markdown>
                 </EditDescriptionField>
               )}
@@ -390,8 +386,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
                   field="HowToAcknowledge"
                   rows={2}
                   description={description.HowToAcknowledge}
-                  editMode={hasEdit}
-                >
+                  editMode={hasEdit}>
                   <Markdown>{description.HowToAcknowledge || 'N/A'}</Markdown>
                 </EditDescriptionField>
               )}
@@ -403,8 +398,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
               field="Funding"
               heading="Funding"
               description={description.Funding}
-              editMode={hasEdit}
-            >
+              editMode={hasEdit}>
               {description.Funding?.length ? description.Funding : ['N/A']}
             </EditDescriptionList>
 
@@ -414,8 +408,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
               field="ReferencesAndLinks"
               heading="References and Links"
               description={description.ReferencesAndLinks}
-              editMode={hasEdit}
-            >
+              editMode={hasEdit}>
               {description.ReferencesAndLinks?.length
                 ? description.ReferencesAndLinks
                 : ['N/A']}
@@ -427,8 +420,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
               field="EthicsApprovals"
               heading="Ethics Approvals"
               description={description.EthicsApprovals}
-              editMode={hasEdit}
-            >
+              editMode={hasEdit}>
               {description.EthicsApprovals?.length
                 ? description.EthicsApprovals
                 : ['N/A']}
@@ -440,8 +432,7 @@ const DraftContainer: React.FC<DraftContainerProps> = ({ dataset }) => {
             isOpen={deprecatedmodalIsOpen}
             toggle={() => setDeprecatedModalIsOpen(prevIsOpen => !prevIsOpen)}
             closeText={'close'}
-            className="deprecated-modal"
-          >
+            className="deprecated-modal">
             <p>
               You have selected a deprecated version. The author of the dataset
               does not recommend this specific version.

package/src/scripts/refactor_2021/dataset/files/file-tree.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React from 'react'
 import PropTypes from 'prop-types'
 import File from './file.jsx'
 import UpdateFile from '../mutations/update-file.jsx'
@@ -41,13 +41,14 @@ const FileTree = ({
             <UpdateFile
               datasetId={datasetId}
               path={unescapePath(path)}
+              tooltip={`Choose one or more files to be added to ${name}.`}
               multiple>
               <i className="fa fa-plus" /> Add Files
             </UpdateFile>
             <UpdateFile
               datasetId={datasetId}
               path={unescapePath(path)}
-              tooltip={`Choose a folder to be added to /${name}. Adding a folder with an existing name will overwrite that folder.`}
+              tooltip={`Choose a folder to be added to ${name}. Adding a folder with an existing name will overwrite that folder.`}
               directory>
               <i className="fa fa-plus" /> Add Directory
             </UpdateFile>

package/src/scripts/refactor_2021/dataset/fragments/__tests__/__snapshots__/cancel-button.spec.tsx.snap

@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CancelButton component renders with default props 1`] = `
+<Button
+  className="description-btn description-button-cancel"
+  icon="fas fa-times"
+  label="Cancel"
+  onClick={[Function]}
+/>
+`;

package/src/scripts/refactor_2021/dataset/fragments/__tests__/__snapshots__/edit-button.spec.tsx.snap

@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EditButton component renders with default props 1`] = `
+<Button
+  className="description-btn description-button-edit"
+  icon="fas fa-edit"
+  label="Edit"
+  onClick={[Function]}
+/>
+`;

package/src/scripts/refactor_2021/dataset/fragments/__tests__/__snapshots__/edit-list.spec.jsx.snap

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EditList component renders with default props 1`] = `
+<DocumentFragment>
+  <div
+    class="edit-list-group"
+  >
+    <input
+      class="form-control"
+      type="text"
+      value=""
+    />
+    <button
+      aria-label="Add"
+      class="on-button on-button--small on-button--primary  edit-list-add"
+      role="button"
+      type="button"
+    >
+      Add
+    </button>
+  </div>
+  <div />
+</DocumentFragment>
+`;

package/src/scripts/refactor_2021/dataset/fragments/__tests__/__snapshots__/save-button.spec.tsx.snap

@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SaveButton component renders with default props 1`] = `
+<Button
+  className="description-btn description-button-save"
+  icon="fas fa-check"
+  label="Save"
+  onClick={[Function]}
+/>
+`;

package/src/scripts/{datalad/fragments/__tests__/cancel-button.spec.jsx → refactor_2021/dataset/fragments/__tests__/cancel-button.spec.tsx}

@@ -1,10 +1,10 @@
 import React from 'react'
 import { shallow } from 'enzyme'
-import CancelButton from '../cancel-button.jsx'
+import { CancelButton } from '../cancel-button'
 
 describe('CancelButton component', () => {
   it('renders with default props', () => {
-    const wrapper = shallow(<CancelButton />)
+    const wrapper = shallow(<CancelButton action={() => {}} />)
     expect(wrapper).toMatchSnapshot()
   })
 })

package/src/scripts/{datalad/fragments/__tests__/edit-button.spec.jsx → refactor_2021/dataset/fragments/__tests__/edit-button.spec.tsx}

@@ -1,10 +1,10 @@
 import React from 'react'
 import { shallow } from 'enzyme'
-import EditButton from '../edit-button.jsx'
+import { EditButton } from '../edit-button'
 
 describe('EditButton component', () => {
   it('renders with default props', () => {
-    const wrapper = shallow(<EditButton />)
+    const wrapper = shallow(<EditButton action={() => {}} />)
     expect(wrapper).toMatchSnapshot()
   })
 })

package/src/scripts/refactor_2021/dataset/fragments/__tests__/edit-list.spec.jsx

@@ -0,0 +1,27 @@
+import React from 'react'
+import { render, fireEvent, screen } from '@testing-library/react'
+import EditList from '../edit-list.jsx'
+
+// Mount is used because enzyme does not yet support hooks
+describe('EditList component', () => {
+  it('renders with default props', () => {
+    const { asFragment } = render(<EditList />)
+    expect(asFragment()).toMatchSnapshot()
+  })
+  it('calls setElements when an item is added', () => {
+    const testText = 'this is a test entry'
+    const setElements = jest.fn()
+    render(<EditList setElements={setElements} />)
+    fireEvent.change(screen.getByRole('textbox'), {
+      target: { value: testText },
+    })
+    fireEvent.click(screen.getByLabelText('Add'))
+    // Added an empty string to an empty list
+    expect(setElements).toHaveBeenCalledWith([testText])
+  })
+  it('renders any elements', () => {
+    render(<EditList elements={['One', 'Two']} />)
+    expect(screen.getByText('One')).toBeVisible()
+    expect(screen.getByText('Two')).toBeVisible()
+  })
+})

package/src/scripts/{datalad/fragments/__tests__/save-button.spec.jsx → refactor_2021/dataset/fragments/__tests__/save-button.spec.tsx}

@@ -1,10 +1,10 @@
 import React from 'react'
 import { shallow } from 'enzyme'
-import SaveButton from '../edit-button.jsx'
+import { SaveButton } from '../save-button'
 
 describe('SaveButton component', () => {
   it('renders with default props', () => {
-    const wrapper = shallow(<SaveButton />)
+    const wrapper = shallow(<SaveButton action={() => {}} />)
     expect(wrapper).toMatchSnapshot()
   })
 })

package/src/scripts/refactor_2021/dataset/mutations/__tests__/__snapshots__/delete.spec.jsx.snap

@@ -0,0 +1,50 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DeleteDataset mutation renders with common props 1`] = `
+<DocumentFragment>
+  <span>
+    <button
+      class="on-button on-button--primary on-button--small"
+    >
+      <i
+        class="fa fa-trash"
+      />
+       Delete Dataset
+    </button>
+  </span>
+</DocumentFragment>
+`;
+
+exports[`DeleteDir mutation renders with common props 1`] = `
+<DocumentFragment>
+  <span
+    class="delete-file"
+  >
+    <div
+      class="warn-btn edit-file"
+    >
+      <span
+        class=" "
+        data-flow="up"
+        data-tooltip="Delete undefined"
+      >
+        <span
+          class="warn-btn-click"
+        >
+          <button
+            aria-label=""
+            class="on-button on-button--medium on-button--default  btn-warn-component"
+            role="button"
+            type="button"
+          >
+            <i
+              aria-hidden="true"
+              class="fa fa-trash css-1qxtz39"
+            />
+          </button>
+        </span>
+      </span>
+    </div>
+  </span>
+</DocumentFragment>
+`;

package/src/scripts/refactor_2021/dataset/mutations/__tests__/__snapshots__/update-permissions.spec.jsx.snap

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`UpdateDatasetPermissions mutation renders with default props 1`] = `
+<DocumentFragment>
+  <button
+    aria-label="Share"
+    class="on-button on-button--small on-button--primary  btn-modal-action"
+    role="button"
+    type="button"
+  >
+    Share
+  </button>
+</DocumentFragment>
+`;
+
+exports[`UpdateDatasetPermissions mutation renders with typical props 1`] = `
+<DocumentFragment>
+  <button
+    aria-label="Share"
+    class="on-button on-button--small on-button--primary  btn-modal-action"
+    role="button"
+    type="button"
+  >
+    Share
+  </button>
+</DocumentFragment>
+`;

package/src/scripts/{datalad → refactor_2021/dataset}/mutations/__tests__/delete.spec.jsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { render, waitFor, fireEvent } from '@testing-library/react'
+import { render, fireEvent, screen } from '@testing-library/react'
 import { MockedProvider } from '@apollo/client/testing'
 import DeleteDataset, { DELETE_DATASET } from '../delete.jsx'
 import DeleteDir, { DELETE_FILES } from '../delete-dir.jsx'
@@ -35,18 +35,18 @@ const deleteDirMock = {
 
 describe('DeleteDataset mutation', () => {
   it('renders with common props', () => {
-    const wrapper = render(
+    const { asFragment } = render(
       <MockedProvider mocks={[deleteDatasetMock]} addTypename={false}>
         <DeleteDataset datasetId="ds001" />
       </MockedProvider>,
     )
-    expect(wrapper).toMatchSnapshot()
+    expect(asFragment()).toMatchSnapshot()
   })
 })
 
 describe('DeleteDir mutation', () => {
   it('renders with common props', () => {
-    const wrapper = render(
+    const { asFragment } = render(
       <MockedProvider mocks={[deleteDirMock]} addTypename={false}>
         <DeleteDir
           datasetId="ds002"
@@ -58,19 +58,19 @@ describe('DeleteDir mutation', () => {
         />
       </MockedProvider>,
     )
-    expect(wrapper).toMatchSnapshot()
+    expect(asFragment()).toMatchSnapshot()
   })
   it('fires the correct mutation', async done => {
-    const { container } = render(
+    render(
       <MockedProvider mocks={[deleteDirMock]} addTypename={false}>
         <DeleteDir {...{ datasetId, path }} />
       </MockedProvider>,
     )
 
     // click "Delete" button
-    fireEvent.click(container.querySelector('button.warning'))
+    fireEvent.click(screen.getByRole('button'))
     // confirm delete
-    fireEvent.click(container.querySelector('button.success'))
+    fireEvent.click(screen.getByLabelText('confirm'))
 
     expect(deleteDirMock.newData).toHaveBeenCalled()
     done()

package/src/scripts/{datalad/mutations/__tests__/remove-permissions.spec.jsx → refactor_2021/dataset/mutations/__tests__/remove-permissions.spec.tsx}

@@ -1,4 +1,4 @@
-import { userPermissionsFilter } from '../remove-permissions.jsx'
+import { userPermissionsFilter } from '../remove-permissions'
 
 describe('RemovePermissions mutation', () => {
   describe('userPermissionsFilter()', () => {

package/src/scripts/refactor_2021/dataset/mutations/__tests__/update-permissions.spec.jsx

@@ -0,0 +1,28 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import { MockedProvider } from '@apollo/client/testing'
+import { UpdateDatasetPermissions } from '../update-permissions'
+
+describe('UpdateDatasetPermissions mutation', () => {
+  it('renders with default props', () => {
+    const { asFragment } = render(
+      <MockedProvider>
+        <UpdateDatasetPermissions />
+      </MockedProvider>,
+    )
+    expect(asFragment()).toMatchSnapshot()
+  })
+  it('renders with typical props', () => {
+    const { asFragment } = render(
+      <MockedProvider>
+        <UpdateDatasetPermissions
+          datasetId="ds000005"
+          userEmail="test@example.com"
+          access="ro"
+          done={jest.fn()}
+        />
+      </MockedProvider>,
+    )
+    expect(asFragment()).toMatchSnapshot()
+  })
+})

package/src/scripts/refactor_2021/dataset/mutations/update-file.jsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import UploaderContext from '../../uploader/uploader-context.js'
-import Tooltip from '../../../common/partials/tooltip.jsx'
+import { Tooltip } from '@openneuro/components/tooltip'
 
 const UpdateFile = ({
   datasetId,
@@ -30,8 +30,8 @@ const UpdateFile = ({
               webkitdirectory={directory && 'true'}
               multiple={multiple && true}
             />
+            {children}
           </Tooltip>
-          {children}
         </div>
       )}
     </UploaderContext.Consumer>

package/src/scripts/refactor_2021/dataset/routes/download-dataset.tsx

@@ -0,0 +1,76 @@
+/* global globalThis */
+import React from 'react'
+import PropTypes from 'prop-types'
+import { Link, useRouteMatch } from 'react-router-dom'
+import DownloadLink from '../download/download-link.jsx'
+import DownloadS3 from '../download/download-s3.jsx'
+import DownloadCommandLine from '../download/download-command-line.jsx'
+import DownloadDatalad from '../download/download-datalad.jsx'
+
+interface SnapshotRouteParams {
+  datasetId?: string
+  snapshotId?: string
+}
+
+const DownloadDataset = ({ worker, datasetPermissions }) => {
+  const {
+    params: { datasetId, snapshotId: snapshotTag },
+  } = useRouteMatch<SnapshotRouteParams>()
+  const workerId = worker?.split('-').pop()
+  return (
+    <div>
+      <div className="container">
+        <div className="grid grid-between">
+          <div className="col col-12">
+            <h3>How to Download</h3>
+          </div>
+          <div className="col col-lg">
+            {'showDirectoryPicker' in globalThis ? (
+              <DownloadLink datasetId={datasetId} snapshotTag={snapshotTag} />
+            ) : (
+              <DownloadCommandLine
+                datasetId={datasetId}
+                snapshotTag={snapshotTag}
+              />
+            )}
+          </div>
+          <div className="col col-lg">
+            <DownloadS3 datasetId={datasetId} />
+          </div>
+        </div>
+        <hr />
+        <div className="grid grid-between">
+          {'showDirectoryPicker' in globalThis && (
+            <div className="col col-lg">
+              <DownloadCommandLine
+                datasetId={datasetId}
+                snapshotTag={snapshotTag}
+              />
+            </div>
+          )}
+          <div className="col col-lg">
+            <DownloadDatalad
+              datasetId={datasetId}
+              workerId={workerId}
+              datasetPermissions={datasetPermissions}
+            />
+          </div>
+        </div>
+        <div className="grid grid-between">
+          <div className="col">
+            <Link className="return-link m-l-0" to={`/datasets/${datasetId}`}>
+              Return to Dataset
+            </Link>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+DownloadDataset.propTypes = {
+  worker: PropTypes.string,
+  datasetPermissions: PropTypes.object,
+}
+
+export default DownloadDataset