feat(manuscriptheader): add affiliations flag for authors

packages/component-faraday-ui/src/AuthorTagList.js

 import React from 'react'
 import styled from 'styled-components'
-import { groupBy } from 'lodash'
+import { groupBy, get } from 'lodash'
 import { th } from '@pubsweet/ui-toolkit'
 import { compose, withState, withHandlers, withProps } from 'recompose'
 
@@ -13,7 +13,7 @@ import {
   AuthorWithTooltip,
 } from 'pubsweet-component-faraday-ui'
 
-const parseAffiliationGroup = authors => {
+const parseAffiliationGroup = (authors = []) => {
   const affiliationGroup = groupBy(authors, 'affiliation')
   const affiliationList = Object.keys(affiliationGroup)
   const list = affiliationList.reduce((acc, el, index) => {
@@ -31,19 +31,20 @@ const parseAffiliationGroup = authors => {
 }
 
 const AuthorTagList = ({
-  authorsAffiliations: { list = [], affiliationList = [] },
+  authors = [],
+  affiliationList,
   separator = ',',
   authorKey = 'email',
-  tooltip = false,
-  affiliations = false,
+  withTooltip = false,
+  withAffiliations = false,
   showAffiliation = false,
   toggleAffiliation,
 }) => (
   <Root>
-    {list
+    {authors
       .map(
         a =>
-          tooltip ? (
+          withTooltip ? (
             <AuthorWithTooltip author={a} key={a[authorKey]} />
           ) : (
             <AuthorTag author={a} key={a[authorKey]} />
@@ -56,7 +57,7 @@ const AuthorTagList = ({
             : [prev, separator, <span key={curr}>&nbsp;</span>, curr],
         [],
       )}
-    {affiliations && (
+    {withAffiliations && (
       <Item ml={1}>
         {showAffiliation ? (
           <ActionLink icon="minus" onClick={toggleAffiliation(false)}>
@@ -70,7 +71,7 @@ const AuthorTagList = ({
       </Item>
     )}
 
-    {affiliations &&
+    {withAffiliations &&
       showAffiliation && (
         <AffiliationRow>
           {affiliationList.map((a, i) => (
@@ -85,8 +86,13 @@ const AuthorTagList = ({
 )
 export default compose(
   withState('showAffiliation', 'setAffiliation', false),
-  withProps(({ authors = [] }) => ({
-    authorsAffiliations: parseAffiliationGroup(authors),
+  withProps(({ authors = [], withAffiliations }) => ({
+    authors: withAffiliations
+      ? get(parseAffiliationGroup(authors), 'list', [])
+      : authors,
+    affiliationList:
+      withAffiliations &&
+      get(parseAffiliationGroup(authors), 'affiliationList', []),
   })),
   withHandlers({
     toggleAffiliation: ({ setAffiliation }) => value => () =>

packages/component-faraday-ui/src/AuthorTagList.md

@@ -61,8 +61,16 @@ const authors = [
     affiliation: 'US Presidency',
     affiliationNumber: 2,
   },
+  {
+    id: 4,
+    email: 'barrack.obama@gmail.com',
+    firstName: 'Sebi',
+    lastName: 'Mihalache',
+    affiliation: 'US Presidency',
+    affiliationNumber: 2,
+  },
 ]
-;<AuthorTagList authors={authors} tooltip affiliations />
+;<AuthorTagList authors={authors} withTooltip withAffiliations />
 ```
 
 A list of author tags with tooltip
@@ -88,7 +96,7 @@ const authors = [
     lastName: 'Obama',
   },
 ]
-;<AuthorTagList authors={authors} tooltip />
+;<AuthorTagList authors={authors} withTooltip />
 ```
 
 Use a different separator and key for mapping the authors.

packages/component-faraday-ui/src/ManuscriptCard.js

@@ -45,7 +45,7 @@ const ManuscriptCard = ({
         </Row>
         {authors.length > 0 && (
           <Row alignItems="center" justify="flex-start" mb={1}>
-            <AuthorTagList authors={authors} tooltip />
+            <AuthorTagList authors={authors} withTooltip />
           </Row>
         )}
         <Row alignItems="center" justify="flex-start" mb={1}>

packages/component-faraday-ui/src/manuscriptDetails/ManuscriptHeader.js

@@ -23,7 +23,12 @@ const ManuscriptHeader = ({
       </Row>
       {authors.length > 0 && (
         <Row alignItems="center" justify="flex-start" mb={1}>
-          <AuthorTagList authors={authors} tooltip />
+          <AuthorTagList
+            affiliations
+            authors={authors}
+            withAffiliations
+            withTooltip
+          />
         </Row>
       )}
       <Row alignItems="center" justify="flex-start" mb={1}>