@openneuro/app 4.1.1 → 4.2.2

package/src/scripts/front-page/__tests__/dataset-count.spec.jsx

@@ -1,33 +0,0 @@
-import React from 'react'
-import { shallow } from 'enzyme'
-import { DatasetCountDisplay } from '../dataset-count.jsx'
-
-describe('DatasetCount', () => {
-  describe('DatasetCountDisplay', () => {
-    it('returns null while loading', () => {
-      expect(shallow(<DatasetCountDisplay loading={true} />).getElement()).toBe(
-        null,
-      )
-    })
-    it('returns a number if data is available', () => {
-      expect(
-        shallow(
-          <DatasetCountDisplay
-            loading={false}
-            data={{ datasets: { pageInfo: { count: 10 } } }}
-          />,
-        ).text(),
-      ).toBe('10')
-    })
-    it('returns null if some other data is provided', () => {
-      expect(
-        shallow(
-          <DatasetCountDisplay
-            loading={false}
-            data={{ datasets: { pageInfo: { notCount: -25 } } }}
-          />,
-        ).getElement(),
-      ).toBe(null)
-    })
-  })
-})

package/src/scripts/front-page/__tests__/email-subscription-box.spec.jsx

@@ -1,57 +0,0 @@
-import React from 'react'
-import { mount } from 'enzyme'
-import EmailSubscriptionBox, {
-  modes,
-  submitHandler,
-} from '../email-subscription-box.jsx'
-
-describe('EmailSubscriptionBox', () => {
-  it('renders correctly in get-email mode', () => {
-    const wrapper = mount(
-      <EmailSubscriptionBox subscribe={jest.fn()} initialMode={modes.GET} />,
-    )
-    expect(wrapper).toMatchSnapshot()
-  })
-  it('renders correctly in success mode', () => {
-    const wrapper = mount(
-      <EmailSubscriptionBox subscribe={jest.fn()} initialMode={modes.GET} />,
-    )
-    expect(wrapper).toMatchSnapshot()
-  })
-  it('renders correctly in error mode', () => {
-    const wrapper = mount(
-      <EmailSubscriptionBox subscribe={jest.fn()} initialMode={modes.GET} />,
-    )
-    expect(wrapper).toMatchSnapshot()
-  })
-})
-
-describe('EmailSubscriptionBox submitHandler', () => {
-  const event = {
-    preventDefault: jest.fn(),
-    target: { email: { value: 'email@email.test' } },
-  }
-  it('calls setMode with GET when in ERROR mode', () => {
-    const subscribe = jest.fn()
-    const currentMode = modes.ERROR
-    const setMode = newMode => expect(newMode).toEqual(modes.GET)
-    submitHandler(subscribe, currentMode, setMode)(event)
-  })
-
-  describe('properly handles setMode when email is submitted in GET mode', () => {
-    const currentMode = modes.GET
-
-    it('calls SUCCESS mode for successful submit', () => {
-      const result = { data: { subscribeToNewsletter: true } }
-      const subscribe = (someValidEmail, cb) => cb(result)
-      const setMode = newMode => expect(newMode).toEqual(modes.SUCCESS)
-      submitHandler(subscribe, currentMode, setMode)(event)
-    })
-    it('calls ERROR mode for unsuccessful submit', () => {
-      const result = { data: { subscribeToNewsletter: false } }
-      const subscribe = (someValidEmail, cb) => cb(result)
-      const setMode = newMode => expect(newMode).toEqual(modes.ERROR)
-      submitHandler(subscribe, currentMode, setMode)(event)
-    })
-  })
-})

package/src/scripts/front-page/__tests__/front-page-stats.spec.jsx

@@ -1,10 +0,0 @@
-import React from 'react'
-import { shallow } from 'enzyme'
-import FrontPageStats from '../front-page-stats.jsx'
-
-describe('FrontPageTopStats', () => {
-  it('renders container correctly', () => {
-    const wrapper = shallow(<FrontPageStats />)
-    expect(wrapper).toMatchSnapshot()
-  })
-})

package/src/scripts/front-page/__tests__/front-page-top-datasets.spec.jsx

@@ -1,27 +0,0 @@
-import React from 'react'
-import { shallow } from 'enzyme'
-import FrontPageTopDatasets, {
-  FrontPageTopResult,
-} from '../front-page-top-datasets.jsx'
-
-describe('FrontPageTopDatasets', () => {
-  it('renders container correctly', () => {
-    const wrapper = shallow(<FrontPageTopDatasets />)
-    expect(wrapper).toMatchSnapshot()
-  })
-  describe('FrontPageTopResult', () => {
-    it('does not crash with null query results', () => {
-      const fakeQuery = Symbol('not a real query')
-      const renderFrontPageTopResult = () => {
-        shallow(
-          FrontPageTopResult(fakeQuery)({
-            loading: false,
-            error: false,
-            data: {},
-          }),
-        )
-      }
-      expect(renderFrontPageTopResult).not.toThrowError()
-    })
-  })
-})

package/src/scripts/front-page/__tests__/participant-count.spec.jsx

@@ -1,31 +0,0 @@
-import { participantCount } from '../participant-count'
-
-describe('DatasetCount', () => {
-  describe('ParticipantCountDisplay', () => {
-    it('returns null if loading', () => {
-      const count = participantCount({
-        loading: true,
-        data: {
-          participantCount: 10,
-        },
-      })
-      expect(count).toBeNull()
-    })
-    it('returns null when no data', () => {
-      const count = participantCount({
-        loading: false,
-        data: undefined,
-      })
-      expect(count).toBeNull()
-    })
-    it('returns the participantCount when provided', () => {
-      const count = participantCount({
-        loading: false,
-        data: {
-          participantCount: 10,
-        },
-      })
-      expect(count).toBe(10)
-    })
-  })
-})

package/src/scripts/front-page/dataset-count.jsx

@@ -1,29 +0,0 @@
-import React from 'react'
-import { Query } from '@apollo/client/react/components'
-import { gql } from '@apollo/client'
-
-const PUBLIC_DATASET_COUNT = gql`
-  query publicDatasetCount {
-    datasets(filterBy: { public: true }) {
-      pageInfo {
-        count
-      }
-    }
-  }
-`
-
-export const DatasetCountDisplay = ({ loading, data }) => {
-  try {
-    return loading ? null : data.datasets.pageInfo.count
-  } catch (e) {
-    return null
-  }
-}
-
-const DatasetCount = () => (
-  <Query query={PUBLIC_DATASET_COUNT} errorPolicy="ignore">
-    {DatasetCountDisplay}
-  </Query>
-)
-
-export default DatasetCount

package/src/scripts/front-page/email-subscription-box.jsx

@@ -1,131 +0,0 @@
-import React, { useState } from 'react'
-import PropTypes from 'prop-types'
-import styled from '@emotion/styled'
-
-const Container = styled.div`
-  padding: 2em 0 4em;
-  background-color: white;
-`
-const Form = styled.form`
-  margin: 0 auto;
-  padding: 1.5rem 0;
-  width: 80vw;
-  min-width: 24em;
-  max-width: 90rem;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  background-color: #f5f5f5;
-`
-const Prompt = styled.h3`
-  margin: 1.5rem 0;
-  font-size: 40px;
-  font-weight: 200;
-`
-const Message = styled.p`
-  padding: 1.2em 0;
-`
-const InputWrap = styled.div`
-  margin: 1.5rem 0;
-  width: 20em;
-`
-const ButtonWrap = styled.div`
-  margin: 1.5rem 0;
-  width: 10em;
-`
-
-export const modes = {
-  // display prompt / email input / submit button
-  GET: Symbol('get'),
-  // display success message / done
-  SUCCESS: Symbol('success'),
-  // display error message / try again button
-  ERROR: Symbol('error'),
-}
-
-export const submitHandler = (subscribe, mode, setMode) => e => {
-  e.preventDefault()
-  switch (mode) {
-    case modes.SUCCESS:
-      break
-    case modes.ERROR:
-      setMode(modes.GET)
-      break
-    case modes.GET:
-    default:
-      subscribe(e.target.email.value, result => {
-        if (result.data) {
-          setMode(
-            result.data.subscribeToNewsletter ? modes.SUCCESS : modes.ERROR,
-          )
-        }
-      })
-      break
-  }
-}
-
-export const getText = mode => {
-  switch (mode) {
-    case modes.ERROR:
-      return {
-        headingText: 'Whoops.',
-        messageText:
-          'We were unable to sign you up for updates. Please try again.',
-        buttonText: 'Try Again',
-      }
-    case modes.SUCCESS:
-      return {
-        headingText: 'Success!',
-        messageText: 'You are now signed up to receive news updates.',
-        buttonText: 'Done',
-      }
-    case modes.GET:
-    default:
-      return {
-        headingText: 'Get Updates',
-        buttonText: 'Subscribe',
-      }
-  }
-}
-
-const EmailSubscriptionBox = ({ subscribe, initialMode = modes.GET }) => {
-  // determines state of display (input/success/error)
-  const [mode, setMode] = useState(initialMode)
-  const { headingText, messageText, buttonText } = getText(mode)
-  return (
-    <Container>
-      <Form onSubmit={submitHandler(subscribe, mode, setMode)}>
-        <Prompt>{headingText}</Prompt>
-        {mode === modes.ERROR || mode === modes.SUCCESS ? (
-          <Message>{messageText}</Message>
-        ) : (
-          <InputWrap className="has-float-label">
-            <input
-              name="email"
-              type="email"
-              className="form-control"
-              id="email"
-              placeholder=" "
-            />
-            <label htmlFor="email">E-mail Address</label>
-          </InputWrap>
-        )}
-        <ButtonWrap>
-          <button
-            className="btn-blue"
-            type="submit"
-            disabled={mode === modes.SUCCESS}>
-            {buttonText}
-          </button>
-        </ButtonWrap>
-      </Form>
-    </Container>
-  )
-}
-
-EmailSubscriptionBox.propTypes = {
-  subscribe: PropTypes.func,
-  initialMode: PropTypes.symbol,
-}
-
-export default EmailSubscriptionBox

package/src/scripts/front-page/front-page-additional-info.jsx

@@ -1,15 +0,0 @@
-import React from 'react'
-import Collaborators from './front-page-collaborators.jsx'
-import Support from './front-page-support.jsx'
-import { frontPage } from '../front-page/front-page-content'
-
-const AdditionalInfo = () => (
-  <div className="more-info">
-    <div className="container">
-      {frontPage.collaborators ? <Collaborators /> : null}
-      {frontPage.support ? <Support /> : null}
-    </div>
-  </div>
-)
-
-export default AdditionalInfo

package/src/scripts/front-page/front-page-collaborators.jsx

@@ -1,117 +0,0 @@
-import React from 'react'
-
-const Collaborators = () => (
-  <span>
-    <span className="openneuro-more">
-      <div className="col-xs-12">
-        <div className="logo-text">
-          Open
-          <span className="logo-end">Neuro</span>
-        </div>
-      </div>
-      <div className="row">
-        <div className="col-sm-6">
-          <p>
-            A free and open platform for sharing MRI, MEG, EEG, iEEG, and ECoG
-            data
-          </p>
-        </div>
-        <div className="col-sm-6">
-          <p>
-            View more information about
-            <br />
-            <a
-              target="_blank"
-              href="http://reproducibility.stanford.edu/"
-              rel="noopener noreferrer">
-              Stanford Center for Reproducible Neuroscience
-            </a>
-          </p>
-        </div>
-      </div>
-    </span>
-    <span className="bids-more">
-      <div className="col-xs-12">
-        <h3>Brain Imaging Data Structure (BIDS) </h3>
-      </div>
-      <div className="row">
-        <div className="col-sm-6">
-          <p>
-            A Validator for the Brain Imaging Data Structure
-            <br />
-            Read more about the{' '}
-            <a
-              target="_blank"
-              href="http://bids.neuroimaging.io/"
-              rel="noopener noreferrer">
-              BIDS specifications
-            </a>
-          </p>
-        </div>
-        <div className="col-sm-6">
-          <p>
-            Want to contribute to BIDS?
-            <br />
-            Visit the{' '}
-            <a
-              target="_blank"
-              href="https://groups.google.com/forum/#!forum/bids-discussion"
-              rel="noopener noreferrer">
-              Google discussion group
-            </a>{' '}
-            to contribute.
-          </p>
-        </div>
-      </div>
-    </span>
-    <span className="bids-more">
-      <div className="col-xs-12">
-        <h3>DataLad</h3>
-      </div>
-      <div className="row">
-        <div className="col-sm-6">
-          <p>
-            A data management solution built on{' '}
-            <a
-              target="_blank"
-              href="https://git-scm.com"
-              rel="noopener noreferrer">
-              Git
-            </a>{' '}
-            and{' '}
-            <a
-              target="_blank"
-              href="https://git-annex.branchable.com"
-              rel="noopener noreferrer">
-              Git-annex
-            </a>
-            <br />
-            Read more about{' '}
-            <a
-              target="_blank"
-              href="http://handbook.datalad.org/r.html?about"
-              rel="noopener noreferrer">
-              DataLad
-            </a>
-          </p>
-        </div>
-        <div className="col-sm-6">
-          <p>
-            Want to access OpenNeuro datasets with DataLad?
-            <br />
-            Visit the{' '}
-            <a
-              target="_blank"
-              href="https://github.com/OpenNeuroDatasets"
-              rel="noopener noreferrer">
-              dataset collection on GitHub
-            </a>
-            .
-          </p>
-        </div>
-      </div>
-    </span>
-  </span>
-)
-
-export default Collaborators

package/src/scripts/front-page/front-page-stats.jsx

@@ -1,71 +0,0 @@
-import React from 'react'
-import DatasetCount from './dataset-count.jsx'
-import ParticipantCount from './participant-count.jsx'
-import styled from '@emotion/styled'
-
-const breakpoint = '@media (max-width: 900px)'
-
-const StatsSection = styled.section({
-  backgroundColor: 'white',
-  padding: '4rem 0',
-})
-const StatsContainer = styled.div({
-  backgroundColor: '#f5f5f5',
-  margin: 'auto',
-  width: '90rem',
-  display: 'flex',
-  justifyContent: 'space-between',
-  fontFamily: ['"Open Sans", sans-serif', 'var(--font-family-open)'],
-  [breakpoint]: {
-    flexDirection: 'column',
-    maxWidth: '45rem',
-    width: '100%',
-  },
-})
-const Panel = styled.section({
-  backgroundColor: 'transparent',
-  flexBasis: '1px',
-  flexGrow: 1,
-  padding: '2rem 0 3rem',
-  textAlign: 'center',
-})
-const Value = styled.div({
-  color: '#007C92',
-  fontSize: '70px',
-})
-const Label = styled.div({
-  fontWeight: 200,
-  fontSize: '40px',
-})
-const VerticalDivider = styled.div({
-  width: '2px',
-  backgroundColor: 'white',
-  margin: '1rem 0',
-  [breakpoint]: {
-    height: '2px',
-    width: 'calc(100% - 4rem)',
-    margin: '0 auto',
-  },
-})
-
-const FrontPageStats = () => (
-  <StatsSection>
-    <StatsContainer>
-      <Panel className="dataset-count">
-        <Value>
-          <DatasetCount />
-        </Value>
-        <Label>Public Datasets</Label>
-      </Panel>
-      <VerticalDivider />
-      <Panel className="participant-count">
-        <Value>
-          <ParticipantCount />
-        </Value>
-        <Label>Participants</Label>
-      </Panel>
-    </StatsContainer>
-  </StatsSection>
-)
-
-export default FrontPageStats

package/src/scripts/front-page/front-page-support.jsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import { frontPage } from '../front-page/front-page-content'
-
-class Support extends React.Component {
-  render() {
-    const support = frontPage.support.map((item, index) => {
-      return (
-        <div
-          key={index}
-          className={`col-sm-offset-${item.offset} col-sm-${item.width}`}>
-          <a
-            target="_blank"
-            href={item.link}
-            title={item.title}
-            rel="noopener noreferrer">
-            <img src={item.logo} alt={item.alt} />
-          </a>
-        </div>
-      )
-    })
-    return (
-      <div className="support-more">
-        <h4>Support for {frontPage.pageTitle} provided by</h4>
-        <div className="row">{support}</div>
-      </div>
-    )
-  }
-}
-
-export default Support