@openneuro/app 4.1.0 → 4.2.1

package/src/scripts/datalad/fragments/dataset-git-hash.jsx

@@ -1,27 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import styled from '@emotion/styled'
-import ToolTip from './copyable-tooltip.jsx'
-
-const Container = styled.div({
-  textAlign: 'right',
-  padding: '0 10px',
-  color: '#565656',
-  fontSize: '12px',
-})
-
-const DatasetGitHash = ({ gitHash }) => (
-  <div className="dataset-git-hash">
-    <div className="col-xs-12">
-      <Container className="fade-in">
-        <ToolTip text={`Git Hash: ${gitHash.slice(0, 7)}`} tip={gitHash} />
-      </Container>
-    </div>
-  </div>
-)
-
-DatasetGitHash.propTypes = {
-  gitHash: PropTypes.string,
-}
-
-export default DatasetGitHash

package/src/scripts/datalad/fragments/dataset-history.jsx

@@ -1,95 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import styled from '@emotion/styled'
-import { gql, useQuery } from '@apollo/client'
-
-import Revalidate from '../mutations/revalidate.jsx'
-import UpdateRef from '../mutations/update-ref.jsx'
-
-const GET_HISTORY = gql`
-  query getHistory($datasetId: ID!) {
-    dataset(id: $datasetId) {
-      id
-      history {
-        id
-        authorName
-        authorEmail
-        date
-        references
-        message
-      }
-      worker
-    }
-  }
-`
-
-const DatasetHistoryTable = styled.div`
-  .row {
-    line-height: 1.2em;
-  }
-  .row:nth-of-type(2n) {
-    padding-top: 1em;
-  }
-  .row:nth-of-type(2n + 1) {
-    padding-bottom: 1em;
-  }
-  .row:nth-of-type(4n),
-  .row:nth-of-type(4n + 1) {
-    background: #f4f4f4;
-  }
-`
-
-const DatasetHistory = ({ datasetId }) => {
-  const { loading, data } = useQuery(GET_HISTORY, {
-    variables: { datasetId },
-    errorPolicy: 'all',
-  })
-  if (loading) {
-    return <div className="dataset-history">Loading...</div>
-  } else {
-    return (
-      <div className="dataset-history">
-        <div className="col-lg-6">
-          <h3>Worker Assignment</h3> {data.dataset.worker}
-        </div>
-        <div className="col-lg-12">
-          <h3>Git History</h3>
-          <DatasetHistoryTable>
-            <div className="row">
-              <h4 className="col-lg-4">Commit</h4>
-              <h4 className="col-lg-2">Date</h4>
-              <h4 className="col-lg-2">Author</h4>
-              <h4 className="col-lg-2">References</h4>
-              <h4 className="col-lg-2">Action</h4>
-            </div>
-            {data.dataset.history.map(commit => (
-              <React.Fragment key={commit.id}>
-                <div className="row">
-                  <div className="col-lg-4">{commit.id}</div>
-                  <div className="col-lg-2">{commit.date}</div>
-                  <div className="col-lg-2">
-                    {commit.authorName} &lt;{commit.authorEmail}&gt;
-                  </div>
-                  <div className="col-lg-2">{commit.references}</div>
-                  <div className="col-lg-2">
-                    <Revalidate datasetId={datasetId} revision={commit.id} />
-                    <UpdateRef datasetId={datasetId} revision={commit.id} />
-                  </div>
-                </div>
-                <div className="row">
-                  <div className="col-lg-12">{commit.message}</div>
-                </div>
-              </React.Fragment>
-            ))}
-          </DatasetHistoryTable>
-        </div>
-      </div>
-    )
-  }
-}
-
-DatasetHistory.propTypes = {
-  datasetId: PropTypes.string,
-}
-
-export default DatasetHistory

package/src/scripts/datalad/fragments/dataset-modified.jsx

@@ -1,17 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { formatDate } from '../../utils/date.js'
-import parseISO from 'date-fns/parseISO'
-import formatDistanceToNow from 'date-fns/formatDistanceToNow'
-
-const DatasetModified = ({ modified }) => {
-  const dateAdded = formatDate(modified)
-  const difference = formatDistanceToNow(parseISO(modified))
-  return <h6>{`last modified on ${dateAdded} - ${difference} ago`}</h6>
-}
-
-DatasetModified.propTypes = {
-  modified: PropTypes.string,
-}
-
-export default DatasetModified

package/src/scripts/datalad/fragments/dataset-prominent-links.jsx

@@ -1,129 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { useHistory, useLocation } from 'react-router-dom'
-import snapshotVersion from '../snapshotVersion'
-import styled from '@emotion/styled'
-
-const PaddedDiv = styled.div`
-  && {
-    padding: 0.5em 0 0.5em;
-    display: flex;
-    flex-wrap: wrap;
-  }
-`
-const LinkButton = styled.button`
-  && {
-    margin: 1rem 1rem 0 0;
-    min-height: 3rem;
-    border: none;
-    border-radius: 0.5rem;
-    background: #377881;
-    background: -moz-linear-gradient(
-      top,
-      hsl(187, 40%, 36%) 0%,
-      hsl(191, 56%, 26%) 100%
-    );
-    background: -webkit-linear-gradient(
-      top,
-      hsl(187, 40%, 36%) 0%,
-      hsl(191, 56%, 26%) 100%
-    );
-    background: linear-gradient(
-      to bottom,
-      hsl(187, 40%, 36%) 0%,
-      hsl(191, 56%, 26%) 100%
-    );
-    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#377881', endColorstr='#1d5967',GradientType=0 );
-    display: flex;
-    align-items: center;
-    padding: 0.2em 1.33em;
-    font-family: sans-serif;
-    font-weight: 100;
-    color: white;
-
-    &:hover,
-    &:active,
-    &.hover,
-    &.active,
-    &:focus {
-      background: #377881;
-      background: -moz-linear-gradient(
-        top,
-        hsl(187, 40%, 24%) 0%,
-        hsl(191, 56%, 18%) 100%
-      );
-      background: -webkit-linear-gradient(
-        top,
-        hsl(187, 40%, 24%) 0%,
-        hsl(191, 56%, 18%) 100%
-      );
-      background: linear-gradient(
-        to bottom,
-        hsl(187, 40%, 24%) 0%,
-        hsl(191, 56%, 18%) 100%
-      );
-      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#377881', endColorstr='#1d5967',GradientType=0 );
-    }
-  }
-`
-const ButtonText = styled.div``
-const LeftPadIconContainer = styled.div`
-  padding-left: 0.67em;
-  font-size: 1.25em;
-`
-
-/**
- * Immediate redirect to a dataset or snapshot route
- * @param {object} history react-router-dom history
- * @param {*} rootPath base path for relative redirects
- * @param {*} path target path for redirect
- */
-const goToDownloadPage = (history, rootPath, path) => {
-  history.push(`${rootPath}/${path}`)
-}
-
-/**
- * Immediate redirect to a dataset or snapshot route
- * @param {string} datasetId Accession number
- */
-const goToBrainlife = datasetId => {
-  window.open(`https://brainlife.io/openneuro/${datasetId}`, '_blank')
-}
-
-// prominent link to dataset download page
-const ProminentLinks = ({ dataset }) => {
-  const history = useHistory()
-  const location = useLocation()
-  const snapshot = snapshotVersion(location)
-  const rootPath = snapshot
-    ? `/datasets/${dataset.id}/versions/${snapshot}`
-    : `/datasets/${dataset.id}`
-
-  return (
-    <PaddedDiv id="hi">
-      <LinkButton
-        className="download-link"
-        onClick={() => goToDownloadPage(history, rootPath, 'download')}>
-        <ButtonText>Download</ButtonText>
-        <LeftPadIconContainer>
-          <i className={'fa fa-arrow-circle-right align-middle'} />
-        </LeftPadIconContainer>
-      </LinkButton>
-      {dataset.onBrainlife && (
-        <LinkButton
-          className="brainlife-link"
-          onClick={() => goToBrainlife(dataset.id)}>
-          <ButtonText>Analyze on brainlife.io</ButtonText>
-        </LinkButton>
-      )}
-    </PaddedDiv>
-  )
-}
-
-ProminentLinks.propTypes = {
-  dataset: PropTypes.object,
-  location: PropTypes.object,
-  history: PropTypes.object,
-}
-
-export default ProminentLinks

package/src/scripts/datalad/fragments/dataset-readme.jsx

@@ -1,42 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import Markdown from 'markdown-to-jsx'
-import Collapsible from '../../mobile/collapsible-wrapper'
-import { Media } from '../../styles/media'
-
-/**
- * README file contents
- */
-
-const DatasetReadme = ({ content }) => {
-  if (content) {
-    return (
-      <>
-        <Media at="small">
-          <div className="cte-display">
-            <div className="fade-in">
-              <Collapsible title={['SHOW MORE', 'SHOW LESS']}>
-                <Markdown>{content || ''}</Markdown>
-              </Collapsible>
-            </div>
-          </div>
-        </Media>
-        <Media greaterThanOrEqual="medium">
-          <div className="cte-display">
-            <div className="fade-in">
-              <Markdown>{content || ''}</Markdown>
-            </div>
-          </div>
-        </Media>
-      </>
-    )
-  } else {
-    return null
-  }
-}
-
-DatasetReadme.propTypes = {
-  content: PropTypes.string,
-}
-
-export default DatasetReadme

package/src/scripts/datalad/fragments/dataset-summary.jsx

@@ -1,230 +0,0 @@
-// dependencies -------------------------------------------------------
-
-import React from 'react'
-import PropTypes from 'prop-types'
-import pluralize from 'pluralize'
-import bytes from 'bytes'
-
-class Summary extends React.PureComponent {
-  // life cycle events --------------------------------------------------
-
-  render() {
-    return (
-      <div className="clearfix">
-        {this._summary(this.props.summary, this.props.minimal)}
-      </div>
-    )
-  }
-
-  // custom methods -----------------------------------------------------
-
-  _summary(summary, minimal) {
-    if (summary) {
-      const accessionNumber = (
-        <h5>
-          <strong> OpenNeuro Accession Number: </strong>
-          {this.props.datasetId}
-        </h5>
-      )
-      const numSessions =
-        summary.sessions.length > 0 ? summary.sessions.length : 1
-      const files = (
-        <span>
-          <strong> {pluralize('File', summary.totalFiles)}: </strong>
-          {summary.totalFiles}
-        </span>
-      )
-      const size = (
-        <span>
-          <strong>Size: </strong>
-          {bytes(summary.size)}
-        </span>
-      )
-      const subjects = (
-        <span>
-          <strong> {pluralize('Subject', summary.subjects.length)}: </strong>
-          {summary.subjects.length}
-        </span>
-      )
-      const sessions = (
-        <span>
-          <strong>{pluralize('Session', numSessions)}: </strong>
-          {numSessions}
-        </span>
-      )
-
-      let bodyPart,
-        scannerManufacturer,
-        scannerManufacturersModelName,
-        tracerName,
-        tracerRadionuclide
-      if (summary.pet) {
-        if (summary.pet.BodyPart) {
-          bodyPart = (
-            <span>
-              <strong>
-                {' '}
-                {pluralize('Target', summary.pet.BodyPart?.length || 0)}:{' '}
-              </strong>
-              {summary.pet.BodyPart?.length ? (
-                summary.pet.BodyPart?.join(', ')
-              ) : (
-                <>&mdash;</>
-              )}
-            </span>
-          )
-        }
-        if (summary.pet.ScannerManufacturer) {
-          scannerManufacturer = (
-            <span>
-              <strong>
-                {' '}
-                {pluralize(
-                  'Scanner Manufacturer',
-                  summary.pet.ScannerManufacturer?.length || 0,
-                )}
-                :{' '}
-              </strong>
-              {summary.pet.ScannerManufacturer?.length ? (
-                summary.pet.ScannerManufacturer?.join(', ')
-              ) : (
-                <>&mdash;</>
-              )}
-            </span>
-          )
-        }
-        if (summary.pet.ScannerManufacturersModelName) {
-          scannerManufacturersModelName = (
-            <span>
-              <strong>
-                {' '}
-                {pluralize(
-                  'Scanner Model',
-                  summary.pet.ScannerManufacturersModelName?.length || 0,
-                )}
-                :{' '}
-              </strong>
-              {summary.pet.ScannerManufacturersModelName?.length ? (
-                summary.pet.ScannerManufacturersModelName?.join(', ')
-              ) : (
-                <>&mdash;</>
-              )}
-            </span>
-          )
-        }
-        if (summary.pet.TracerName) {
-          tracerName = (
-            <span>
-              <strong>
-                {' '}
-                {pluralize('Radiotracer', summary.pet.TracerName?.length) ||
-                  0}:{' '}
-              </strong>
-              {summary.pet.TracerName?.length ? (
-                summary.pet.TracerName?.join(', ')
-              ) : (
-                <>&mdash;</>
-              )}
-            </span>
-          )
-        }
-        if (summary.pet.TracerRadionuclide) {
-          tracerRadionuclide = (
-            <span>
-              <strong>
-                {' '}
-                {pluralize(
-                  'Radionuclide',
-                  summary.pet.TracerRadionuclide?.length || 0,
-                )}
-                :{' '}
-              </strong>
-              {summary.pet.TracerRadionuclide?.length ? (
-                summary.pet.TracerRadionuclide?.join(', ')
-              ) : (
-                <>&mdash;</>
-              )}
-            </span>
-          )
-        }
-      }
-
-      //check for pet in modalities array
-      const isPet = element => element.toLowerCase() === 'pet'
-      const hasPet = summary.modalities.some(isPet)
-
-      if (minimal) {
-        return (
-          <div className="minimal-summary">
-            <div className="summary-data">{files}</div>
-            <div className="summary-data">{size}</div>
-            <div className="summary-data">{subjects}</div>
-            <div className="summary-data">{sessions}</div>
-            <div className="summary-data tasks">
-              {this._list(<b>Tasks</b>, summary.tasks)}
-            </div>
-            <div className="summary-data modalities">
-              {this._list(<b>Modalities</b>, summary.modalities)}
-            </div>
-            {summary.pet && hasPet && (
-              <>
-                <div className="summary-data">{bodyPart}</div>
-                <div className="summary-data">{scannerManufacturer}</div>
-                <div className="summary-data">
-                  {scannerManufacturersModelName}
-                </div>
-                <div className="summary-data">{tracerName}</div>
-                <div className="summary-data">{tracerRadionuclide}</div>
-              </>
-            )}
-          </div>
-        )
-      } else {
-        return (
-          <div>
-            <hr />
-            {accessionNumber}
-            <h5>
-              {files}, {size}, {subjects}, {sessions}
-            </h5>
-            <h5>{this._list(<b>Tasks</b>, summary.tasks)}</h5>
-            <h5>{this._list(<b>Modalities</b>, summary.modalities)}</h5>
-            {summary.pet && hasPet && (
-              <>
-                <h5>{bodyPart}</h5>
-                <h5>{scannerManufacturer}</h5>
-                <h5>{scannerManufacturersModelName}</h5>
-                <h5>{tracerName}</h5>
-                <h5>{tracerRadionuclide}</h5>
-              </>
-            )}
-          </div>
-        )
-      }
-    }
-  }
-
-  _list(type, items) {
-    if (items && items.length > 0) {
-      return (
-        <span>
-          <b className="desktop">Available</b> {type}: {items.join(', ')}
-        </span>
-      )
-    } else {
-      return (
-        <span>
-          <b>No Available</b> {type}
-        </span>
-      )
-    }
-  }
-}
-
-Summary.propTypes = {
-  summary: PropTypes.object,
-  minimal: PropTypes.bool,
-  datasetId: PropTypes.string,
-}
-
-export default Summary

package/src/scripts/datalad/fragments/dataset-title.jsx

@@ -1,10 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-
-const DatasetTitle = ({ title }) => <h1>{title}</h1>
-
-DatasetTitle.propTypes = {
-  title: PropTypes.string,
-}
-
-export default DatasetTitle