diff --git a/packages/component-faraday-ui/src/AuthorTag.js b/packages/component-faraday-ui/src/AuthorTag.js
index ab46aabc5e48b8edb830aa54f5c449bce8d71d16..d6a42289a15da03fd29c3e1a172a63e81f7eec7e 100644
--- a/packages/component-faraday-ui/src/AuthorTag.js
+++ b/packages/component-faraday-ui/src/AuthorTag.js
@@ -6,9 +6,16 @@ import Tag from './Tag'
import Text from './Text'
const AuthorTag = ({
- author: { firstName, lastName, isCorresponding, isSubmitting },
+ author: {
+ firstName,
+ lastName,
+ isCorresponding,
+ isSubmitting,
+ affiliationNumber,
+ },
}) => (
<Root>
+ {affiliationNumber && <Superscript>{affiliationNumber}</Superscript>}
<Text>{`${firstName} ${lastName}`}</Text>
{isSubmitting && <Tag>SA</Tag>}
{isCorresponding && <Tag>CA</Tag>}
@@ -27,4 +34,10 @@ const Root = styled.div`
margin-left: calc(${th('gridUnit')} / 2);
}
`
+const Superscript = styled.span`
+ position: relative;
+ top: -0.5em;
+ font-size: 80%;
+ font-family: ${th('fontInterface')};
+`
// #endregion
diff --git a/packages/component-faraday-ui/src/AuthorTagList.js b/packages/component-faraday-ui/src/AuthorTagList.js
index 1792cd7b3023ed597f3e9e78cef3d6c56a4b2342..0592061f2a9532edf837d160a61664d1c1b55084 100644
--- a/packages/component-faraday-ui/src/AuthorTagList.js
+++ b/packages/component-faraday-ui/src/AuthorTagList.js
@@ -1,20 +1,50 @@
import React from 'react'
import styled from 'styled-components'
+import { groupBy, get } from 'lodash'
import { th } from '@pubsweet/ui-toolkit'
+import { compose, withState, withHandlers, withProps } from 'recompose'
-import { AuthorTag, AuthorWithTooltip } from 'pubsweet-component-faraday-ui'
+import {
+ Row,
+ Item,
+ Text,
+ AuthorTag,
+ ActionLink,
+ AuthorWithTooltip,
+} from 'pubsweet-component-faraday-ui'
+
+const parseAffiliationGroup = (authors = []) => {
+ const affiliationGroup = groupBy(authors, 'affiliation')
+ const affiliationList = Object.keys(affiliationGroup)
+ const list = affiliationList.reduce((acc, el, index) => {
+ const authorGroup = affiliationGroup[el].map(i => {
+ i.affiliationNumber = index + 1
+ return i
+ })
+ return [...authorGroup, ...acc]
+ }, [])
+
+ return {
+ list,
+ affiliationList,
+ }
+}
const AuthorTagList = ({
authors = [],
- tooltip = false,
+ affiliationList,
separator = ',',
authorKey = 'email',
+ withTooltip = false,
+ withAffiliations = false,
+ showAffiliation = false,
+ toggleAffiliation,
}) => (
<Root>
{authors
.map(
a =>
- tooltip ? (
+ withTooltip ? (
<AuthorWithTooltip author={a} key={a[authorKey]} />
) : (
<AuthorTag author={a} key={a[authorKey]} />
@@ -27,10 +57,48 @@ const AuthorTagList = ({
: [prev, separator, <span key={curr}> </span>, curr],
[],
)}
+ {withAffiliations && (
+ <Item ml={1}>
+ {showAffiliation ? (
+ <ActionLink icon="minus" onClick={toggleAffiliation(false)}>
+ Hide Affiliations
+ </ActionLink>
+ ) : (
+ <ActionLink icon="plus" onClick={toggleAffiliation(true)}>
+ Show Affiliations
+ </ActionLink>
+ )}
+ </Item>
+ )}
+
+ {withAffiliations &&
+ showAffiliation && (
+ <AffiliationRow>
+ {affiliationList.map((a, i) => (
+ <Item flex={1} key={a}>
+ <Superscript>{i + 1}</Superscript>
+ <Text>{a}</Text>
+ </Item>
+ ))}
+ </AffiliationRow>
+ )}
</Root>
)
-
-export default AuthorTagList
+export default compose(
+ withState('showAffiliation', 'setAffiliation', false),
+ withProps(({ authors = [], withAffiliations }) => ({
+ authors: withAffiliations
+ ? get(parseAffiliationGroup(authors), 'list', [])
+ : authors,
+ affiliationList:
+ withAffiliations &&
+ get(parseAffiliationGroup(authors), 'affiliationList', []),
+ })),
+ withHandlers({
+ toggleAffiliation: ({ setAffiliation }) => value => () =>
+ setAffiliation(value),
+ }),
+)(AuthorTagList)
// #region styles
const Root = styled.div`
@@ -40,4 +108,15 @@ const Root = styled.div`
font-family: ${th('fontReading')};
`
+const AffiliationRow = styled(Row)`
+ border-left: 1px solid ${th('colorBackgroundHue')};
+ padding-left: ${th('gridUnit')};
+ flex-direction: column;
+`
+const Superscript = styled.span`
+ position: relative;
+ top: -0.5em;
+ font-size: 80%;
+ font-family: ${th('fontInterface')};
+`
// #endregion
diff --git a/packages/component-faraday-ui/src/AuthorTagList.md b/packages/component-faraday-ui/src/AuthorTagList.md
index f948cc048963e23861808937e68a0a7d09c91304..62cc3421ddc446e5d091424391a17a152cd20673 100644
--- a/packages/component-faraday-ui/src/AuthorTagList.md
+++ b/packages/component-faraday-ui/src/AuthorTagList.md
@@ -7,6 +7,7 @@ const authors = [
email: 'john.doe@gmail.com',
firstName: 'John',
lastName: 'Doe',
+ affiliation: 'University of California',
isSubmitting: true,
},
{
@@ -14,6 +15,7 @@ const authors = [
email: 'michael.felps@gmail.com',
firstName: 'Michael',
lastName: 'Felps',
+ affiliation: 'US Presidency',
isSubmitting: true,
isCorresponding: true,
},
@@ -22,38 +24,79 @@ const authors = [
email: 'barrack.obama@gmail.com',
firstName: 'Barrack',
lastName: 'Obama',
- affiliation: 'US Presidency'
+ affiliation: 'US Presidency',
},
]
-
;<AuthorTagList authors={authors} />
```
-A list of author tags with tooltip
+A list of author tags with affiliation and tooltip
```js
const authors = [
{
+ id: 1,
email: 'john.doe@gmail.com',
firstName: 'John',
lastName: 'Doe',
+ affiliation: 'University of California',
isSubmitting: true,
+ affiliationNumber: 1,
},
{
+ id: 2,
email: 'michael.felps@gmail.com',
firstName: 'Michael',
lastName: 'Felps',
+ affiliation: 'US Presidency',
isSubmitting: true,
isCorresponding: true,
+ affiliationNumber: 2,
},
{
+ id: 3,
email: 'barrack.obama@gmail.com',
firstName: 'Barrack',
lastName: 'Obama',
+ affiliation: 'US Presidency',
+ affiliationNumber: 2,
+ },
+ {
+ id: 4,
+ email: 'barrack.obama@gmail.com',
+ firstName: 'Sebi',
+ lastName: 'Mihalache',
+ affiliation: 'US Presidency',
+ affiliationNumber: 2,
},
]
+;<AuthorTagList authors={authors} withTooltip withAffiliations />
+```
-;<AuthorTagList authors={authors} tooltip />
+A list of author tags with tooltip
+
+```js
+const authors = [
+ {
+ email: 'john.doe@gmail.com',
+ firstName: 'John',
+ lastName: 'Doe',
+ isSubmitting: true,
+ },
+ {
+ email: 'michael.felps@gmail.com',
+ firstName: 'Michael',
+ lastName: 'Felps',
+ isSubmitting: true,
+ isCorresponding: true,
+ },
+ {
+ email: 'barrack.obama@gmail.com',
+ firstName: 'Barrack',
+ lastName: 'Obama',
+ },
+]
+;<AuthorTagList authors={authors} withTooltip />
```
Use a different separator and key for mapping the authors.
@@ -78,6 +121,6 @@ const authors = [
firstName: 'Barrack',
lastName: 'Obama',
},
-];
-<AuthorTagList separator="* * *" authors={authors} authorKey="firstName" />
+]
+;<AuthorTagList separator="* * *" authors={authors} authorKey="firstName" />
```
diff --git a/packages/component-faraday-ui/src/ManuscriptCard.js b/packages/component-faraday-ui/src/ManuscriptCard.js
index 97688bbcbd4cec6dccb0717cc5614106f222a0dc..40ea896cc0721b41f93658ddde628fe75d908562 100644
--- a/packages/component-faraday-ui/src/ManuscriptCard.js
+++ b/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}>
diff --git a/packages/component-faraday-ui/src/index.js b/packages/component-faraday-ui/src/index.js
index fd52de8c237374979db60d347a362abaadaec4dc..e8fb22e91094bd9a806c7aebc47a7745a753dca7 100644
--- a/packages/component-faraday-ui/src/index.js
+++ b/packages/component-faraday-ui/src/index.js
@@ -31,6 +31,5 @@ export { default as WizardAuthors } from './WizardAuthors'
export { default as WizardFiles } from './WizardFiles'
export { default as PreviewFile } from './PreviewFile'
-// Manuscript Details
export * from './manuscriptDetails'
export * from './contextualBoxes'
diff --git a/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptDetailsTop.js b/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptDetailsTop.js
index ba3190e450b131c1e7a15d397502a421d2812891..b993e23453fce794a3d28779faf0c3b3cdf7e150 100644
--- a/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptDetailsTop.js
+++ b/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptDetailsTop.js
@@ -33,26 +33,24 @@ const ManuscriptDetailsTop = ({
</Item>
<Item alignItems="center" justify="flex-end">
{canOverrideTechChecks && (
- <IconButton
+ <ActionLink
data-test-id={`button-qa-manuscript-${fragment.id}`}
icon="check-square"
- iconSize={2}
- mr={1}
onClick={goToTechnicalCheck(collection)}
- secondary
- title="Technical Checks"
- />
+ pr={2}
+ >
+ Technical Checks
+ </ActionLink>
)}
{canEditManuscript && (
- <IconButton
- data-test-id={`button-edit-manuscript-${fragment.id}`}
+ <ActionLink
+ data-test-id={`button-qa-manuscript-${fragment.id}`}
icon="edit"
- iconSize={2}
- mr={2}
onClick={goToEdit(collection, fragment)}
- secondary
- title="Edit Manuscript"
- />
+ pr={2}
+ >
+ Edit
+ </ActionLink>
)}
<PreviewFile
file={get(fragment, 'files.manuscripts[0]', {})}
diff --git a/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptHeader.js b/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptHeader.js
index 005fe0b53b8f3647c62a326dce8b70891777349d..de3e08f01c8f260bdec2f279722f66c754baadc0 100644
--- a/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptHeader.js
+++ b/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptHeader.js
@@ -36,7 +36,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}>
diff --git a/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptMetadata.js b/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptMetadata.js
index 911feef484e5a25e9c96dcbd73e6e744b4879ee0..214588cdbb9ab854fbfe5d6298de569e6abda953 100644
--- a/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptMetadata.js
+++ b/packages/component-faraday-ui/src/manuscriptDetails/ManuscriptMetadata.js
@@ -11,12 +11,7 @@ import {
const ManuscriptMetadata = ({
getSignedUrl,
currentUser: { token },
- fragment: {
- files = {},
- authors = [],
- conflicts = {},
- metadata: { abstract = '' },
- },
+ fragment: { files = {}, conflicts = {}, metadata: { abstract = '' } },
}) => (
<Fragment>
{!!abstract && (