Merge branch 'develop' of gitlab.coko.foundation:xpub/xpub-faraday into develop

packages/component-manuscript/src/components/ManuscriptLayout.js

@@ -16,6 +16,7 @@ import { ManuscriptDetails, SideBarActions, SideBarRoles } from './'
 
 const ManuscriptLayout = ({
   currentUser,
+  editorInChief,
   updateManuscript,
   project,
   version,
@@ -47,7 +48,12 @@ const ManuscriptLayout = ({
     </Container>
     <SideBar flex={1}>
       <SideBarActions project={project} version={version} />
-      <SideBarRoles project={project} version={version} />
+      <SideBarRoles
+        currentUser={currentUser}
+        editorInChief={editorInChief}
+        project={project}
+        version={version}
+      />
     </SideBar>
   </Root>
 )

packages/component-manuscript/src/components/ManuscriptPage.js

@@ -2,21 +2,28 @@ import { connect } from 'react-redux'
 import { actions } from 'pubsweet-client'
 import { ConnectPage } from 'xpub-connect'
 import { withJournal } from 'xpub-journal'
+import { head, get } from 'lodash'
 import {
   selectCurrentUser,
   selectCollection,
   selectFragment,
 } from 'xpub-selectors'
+import { get as apiGet } from 'pubsweet-client/src/helpers/api'
 import { replace } from 'react-router-redux'
-import { compose, lifecycle, withHandlers } from 'recompose'
+import { compose, lifecycle, withHandlers, withState } from 'recompose'
 import { reviewerDecision } from 'pubsweet-components-faraday/src/redux/reviewers'
 import { getSignedUrl } from 'pubsweet-components-faraday/src/redux/files'
+import {
+  getHandlingEditors,
+  selectHandlingEditors,
+} from 'pubsweet-components-faraday/src/redux/editors'
 
 import ManuscriptLayout from './ManuscriptLayout'
 import { parseSearchParams, redirectToError } from './utils'
 
 export default compose(
   withJournal,
+  withState('editorInChief', 'setEiC', 'N/A'),
   ConnectPage(({ match }) => [
     actions.getCollection({ id: match.params.project }),
     actions.getFragment(
@@ -27,6 +34,7 @@ export default compose(
   connect(
     (state, { match }) => ({
       currentUser: selectCurrentUser(state),
+      handlingEditors: selectHandlingEditors(state),
       project: selectCollection(state, match.params.project),
       version: selectFragment(state, match.params.version),
     }),
@@ -37,18 +45,16 @@ export default compose(
       getSignedUrl,
     },
   ),
-  lifecycle({
-    componentDidMount() {
-      const { reviewerDecision, replace, location, match } = this.props
-      const collectionId = match.params.project
-      const { agree, invitationId } = parseSearchParams(location.search)
-      if (agree === 'true') {
-        replace(location.pathname)
-        reviewerDecision(invitationId, collectionId, true).catch(
-          redirectToError(replace),
-        )
-      }
-    },
+  ConnectPage(({ currentUser, handlingEditors, project }) => {
+    const he = get(project, 'handlingEditor')
+    if (
+      !he &&
+      !handlingEditors.length &&
+      (get(currentUser, 'admin') || get(currentUser, 'editorInChief'))
+    ) {
+      return [getHandlingEditors()]
+    }
+    return []
   }),
   withHandlers({
     updateManuscript: ({ updateVersion, project, version }) => data =>
@@ -75,5 +81,34 @@ export default compose(
         document.body.removeChild(a)
       })
     },
+    setEditorInChief: ({ setEiC }) => eic => {
+      if (eic) {
+        const { firstName = '', lastName = '' } = eic
+        setEiC(`${firstName} ${lastName}`)
+      }
+    },
+  }),
+  lifecycle({
+    componentDidMount() {
+      const {
+        reviewerDecision,
+        replace,
+        location,
+        match,
+        setEditorInChief,
+      } = this.props
+      const collectionId = match.params.project
+      const { agree, invitationId } = parseSearchParams(location.search)
+      if (agree === 'true') {
+        replace(location.pathname)
+        reviewerDecision(invitationId, collectionId, true).catch(
+          redirectToError(replace),
+        )
+      }
+
+      apiGet(`/users?editorInChief=true`).then(res =>
+        setEditorInChief(head(res.users)),
+      )
+    },
   }),
 )(ManuscriptLayout)

packages/component-manuscript/src/components/SideBarRoles.js

 import React from 'react'
-import { th, Button } from '@pubsweet/ui'
-import { get } from 'lodash'
+import { th } from '@pubsweet/ui'
 import styled, { css } from 'styled-components'
 
-const getHE = project => {
-  const heName = get(project, 'handlingEditor.name')
+import { HandlingEditorSection } from 'pubsweet-components-faraday/src/components/Dashboard'
 
-  if (heName) {
-    return <Name> {heName} </Name>
-  }
-  return <ActionButton>Assign</ActionButton>
-}
-
-const SideBarRoles = ({ project }) => (
+const SideBarRoles = ({ project, editorInChief, currentUser }) => (
   <Root>
     <Row>
       <Text>Editor in Chief</Text>
-      <Name>John Snow</Name>
+      <Name>{editorInChief}</Name>
     </Row>
     <Row>
-      <Text>Handling Editor</Text>
-      {getHE(project)}
+      <HandlingEditorSection currentUser={currentUser} project={project} />
     </Row>
   </Root>
 )
@@ -51,15 +42,24 @@ const Name = styled.div`
 const Row = styled.div`
   display: flex;
   justify-content: space-between;
+  div {
+    justify-content: space-between;
+  }
+  button {
+    &:first-child {
+      align-items: center;
+      background-color: ${th('colorBackground')};
+      color: ${th('colorText')};
+      padding: 4px 8px;
+      text-align: center;
+      height: calc(${th('subGridUnit')}*5);
+      text-transform: uppercase;
+      margin: 0;
+    }
+    &:last-child {
+      margin: 0 0 0 ${th('subGridUnit')};
+    }
+  }
 `
-const ActionButton = styled(Button)`
-  ${defaultText};
-  align-items: center;
-  background-color: ${th('colorBackground')};
-  padding: 4px 8px;
-  text-align: center;
-  height: calc(${th('subGridUnit')}*5);
-  text-transform: uppercase;
-  margin: 0;
-`
+
 // #endregion

packages/components-faraday/src/components/Dashboard/HandlingEditorSection.js

@@ -41,6 +41,8 @@ const defaultText = css`
 `
 const Root = styled.div`
   display: flex;
+  flex-wrap: wrap;
+  flex: 1;
 `
 
 const HEText = styled.div`