@openneuro/app 4.2.0 → 4.2.1

package/src/scripts/uploader/upload-metadata.jsx

@@ -1,59 +0,0 @@
-import React, { useState } from 'react'
-import MetadataForm from '../datalad/mutations/metadata-form.jsx'
-import UploaderContext from './uploader-context.js'
-import styled from '@emotion/styled'
-
-const Container = styled.div`
-  &.message.fade-in {
-    padding: 20px 0;
-  }
-`
-
-const UploadMetadata = () => {
-  const [values, setValues] = useState({
-    associatedPaperDOI: '',
-    species: '',
-    studyLongitudinal: '',
-    studyDomain: '',
-    trialCount: undefined,
-    studyDesign: '',
-    openneuroPaperDOI: '',
-    dxStatus: '',
-    grantFunderName: '',
-    grantIdentifier: '',
-  })
-  const handleInputChange = (name, value) => {
-    const newValues = {
-      ...values,
-      [name]: value,
-    }
-    setValues(newValues)
-  }
-
-  return (
-    <UploaderContext.Consumer>
-      {uploader => (
-        <Container className="message fade-in">
-          <MetadataForm
-            values={values}
-            onChange={handleInputChange}
-            hideDisabled={true}
-            hiddenFields={['affirmedConsent', 'affirmedDefaced']}
-            hasEdit={true}
-          />
-          <br />
-          <button
-            className="fileupload-btn btn-blue"
-            disabled={false}
-            onClick={() => {
-              uploader.captureMetadata(values)
-              uploader.setLocation('/upload/disclaimer')
-            }}>
-            Continue
-          </button>
-        </Container>
-      )}
-    </UploaderContext.Consumer>
-  )
-}
-export default UploadMetadata

package/src/scripts/uploader/upload-mutation.js

@@ -1,111 +0,0 @@
-import { datasets, uploads } from '@openneuro/client'
-import { SUBMIT_METADATA } from '../datalad/mutations/submit-metadata.jsx'
-
-/**
- * Create a dataset and update the label
- * @param {object} client Apollo client
- */
-export const createDataset = client => ({
-  affirmedDefaced,
-  affirmedConsent,
-}) => {
-  return client
-    .mutate({
-      mutation: datasets.createDataset,
-      variables: { affirmedDefaced, affirmedConsent },
-      errorPolicy: 'all',
-    })
-    .then(({ data }) => data.createDataset.id)
-}
-
-/**
- * Create a dataset and update the label
- * @param {object} client Apollo client
- */
-export const prepareUpload = client => ({ datasetId, uploadId }) => {
-  return client.mutate({
-    mutation: uploads.prepareUpload,
-    variables: { datasetId, uploadId },
-  })
-}
-
-/**
- * Complete upload
- * @param {object} client Apollo client
- */
-export const finishUpload = client => uploadId => {
-  return client.mutate({
-    mutation: uploads.finishUpload,
-    variables: { uploadId },
-  })
-}
-
-/**
- * Recursively add a file and any needed directories to a tree
- * @param {Object} file
- * @param {Object} parent
- * @param {Array} tokens
- */
-export const mkLevels = (file, parent, tokens) => {
-  if (tokens.length === 1) {
-    // Leafs are files
-    //file.path = `${parent.path}${file.name}`
-    //file.relativePath = file.path
-    parent.files.push(file)
-  } else {
-    // Nodes are directories
-    const dirName = tokens.shift()
-    const dirIndex = parent.directories.findIndex(
-      dir => dir.name === `${parent.name}/${dirName}`,
-    )
-    if (dirIndex !== -1) {
-      // Directory exists
-      mkLevels(file, parent.directories[dirIndex], tokens)
-    } else {
-      // Create directory
-      const newDir = {
-        name: parent.name ? `${parent.name}/${dirName}` : dirName,
-        files: [],
-        directories: [],
-      }
-      parent.directories.push(newDir)
-      mkLevels(file, newDir, tokens)
-    }
-  }
-}
-
-/**
- * Convert from an file input list to a FileTreeInput object
- * @param {object} fileList Browser FileList from file input
- */
-export const treeFromList = fileList => {
-  const tree = { name: '', files: [], directories: [] }
-
-  for (const file of fileList) {
-    if (file.webkitRelativePath) {
-      const tokens = file.webkitRelativePath.split('/')
-      // Skip the top level, it is created above
-      tokens.shift()
-      mkLevels(file, tree, tokens)
-    } else {
-      // Single file case
-      tree.files = [...fileList]
-    }
-  }
-
-  return tree
-}
-
-export const submitMetadata = client => (datasetId, metadata) => {
-  return client.mutate({
-    mutation: SUBMIT_METADATA,
-    variables: {
-      datasetId,
-      metadata: {
-        datasetId,
-        ...metadata,
-      },
-    },
-    errorPolicy: 'all',
-  })
-}

package/src/scripts/uploader/upload-progress-button.jsx

@@ -1,20 +0,0 @@
-import React from 'react'
-import UploaderContext from './uploader-context.js'
-import UploadProgress from './upload-progress.jsx'
-
-const UploadProgressButton = () => (
-  <UploaderContext.Consumer>
-    {uploader => (
-      <span className="upload-btn-wrap">
-        <a
-          className="nav-link nl-upload nl-progress"
-          onClick={() => uploader.setLocation('/upload')}>
-          <span className="link-name">view details</span>
-          <UploadProgress progress={uploader.progress} />
-        </a>
-      </span>
-    )}
-  </UploaderContext.Consumer>
-)
-
-export default UploadProgressButton

package/src/scripts/uploader/upload-progress-class.js

@@ -1,36 +0,0 @@
-export class UploadProgress {
-  constructor(onProgress, total) {
-    this.onProgress = onProgress
-    this.state = 0
-    this.total = total
-    this.uploading = new Set()
-    this.failed = new Set()
-  }
-  increment(n = 1) {
-    this.state = this.state + n
-    this._notifySubscriber()
-  }
-  startUpload(file) {
-    this.uploading.add(file)
-    this._notifySubscriber()
-  }
-  finishUpload(file) {
-    this.uploading.delete(file)
-    this.failed.delete(file)
-    this._notifySubscriber()
-  }
-  failUpload(file) {
-    this.uploading.delete(file)
-    this.failed.add(file)
-    this._notifySubscriber()
-  }
-  _notifySubscriber() {
-    window.requestAnimationFrame(() => {
-      this.onProgress({
-        progress: Math.floor((this.state / this.total) * 100),
-        uploadingFiles: this.uploading,
-        failedFiles: this.failed,
-      })
-    })
-  }
-}

package/src/scripts/uploader/upload-progress.jsx

@@ -1,15 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { ProgressBar } from 'react-bootstrap'
-
-const UploadProgress = ({ progress }) => (
-  <div className="upload-progress-block">
-    <ProgressBar active bsStyle="success" now={progress} key={2} />
-  </div>
-)
-
-UploadProgress.propTypes = {
-  progress: PropTypes.number,
-}
-
-export default UploadProgress

package/src/scripts/uploader/upload-rename.jsx

@@ -1,33 +0,0 @@
-import React from 'react'
-import Input from '../common/forms/input.jsx'
-import UploaderContext from './uploader-context.js'
-
-const UploadRename = () => (
-  <UploaderContext.Consumer>
-    {uploader => (
-      <div className="message fade-in">
-        Rename your dataset (optional)
-        <div className="dir-name has-input clearfix fade-in">
-          <label className="add-name">
-            <i className="folderIcon fa fa-folder-open" />
-          </label>
-          <Input
-            type="text"
-            placeholder="dataset name"
-            initialValue={uploader.name}
-            onChange={uploader.setName}
-          />
-        </div>
-        <br />
-        <button
-          className="fileupload-btn btn-blue"
-          disabled={false}
-          onClick={() => uploader.setLocation('/upload/issues')}>
-          Continue
-        </button>
-      </div>
-    )}
-  </UploaderContext.Consumer>
-)
-
-export default UploadRename

package/src/scripts/uploader/upload-resume.jsx

@@ -1,35 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import FileSelect from '../common/forms/file-select'
-import UploaderContext from './uploader-context.js'
-
-const UploadResume = ({ datasetId }) => (
-  <UploaderContext.Consumer>
-    {uploader =>
-      uploader.uploading ? (
-        <button
-          className="fileupload-btn btn-admin"
-          disabled={true}
-          title="Please wait for your current upload to finish before resuming">
-          <span>
-            <i className="fa fa-repeat" />
-            &nbsp;
-          </span>
-          Resume
-        </button>
-      ) : (
-        <FileSelect
-          onChange={uploader.resumeDataset(datasetId)}
-          resume
-          disabled={uploader.uploading}
-        />
-      )
-    }
-  </UploaderContext.Consumer>
-)
-
-UploadResume.propTypes = {
-  datasetId: PropTypes.string,
-}
-
-export default UploadResume

package/src/scripts/uploader/upload-select.jsx

@@ -1,29 +0,0 @@
-import React from 'react'
-import FileSelect from '../common/forms/file-select'
-import UploaderContext from './uploader-context.js'
-
-const UploadSelect = () => (
-  <div>
-    <UploaderContext.Consumer>
-      {uploader => (
-        <div className="message fade-in">
-          <p>
-            To protect the privacy of the individuals who have been scanned, we
-            require that all scan data be defaced before publishing a dataset.
-          </p>
-          Select a{' '}
-          <a
-            href="http://bids.neuroimaging.io"
-            target="_blank"
-            rel="noopener noreferrer">
-            BIDS dataset
-          </a>{' '}
-          to upload
-          <FileSelect onChange={uploader.selectFiles} />
-        </div>
-      )}
-    </UploaderContext.Consumer>
-  </div>
-)
-
-export default UploadSelect

package/src/scripts/uploader/upload-status.jsx

@@ -1,23 +0,0 @@
-import React from 'react'
-import UploaderContext from './uploader-context.js'
-import UploadProgress from './upload-progress.jsx'
-import UploadFileStatus from './upload-file-status.jsx'
-
-const UploadStatus = () => (
-  <UploaderContext.Consumer>
-    {uploader => (
-      <div>
-        <h4>
-          {uploader.name} - Uploading {uploader.files.length} files.
-        </h4>
-        <UploadProgress progress={uploader.progress} />
-        <UploadFileStatus
-          uploadingFiles={uploader.uploadingFiles}
-          failedFiles={uploader.failedFiles}
-        />
-      </div>
-    )}
-  </UploaderContext.Consumer>
-)
-
-export default UploadStatus

package/src/scripts/uploader/upload-step.jsx

@@ -1,48 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Grid, Row, Col } from 'react-bootstrap'
-
-const UploadStepCol = ({ active, text }) => {
-  const activeClasses = active
-    ? ['upload-step', 'upload-step-active']
-    : ['upload-step']
-  return (
-    <Col sm={6} md={3} className={activeClasses.join(' ')}>
-      {text}
-    </Col>
-  )
-}
-
-UploadStepCol.propTypes = {
-  active: PropTypes.bool,
-  text: PropTypes.string,
-}
-
-const UploadStep = ({ location }) => (
-  <Grid>
-    <Row>
-      <UploadStepCol
-        text="Step 1: Select Files"
-        active={location.pathname === '/upload'}
-      />
-      <UploadStepCol
-        text="Step 2: Validation"
-        active={location.pathname === '/upload/issues'}
-      />
-      <UploadStepCol
-        text="Step 3: Metadata"
-        active={location.pathname === '/upload/metadata'}
-      />
-      <UploadStepCol
-        text="Step 4: Accept Terms"
-        active={location.pathname === '/upload/disclaimer'}
-      />
-    </Row>
-  </Grid>
-)
-
-UploadStep.propTypes = {
-  location: PropTypes.object,
-}
-
-export default UploadStep

package/src/scripts/uploader/uploader-context.js

@@ -1,6 +0,0 @@
-import React from 'react'
-
-// Defaults are in the Uploader component
-const UploaderContext = React.createContext(undefined)
-
-export default UploaderContext

package/src/scripts/uploader/uploader-location.js

@@ -1,5 +0,0 @@
-// Helper functions for navigating the uploader dialog
-export const locationFactory = pathname => ({
-  pathname,
-  state: { uploader: true },
-})

package/src/scripts/uploader/uploader-modal.jsx

@@ -1,27 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Modal } from 'react-bootstrap'
-
-// Show is always {true} because the router unmounts this otherwise
-const UploaderModal = ({ setLocation, location, children, footer }) => (
-  <Modal
-    show={location.pathname !== '/hidden'}
-    onHide={() => setLocation('/hidden')}
-    className="upload-modal">
-    <Modal.Header closeButton>
-      <Modal.Title>Upload Dataset</Modal.Title>
-    </Modal.Header>
-    <hr className="modal-inner" />
-    <Modal.Body>{children}</Modal.Body>
-    {footer ? <Modal.Footer>{footer}</Modal.Footer> : null}
-  </Modal>
-)
-
-UploaderModal.propTypes = {
-  location: PropTypes.object,
-  children: PropTypes.node,
-  footer: PropTypes.node,
-  setLocation: PropTypes.func,
-}
-
-export default UploaderModal

package/src/scripts/uploader/uploader-setup-routes.jsx

@@ -1,52 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Route, Switch } from 'react-router-dom'
-import UploaderModal from './uploader-modal.jsx'
-import UploadStep from './upload-step.jsx'
-import UploadSelect from './upload-select.jsx'
-import UploadIssues from './upload-issues.jsx'
-import UploadMetadata from './upload-metadata.jsx'
-import UploadDisclaimer from './upload-disclaimer.jsx'
-
-const UploaderSetupRoutes = props => (
-  <UploaderModal {...props}>
-    <UploadStep location={props.location} />
-    <div className="tasks-col fade-in">
-      <div id="upload-tabs" className="uploader container">
-        <Switch location={props.location}>
-          <Route
-            name="upload-select"
-            path="/upload"
-            exact
-            component={UploadSelect}
-          />
-          <Route
-            name="upload-issues"
-            path="/upload/issues"
-            exact
-            component={UploadIssues}
-          />
-          <Route
-            name="upload-metadata"
-            path="/upload/metadata"
-            exact
-            component={UploadMetadata}
-          />
-          <Route
-            name="upload-disclaimer"
-            path="/upload/disclaimer"
-            exact
-            component={UploadDisclaimer}
-          />
-        </Switch>
-      </div>
-    </div>
-  </UploaderModal>
-)
-
-UploaderSetupRoutes.propTypes = {
-  location: PropTypes.object,
-  setLocation: PropTypes.func,
-}
-
-export default UploaderSetupRoutes

package/src/scripts/uploader/uploader-status-routes.jsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { Route, Switch } from 'react-router-dom'
-import UploaderModal from './uploader-modal.jsx'
-import UploadStatus from './upload-status.jsx'
-
-const UploaderStatusRoutes = props => (
-  <UploaderModal {...props}>
-    <div className="tasks-col fade-in">
-      <div id="upload-tabs" className="uploader container">
-        <Switch location={props.location}>
-          <Route
-            name="upload-status"
-            path="/upload"
-            exact
-            component={UploadStatus}
-          />
-        </Switch>
-      </div>
-    </div>
-  </UploaderModal>
-)
-
-UploaderStatusRoutes.propTypes = {
-  location: PropTypes.object,
-  setLocation: PropTypes.func,
-  footer: PropTypes.element,
-}
-
-export default UploaderStatusRoutes

package/src/scripts/uploader/uploader-view.jsx

@@ -1,45 +0,0 @@
-import React from 'react'
-import BlockNavigation from '../common/partials/block-navigation.jsx'
-import UploaderContext from './uploader-context.js'
-import UploaderSetupRoutes from './uploader-setup-routes.jsx'
-import UploaderStatusRoutes from './uploader-status-routes.jsx'
-import UploadButton from './upload-button.jsx'
-import UploadProgressButton from './upload-progress-button.jsx'
-
-const UploaderView = ({ uploader }) => {
-  if (uploader.uploading) {
-    return (
-      <span>
-        <UploadProgressButton />
-        <UploaderStatusRoutes
-          setLocation={uploader.setLocation}
-          location={uploader.location}
-          footer={
-            <button className="btn-reset" onClick={uploader.cancel}>
-              Cancel Upload
-            </button>
-          }
-        />
-        <BlockNavigation message="An upload is in progress and will be interrupted, continue?" />
-      </span>
-    )
-  } else {
-    return (
-      <span>
-        <UploadButton onClick={() => uploader.setLocation('/upload')} />
-        <UploaderSetupRoutes
-          setLocation={uploader.setLocation}
-          location={uploader.location}
-        />
-      </span>
-    )
-  }
-}
-
-const UploaderViewContainer = () => (
-  <UploaderContext.Consumer>
-    {uploader => <UploaderView uploader={uploader} />}
-  </UploaderContext.Consumer>
-)
-
-export default UploaderViewContainer