Restart as a monorepo

.envrc

-if declare -Ff use_nvm >/dev/null; then
-  use nvm 
-fi
+#https://github.com/direnv/direnv/wiki/Node#load-nodejs-version-from-a-node-version-or-nvmrc-file
+set -e
+use node

.eslintrc

 {
-  "parser": "babel-eslint",
-  "extends": [
-    "standard",
-    "plugin:react/recommended"
-  ],
-  "plugins": [
-    "react"
-  ],
-  "parserOptions": {
-    "ecmaVersion": 7,
-    "ecmaFeatures": {
-      "jsx": true
-    }
-  },
-  "env": {
-    "es6": true,
-    "browser": true
-  }
+  "extends": "react-app"
 }

.gitignore

-api
-logs
-node_modules
+*.log
+.env
 .env.*
-_build

.nvmrc

-7.9
\ No newline at end of file
+7

README.md

-Note: xpub is still _very_ new. This repository contains components for uploading and submitting a manuscript, but is not yet ready for use.
+Note: xpub is still _very_ new. This repository contains an initial set of components but is not yet ready for use.
+
+## Installing
+
+In the root directory, run `npm install` then `npm run hoist` to install all the dependencies.
+
+## Contents
+
+* `collabra`: a PubSweet application that provides configuration and routing.
+* `component-dashboard`: a PubSweet component that provides a Dashboard page.
+* `component-submit`: a PubSweet component that provides a Submit page.
+* `component-manuscript`: a PubSweet component that provides a Manuscript page.
+* `xpub-fonts`: an index that imports the fonts for xpub applications
+* `xpub-selectors`: some useful redux selectors
+* `xpub-ui`: a library of user interface elements for use in PubSweet components.
+

app/app.js

-import React from 'react'
-import ReactDOM from 'react-dom'
-import { AppContainer } from 'react-hot-loader'
-import { browserHistory } from 'react-router'
-import { syncHistoryWithStore } from 'react-router-redux'
-import { configureStore, Root } from 'pubsweet-client'
-
-import './styles'
-
-let store = configureStore(browserHistory, {})
-let history = syncHistoryWithStore(browserHistory, store)
-
-const rootEl = document.getElementById('root')
-
-ReactDOM.render(
-  <AppContainer>
-    <Root store={store} history={history} />
-  </AppContainer>,
-  rootEl
-)
-
-if (module.hot) {
-  module.hot.accept('pubsweet-client/src/components/Root', () => {
-    const NextRoot = require('pubsweet-client/src/components/Root').default
-
-    ReactDOM.render(
-      <AppContainer>
-        <NextRoot store={store} history={history} />
-      </AppContainer>,
-      rootEl
-    )
-  })
-}

app/components/App.js

-import React from 'react'
-import PropTypes from 'prop-types'
-import NavigationContainer from './NavigationContainer'
-
-const App = ({ children }) => (
-  <div>
-    <NavigationContainer/>
-    <div style={{marginTop: 50}}>
-      {children}
-    </div>
-  </div>
-)
-
-App.propTypes = {
-  children: PropTypes.node
-}
-
-export default App

app/components/Navigation.js

-import React from 'react'
-import PropTypes from 'prop-types'
-import { Nav, Navbar, NavbarBrand, NavItem } from 'react-bootstrap'
-
-const Navigation = ({ appLink, appName, logout, currentUser, updateSubscriber }) => (
-  <Navbar fluid fixedTop style={{ minHeight: 0 }}>
-    <Navbar.Header>
-      <NavbarBrand>
-        <Navbar.Link href={appLink}>{appName}</Navbar.Link>
-      </NavbarBrand>
-    </Navbar.Header>
-
-    {currentUser ? (
-      <Nav pullRight>
-        {updateSubscriber && <NavItem>{updateSubscriber}</NavItem>}
-        <NavItem>logged in as {currentUser.username}</NavItem>
-        <NavItem onClick={logout}>logout</NavItem>
-      </Nav>
-    ) : (
-      <Nav pullRight>
-        <NavItem>
-          <Navbar.Link href="/signin">login</Navbar.Link>
-        </NavItem>
-      </Nav>
-    )}
-  </Navbar>
-)
-
-Navigation.propTypes = {
-  appLink: PropTypes.string.isRequired,
-  appName: PropTypes.string.isRequired,
-  currentUser: PropTypes.object,
-  logout: PropTypes.func.isRequired,
-  updateSubscriber: PropTypes.node
-}
-
-export default Navigation

app/components/NavigationContainer.js

-import React from 'react'
-import PropTypes from 'prop-types'
-import UpdateSubscriber from 'pubsweet-client/src/components/UpdateSubscriber'
-import { connect } from 'react-redux'
-import { logoutUser } from 'pubsweet-component-login/actions'
-import Navigation from './Navigation'
-
-const NavigationContainer = ({ logoutUser, currentUser }) => (
-  <Navigation appName="xpub" // TODO: make configurable
-              appLink="/projects" // TODO: make configurable
-              currentUser={currentUser}
-              logout={logoutUser}
-              updateSubscriber={UpdateSubscriber}/>
-)
-
-NavigationContainer.propTypes = {
-  currentUser: PropTypes.object,
-  logoutUser: PropTypes.func.isRequired
-}
-
-const selectCurrentUser = (state) => state.currentUser.isAuthenticated
-  ? state.currentUser.user
-  : null
-
-export default connect(
-  state => ({
-    currentUser: selectCurrentUser(state)
-  }),
-  {
-    logoutUser
-  }
-)(NavigationContainer)

app/components/WaxContainer.js

-import React from 'react'
-import PropTypes from 'prop-types'
-import { connect } from 'react-redux'
-import { browserHistory } from 'react-router'
-import { fileUpload } from 'pubsweet-client/src/actions/fileUpload'
-import { getCollection } from 'pubsweet-client/src/actions/collections'
-import { getFragment, updateFragment } from 'pubsweet-client/src/actions/fragments'
-import SimpleEditor from 'pubsweet-component-wax/src/SimpleEditor'
-
-const fullscreenStyle = {
-  position: 'fixed',
-  top: 50, // leave room for the navbar
-  left: 0,
-  right: 0,
-  bottom: 0,
-  background: 'white',
-  overflow: 'hidden'
-}
-
-class WaxContainer extends React.Component {
-  componentDidMount () {
-    const { getCollection, getFragment, params } = this.props
-
-    getCollection({ id: params.project })
-    getFragment({ id: params.project }, { id: params.version })
-  }
-
-  render () {
-    const { project, version, fileUpload, updateFragment, currentUser } = this.props
-
-    if (!version || !project) return null
-
-    return (
-      <SimpleEditor
-        book={project}
-        fileUpload={fileUpload}
-        fragment={version}
-        history={browserHistory}
-        onSave={({ source }) => updateFragment(project, { id: version.id, source })}
-        update={data => updateFragment(project, { id: version.id, ...data })}
-        user={currentUser}
-        style={fullscreenStyle}
-      />
-    )
-  }
-}
-
-WaxContainer.propTypes = {
-  fileUpload: PropTypes.func.isRequired,
-  getCollection: PropTypes.func.isRequired,
-  getFragment: PropTypes.func.isRequired,
-  updateFragment: PropTypes.func.isRequired,
-  currentUser: PropTypes.object,
-  params: PropTypes.object.isRequired,
-  project: PropTypes.object,
-  version: PropTypes.object
-}
-
-const selectCollection = (state, id) => state.collections
-  .find(collection => collection.id === id)
-
-const selectCurrentUser = (state) => state.currentUser.isAuthenticated
-  ? state.currentUser.user
-  : null
-
-export default connect(
-  (state, ownProps) => ({
-    currentUser: selectCurrentUser(state),
-    project: selectCollection(state, ownProps.params.project),
-    version: state.fragments[ownProps.params.version]
-  }),
-  {
-    fileUpload,
-    getCollection,
-    getFragment,
-    updateFragment
-  }
-)(WaxContainer)

app/styles.js

-import 'pubsweet-fira'
-import 'typeface-fira-sans-condensed'
-import 'typeface-vollkorn'
-
-import './styles/main.scss'

app/styles/_base.scss

-@import 'variables';
-
-a {
-  color: $dark-grey;
-  text-decoration: underline;
-}
-
-h1,
-h2,
-h3 {
-  color: $dark-grey;
-  margin-bottom: 5px;
-  margin-top: 5px;
-  padding-bottom: 0;
-  padding-top: 0;
-}
-
-h2 {
-  font-size: 25px;
-  font-weight: bold;
-}
-
-h3 {
-  color: lighten($dark-grey, 10%);
-  font-size: 20px;
-}

app/styles/_bootstrap.scss

-@import 'variables';
-
-// override bootstrap-sass default variables
-$border-radius-base: 0;
-$icon-font-path: '~bootstrap-sass/assets/fonts/bootstrap/';
-
-@import '~bootstrap-sass/assets/stylesheets/bootstrap';
-@import '~bootstrap-sass/assets/stylesheets/bootstrap-sprockets';
-
-@import 'base';
-@import 'bootstrap_buttons';
-@import 'bootstrap_form';
-@import 'navbar';
-
-.alert.alert-warning {
-  background-color: $very-light-grey;
-  border: 0;
-  color: $black;
-  margin-top: 50px;
-}
-
-.error {
-  color: $brown;
-}

app/styles/_bootstrap_buttons.scss

-@import 'variables';
-
-.btn-primary {
-  background-color: $blue;
-  border-color: transparent;
-
-  &:hover,
-  &:focus {
-    background-color: darken($blue, 10%);
-    border-color: darken($blue, 20%);
-  }
-}

app/styles/_bootstrap_form.scss

-@import 'variables';
-
-legend {
-  border: 0;
-  color: $blue;
-  font-weight: bold;
-}
-
-label {
-  color: $blue;
-  font-weight: normal;
-}
-
-input[type='text'],
-input[type='text'].form-control,
-input[type='password'].form-control {
-  border: 2px solid $medium-light-gray;
-
-  &.error {
-    border-right: 4px solid $main-grey;
-  }
-
-  &.success {
-    border-right: 4px solid $dark-grey;
-  }
-}
-
-.form-group {
-  margin-bottom: 15px;
-  margin-top: 15px;
-}

app/styles/_fonts.scss

-//@import '~pubsweet-fira/src/fira';
-//@import '~typeface-fira-sans-condensed/index';
-//@import '~typeface-vollkorn/index';
-
-.content-text {
-  font-family: 'Vollkorn', serif;
-}
-
-.content-metadata,
-.content-interactive {
-  font-family: 'Fira Sans Condensed', sans-serif;
-}

app/styles/_icons.scss

-$fa-font-path: "~font-awesome/fonts";
-@import "~font-awesome/scss/font-awesome";

app/styles/_modal.scss

-$brown: #a52a2a;
-$button-background: #d3d3d3;
-$button-text: #000;
-$grey: #808080;
-$white: #fff;
-
-.modal-content {
-  border: 2px solid $grey;
-  border-radius: 0;
-  font-style: italic;
-  font-weight: 500;
-  padding: 1em;
-}
-
-.modal-header {
-  padding: 0;
-}
-
-.modal-title {
-  font-size: 24px;
-  line-height: 32px;
-}
-
-.modal-body {
-  border: 0;
-  padding: 20px 0;
-}
-
-.modal-footer {
-  border: 0;
-  font-style: normal;
-  font-weight: normal;
-  padding-right: 0;
-  text-align: center;
-}
-
-.modal-buttons-container {
-  float: right;
-}
-
-.modal-button {
-  background-color: $button-background;
-  border: 3px solid transparent;
-  border-radius: 3px;
-  color: $button-text;
-  display: inline-block;
-  margin-bottom: .5em;
-  padding: 4px 40px;
-  text-align: center;
-  text-decoration: none;
-  text-transform: uppercase;
-
-  &:hover {
-    background-color: $grey;
-    color: $white;
-    cursor: pointer;
-    text-decoration: none;
-  }
-}
-
-.modal-discard {
-  color: $brown;
-  margin-right: 20px;
-
-  &:hover {
-    color: $brown;
-  }
-}

app/styles/_navbar.scss

-@import 'variables';
-
-@media (min-width: 768px) {
-  .navbar-brand {
-    margin-left: 0;
-  }
-}
-
-.navbar-link,
-.navbar-default .navbar-link {
-  color: #4990E2;
-  text-decoration: none;
-  font-weight: 800;
-}
-
-.navbar-default {
-  border: 0;
-  font-weight: bold;
-  font-style: italic;
-  background-color: white;
-
-  .container-fluid {
-    padding-left: 20px;
-    padding-right: 20px;
-  }
-
-  .navbar-brand {
-    color: $blue;
-    height: auto;
-    padding: 0;
-    margin-top: 15px;
-    margin-left: 0 !important;
-    text-decoration: none;
-    display: inline-block;
-
-    img {
-      height: 100%;
-    }
-  }
-
-  .navbar-header {
-    font-style: italic;
-  }
-
-  .navbar-nav {
-    margin-top: 0;
-
-    > .active {
-      > a {
-        background-color: transparent;
-        color: #000;
-        font-weight: bold;
-        text-decoration: none;
-
-        &:focus {
-          background-color: transparent;
-        }
-
-        &:hover {
-          background-color: transparent;
-        }
-      }
-    }
-
-    > li {
-      > a {
-        color: $blue;
-        font-style: italic;
-        text-decoration: none;
-      }
-    }
-  }
-}

app/styles/_reset.scss

-// http://meyerweb.com/eric/tools/css/reset/
-//    v2.0 | 20110126
-//    License: none (public domain)
-
-html,
-body,
-div,
-span,
-applet,
-object,
-iframe,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-big,
-cite,
-code,
-del,
-dfn,
-em,
-img,
-ins,
-kbd,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-b,
-u,
-i,
-center,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-fieldset,
-form,
-label,
-legend,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td,
-article,
-aside,
-canvas,
-details,
-embed,
-figure,
-figcaption,
-footer,
-header,
-hgroup,
-menu,
-nav,
-output,
-ruby,
-section,
-summary,
-time,
-mark,
-audio,
-video {
-  border: 0;
-  font: inherit;
-  font-size: 100%;
-  margin: 0;
-  padding: 0;
-  vertical-align: baseline;
-}
-
-
-// HTML5 display-role reset for older browsers
-
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-menu,
-nav,
-section {
-  display: block;
-}
-
-body {
-  line-height: 1;
-}
-
-ol,
-ul {
-  list-style: none;
-}
-
-blockquote,
-q {
-  quotes: none;
-}
-
-blockquote::before,
-blockquote::after,
-q::before,
-q::after {
-  // content: '';
-  content: none;
-}
-
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}