From 20ad1e7f45286ebdff4ec214349f65b2171c0e7c Mon Sep 17 00:00:00 2001
From: Alexandru Munteanu <alexandru.munt@gmail.com>
Date: Thu, 24 May 2018 11:13:56 +0300
Subject: [PATCH] chore(manuscript): various coding style improvements
---
.../component-manuscript/src/atoms/index.js | 48 ++++++++--------
.../src/components/Authors.js | 17 +++---
.../src/components/Files.js | 4 +-
.../src/components/MakeDecision.js | 23 ++++----
.../src/components/ManuscriptDetails.js | 2 +-
.../src/components/ManuscriptHeader.js | 8 +--
.../src/components/ManuscriptLayout.js | 14 ++---
.../src/components/ManuscriptPage.js | 18 +++---
.../src/components/ManuscriptVersion.js | 2 +-
.../src/components/ReviewReportCard.js | 4 +-
.../src/components/ReviewerReportForm.js | 55 ++++++++++---------
.../src/components/ReviewsAndReports.js | 24 ++++----
.../src/components/ShowMore.js | 1 -
.../src/components/SideBarRoles.js | 11 ++--
.../src/components/index.js | 12 +++-
.../src/components/utils.js | 6 +-
.../src/molecules/AuthorsWithTooltip.js | 30 +++++-----
.../src/molecules/index.js | 3 +
18 files changed, 141 insertions(+), 141 deletions(-)
create mode 100644 packages/component-manuscript/src/molecules/index.js
diff --git a/packages/component-manuscript/src/atoms/index.js b/packages/component-manuscript/src/atoms/index.js
index f28d7d8ad..d9d10c1af 100644
--- a/packages/component-manuscript/src/atoms/index.js
+++ b/packages/component-manuscript/src/atoms/index.js
@@ -28,8 +28,8 @@ const Container = styled.div`
`
const SideBar = styled.div`
- flex: ${({ flex }) => flex || 1};
background-color: ${th('colorBackground')};
+ flex: ${({ flex }) => flex || 1};
padding: ${th('subGridUnit')};
`
@@ -50,7 +50,7 @@ const BreadCrumbs = styled.div`
&:after {
content: '>';
- padding: 0 calc(${th('subGridUnit')}*2);
+ padding: 0 calc(${th('subGridUnit')} * 2);
}
&:last-child {
@@ -73,30 +73,30 @@ const ManuscriptId = styled.div`
`
const LeftDetails = styled.div`
+ align-items: center;
display: flex;
flex-direction: row;
justify-content: flex-start;
- align-items: center;
flex: ${({ flex }) => flex || 1};
`
const RightDetails = styled.div`
+ align-items: center;
display: flex;
+ flex: ${({ flex }) => flex || 1};
flex-direction: row;
justify-content: flex-end;
- align-items: center;
- flex: ${({ flex }) => flex || 1};
`
const StatusLabel = styled.div`
- border: ${th('borderDefault')};
${defaultText};
+ border: ${th('borderDefault')};
+ color: ${th('colorPrimary')};
font-weight: bold;
padding: 0 0.5em;
text-align: left;
text-transform: capitalize;
line-height: 1.5;
- color: ${th('colorPrimary')};
`
const DateField = styled.span`
@@ -105,18 +105,18 @@ const DateField = styled.span`
text-align: left;
`
const Row = styled.div`
+ box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
- box-sizing: border-box;
flex-wrap: wrap;
`
const ManuscriptType = styled.div`
${defaultText};
padding: ${th('subGridUnit')};
- margin-left: calc(${th('subGridUnit')}*2);
+ margin-left: calc(${th('subGridUnit')} * 2);
text-align: right;
text-transform: capitalize;
text-overflow: ellipsis;
@@ -126,7 +126,7 @@ const ManuscriptType = styled.div`
const ManuscriptHeader = styled.div`
border-bottom: ${th('borderDefault')};
- padding-bottom: calc(${th('subGridUnit')}*2);
+ padding-bottom: calc(${th('subGridUnit')} * 2);
`
const ModalRoot = styled.form`
@@ -152,9 +152,9 @@ const ActionButton = styled(Button)`
background-color: ${th('colorPrimary')};
color: ${th('colorTextReverse')};
display: flex;
- padding: 4px 8px;
+ height: calc(${th('subGridUnit')} * 5);
+ padding: calc(${th('subGridUnit')} / 2) ${th('subGridUnit')};
text-align: center;
- height: calc(${th('subGridUnit')}*5);
text-transform: uppercase;
`
@@ -196,24 +196,24 @@ const ButtonsContainer = styled.div`
`
export {
+ Row,
Root,
- BreadCrumbs,
- Header,
Title,
- ManuscriptId,
- ManuscriptType,
- Container,
+ Header,
SideBar,
+ CloseIcon,
+ ModalRoot,
+ Container,
+ DateField,
+ ModalTitle,
+ StatusLabel,
+ BreadCrumbs,
LeftDetails,
+ ActionButton,
+ ManuscriptId,
RightDetails,
- StatusLabel,
- DateField,
- Row,
+ ManuscriptType,
ManuscriptHeader,
- ModalRoot,
- ActionButton,
- CloseIcon,
- ModalTitle,
CustomRadioGroup,
SpinnerContainer,
ButtonsContainer,
diff --git a/packages/component-manuscript/src/components/Authors.js b/packages/component-manuscript/src/components/Authors.js
index bd8462bca..c544a6360 100644
--- a/packages/component-manuscript/src/components/Authors.js
+++ b/packages/component-manuscript/src/components/Authors.js
@@ -5,10 +5,10 @@ import styled from 'styled-components'
const TR = ({
name,
email,
+ index,
affiliation,
isSubmitting,
isCorresponding,
- index,
}) => (
<Row>
<td width="20">{index + 1}</td>
@@ -36,12 +36,12 @@ const Authors = ({ authors }) => (
(
{
userId,
- firstName = '',
- lastName = '',
email = '',
+ isSubmitting,
+ lastName = '',
+ firstName = '',
affiliation = '',
isCorresponding,
- isSubmitting,
},
index,
) => (
@@ -68,7 +68,7 @@ const Row = styled.tr`
color: ${th('colorPrimary')};
font-family: ${th('fontReading')};
font-size: ${th('fontSizeBaseSmall')};
- height: 40px;
+ height: calc(${th('subGridUnit')} * 7);
text-align: left;
td:first-child {
font-weight: bold;
@@ -86,10 +86,10 @@ const AuthorStatus = styled.span`
border: ${th('borderDefault')};
font-family: ${th('fontReading')};
font-size: ${th('fontSizeBaseSmall')};
+ margin-left: ${th('subGridUnit')};
+ padding: 0 calc(${th('subGridUnit')} / 2);
text-align: center;
text-transform: uppercase;
- padding: 0 2px;
- margin-left: 4px;
`
const Table = styled.table`
@@ -103,9 +103,8 @@ const Table = styled.table`
font-family: ${th('fontReading')};
font-size: ${th('fontSizeBaseSmall')};
font-weight: bold;
- height: 40px;
+ height: calc(${th('subGridUnit')} * 7);
text-align: left;
}
`
-
// #endregion
diff --git a/packages/component-manuscript/src/components/Files.js b/packages/component-manuscript/src/components/Files.js
index 7311a7801..8a9c4057d 100644
--- a/packages/component-manuscript/src/components/Files.js
+++ b/packages/component-manuscript/src/components/Files.js
@@ -1,6 +1,6 @@
import React, { Fragment } from 'react'
-import styled, { css } from 'styled-components'
import { th } from '@pubsweet/ui'
+import styled, { css } from 'styled-components'
import { FileItem } from 'pubsweet-components-faraday/src/components/Files'
@@ -60,8 +60,8 @@ const Header = styled.div`
flex-direction: row;
& span {
- margin-right: ${th('subGridUnit')};
${defaultText};
+ margin-right: ${th('subGridUnit')};
margin-top: ${th('subGridUnit')};
text-transform: uppercase;
}
diff --git a/packages/component-manuscript/src/components/MakeDecision.js b/packages/component-manuscript/src/components/MakeDecision.js
index 711afbc93..e9662b768 100644
--- a/packages/component-manuscript/src/components/MakeDecision.js
+++ b/packages/component-manuscript/src/components/MakeDecision.js
@@ -3,33 +3,32 @@ import { get } from 'lodash'
import { connect } from 'react-redux'
import { AbstractEditor } from 'xpub-edit'
import { required } from 'xpub-validators'
-import { withTheme } from 'styled-components'
import { compose, withHandlers } from 'recompose'
import { withModal } from 'pubsweet-component-modal/src/components'
import {
Icon,
- RadioGroup,
- ValidatedField,
- Spinner,
Button,
+ Spinner,
ErrorText,
+ RadioGroup,
+ ValidatedField,
} from '@pubsweet/ui'
import {
reduxForm,
- change as changeForm,
- getFormValues,
isSubmitting,
+ getFormValues,
+ change as changeForm,
} from 'redux-form'
import {
+ Row,
ModalRoot,
- ActionButton,
CloseIcon,
ModalTitle,
+ ActionButton,
CustomRadioGroup,
ButtonsContainer,
SpinnerContainer,
- Row,
} from '../atoms'
const options = [
@@ -48,7 +47,7 @@ const options = [
]
const MakeDecision = ({ showDecisionModal }) => (
- <ActionButton onClick={showDecisionModal}> Make Decision </ActionButton>
+ <ActionButton onClick={showDecisionModal}>Make Decision</ActionButton>
)
// To be removed
@@ -57,12 +56,11 @@ const sleep = ms => new Promise(resolve => setTimeout(resolve, ms))
const DecisionModal = compose(
connect(
state => ({
- decision: get(getFormValues('makeDecision')(state), 'decision'),
isSubmitting: isSubmitting('makeDecision')(state),
+ decision: get(getFormValues('makeDecision')(state), 'decision'),
}),
{ changeForm, getFormValues },
),
- withTheme,
reduxForm({
form: 'makeDecision',
onSubmit: (values, dispatch, { isSubmitting }) =>
@@ -78,7 +76,6 @@ const DecisionModal = compose(
}),
)(
({
- theme,
error,
decision,
hideModal,
@@ -88,7 +85,7 @@ const DecisionModal = compose(
}) => (
<ModalRoot>
<CloseIcon data-test="icon-modal-hide" onClick={hideModal}>
- <Icon color={theme.colorPrimary}>x</Icon>
+ <Icon primary>x</Icon>
</CloseIcon>
<ModalTitle>Manuscript Decision</ModalTitle>
diff --git a/packages/component-manuscript/src/components/ManuscriptDetails.js b/packages/component-manuscript/src/components/ManuscriptDetails.js
index b439f1efd..291f0ff94 100644
--- a/packages/component-manuscript/src/components/ManuscriptDetails.js
+++ b/packages/component-manuscript/src/components/ManuscriptDetails.js
@@ -4,7 +4,7 @@ import { th } from '@pubsweet/ui'
import styled from 'styled-components'
import { Authors, Files } from './'
-import Expandable from '../molecules/Expandable'
+import { Expandable } from '../molecules/'
const ManuscriptDetails = ({
collection: { authors = [] },
diff --git a/packages/component-manuscript/src/components/ManuscriptHeader.js b/packages/component-manuscript/src/components/ManuscriptHeader.js
index 03f49d508..4cb4728ce 100644
--- a/packages/component-manuscript/src/components/ManuscriptHeader.js
+++ b/packages/component-manuscript/src/components/ManuscriptHeader.js
@@ -3,18 +3,18 @@ import { get } from 'lodash'
// import { AuthorsWithTooltip } from '@pubsweet/ui'
import {
+ Row,
Title,
+ DateField,
LeftDetails,
- RightDetails,
- Row,
StatusLabel,
- DateField,
+ RightDetails,
ManuscriptType,
ManuscriptHeader,
} from '../atoms'
-import { parseVersion, parseJournalIssue, mapStatusToLabel } from './utils'
import AuthorsWithTooltip from '../molecules/AuthorsWithTooltip'
+import { parseVersion, parseJournalIssue, mapStatusToLabel } from './utils'
const ManuscriptDetails = ({ version, project, journal }) => {
const { submitted, title, type } = parseVersion(version)
diff --git a/packages/component-manuscript/src/components/ManuscriptLayout.js b/packages/component-manuscript/src/components/ManuscriptLayout.js
index 24328c05a..fc6ee0ccf 100644
--- a/packages/component-manuscript/src/components/ManuscriptLayout.js
+++ b/packages/component-manuscript/src/components/ManuscriptLayout.js
@@ -5,30 +5,30 @@ import ManuscriptHeader from './ManuscriptHeader'
import ManuscriptVersion from './ManuscriptVersion'
import {
Root,
- BreadCrumbs,
Header,
- ManuscriptId,
- Container,
SideBar,
+ Container,
LeftDetails,
+ BreadCrumbs,
+ ManuscriptId,
RightDetails,
} from '../atoms'
import {
- ManuscriptDetails,
- SideBarActions,
SideBarRoles,
+ SideBarActions,
ReviewsAndReports,
+ ManuscriptDetails,
} from './'
const ManuscriptLayout = ({
- project = {},
- version = {},
journal,
history,
currentUser,
currentUserIs,
editorInChief,
updateManuscript,
+ project = {},
+ version = {},
}) => (
<Root>
{!isEmpty(project) && !isEmpty(version) ? (
diff --git a/packages/component-manuscript/src/components/ManuscriptPage.js b/packages/component-manuscript/src/components/ManuscriptPage.js
index 423059a5c..2c966176c 100644
--- a/packages/component-manuscript/src/components/ManuscriptPage.js
+++ b/packages/component-manuscript/src/components/ManuscriptPage.js
@@ -1,14 +1,14 @@
import { connect } from 'react-redux'
+import { head, get } from 'lodash'
import { actions } from 'pubsweet-client'
import { ConnectPage } from 'xpub-connect'
import { withJournal } from 'xpub-journal'
import { replace } from 'react-router-redux'
import { withRouter } from 'react-router-dom'
-import { head, get } from 'lodash'
import {
- selectCurrentUser,
- selectCollection,
selectFragment,
+ selectCollection,
+ selectCurrentUser,
} from 'xpub-selectors'
import { get as apiGet } from 'pubsweet-client/src/helpers/api'
import { compose, lifecycle, withHandlers, withState } from 'recompose'
@@ -37,15 +37,15 @@ export default compose(
(state, { match }) => ({
currentUser: selectCurrentUser(state),
handlingEditors: selectHandlingEditors(state),
- project: selectCollection(state, match.params.project),
version: selectFragment(state, match.params.version),
+ project: selectCollection(state, match.params.project),
}),
{
- reviewerDecision,
replace,
- updateVersion: actions.updateFragment,
getSignedUrl,
+ reviewerDecision,
getCollection: actions.getCollection,
+ updateVersion: actions.updateFragment,
},
),
ConnectPage(({ currentUser, handlingEditors, project }) => {
@@ -90,12 +90,12 @@ export default compose(
lifecycle({
componentDidMount() {
const {
- reviewerDecision,
+ match,
replace,
location,
- match,
- setEditorInChief,
getCollection,
+ reviewerDecision,
+ setEditorInChief,
} = this.props
const collectionId = match.params.project
const { agree, invitationId } = parseSearchParams(location.search)
diff --git a/packages/component-manuscript/src/components/ManuscriptVersion.js b/packages/component-manuscript/src/components/ManuscriptVersion.js
index 780b31916..7da222858 100644
--- a/packages/component-manuscript/src/components/ManuscriptVersion.js
+++ b/packages/component-manuscript/src/components/ManuscriptVersion.js
@@ -3,8 +3,8 @@ import { get } from 'lodash'
import { Menu } from '@pubsweet/ui'
import { compose } from 'recompose'
import { connect } from 'react-redux'
-import { selectFragments } from 'xpub-selectors'
import { withRouter } from 'react-router-dom'
+import { selectFragments } from 'xpub-selectors'
import { parseVersionOptions } from './utils'
diff --git a/packages/component-manuscript/src/components/ReviewReportCard.js b/packages/component-manuscript/src/components/ReviewReportCard.js
index 276b06f28..7875351f9 100644
--- a/packages/component-manuscript/src/components/ReviewReportCard.js
+++ b/packages/component-manuscript/src/components/ReviewReportCard.js
@@ -1,13 +1,13 @@
import React, { Fragment } from 'react'
import moment from 'moment'
-import { get, isEmpty } from 'lodash'
import { th } from '@pubsweet/ui'
import { compose } from 'recompose'
+import { get, isEmpty } from 'lodash'
import { withJournal } from 'xpub-journal'
import styled, { css } from 'styled-components'
import { FileItem } from 'pubsweet-components-faraday/src/components/Files'
-import ShowMore from './ShowMore'
+import { ShowMore } from './'
const ReviewReportCard = ({
i = 0,
diff --git a/packages/component-manuscript/src/components/ReviewerReportForm.js b/packages/component-manuscript/src/components/ReviewerReportForm.js
index ea57788bd..366f86896 100644
--- a/packages/component-manuscript/src/components/ReviewerReportForm.js
+++ b/packages/component-manuscript/src/components/ReviewerReportForm.js
@@ -1,8 +1,8 @@
import React, { Fragment } from 'react'
-import { isEmpty, merge } from 'lodash'
import { connect } from 'react-redux'
-import { required } from 'xpub-validators'
+import { isEmpty, merge } from 'lodash'
import { withJournal } from 'xpub-journal'
+import { required } from 'xpub-validators'
import styled, { css } from 'styled-components'
import {
th,
@@ -56,15 +56,15 @@ const guidelinesLink =
const ReviewerReportForm = ({
addFile,
+ fileError,
removeFile,
- review = {},
+ changeField,
errorRequest,
isSubmitting,
- changeField,
handleSubmit,
- formValues = {},
fileFetching,
- fileError,
+ review = {},
+ formValues = {},
journal: { recommendations },
}) => (
<Root>
@@ -201,8 +201,8 @@ const ReviewerReportForm = ({
const ModalWrapper = compose(
connect(state => ({
- fetching: selectFetching(state),
modalError: selectError(state),
+ fetching: selectFetching(state),
})),
)(({ fetching, ...rest }) => (
<ConfirmationModal {...rest} isFetching={fetching} />
@@ -212,20 +212,20 @@ export default compose(
withJournal,
connect(
state => ({
- formValues: getFormValues('reviewerReport')(state),
- isSubmitting: isSubmitting('reviewerReport')(state),
+ fileError: getFileError(state),
errorRequest: selectError(state),
fileFetching: getRequestStatus(state),
- fileError: getFileError(state),
+ formValues: getFormValues('reviewerReport')(state),
+ isSubmitting: isSubmitting('reviewerReport')(state),
}),
{
+ uploadFile,
+ deleteFile,
changeForm,
+ getSignedUrl,
getFormValues,
createRecommendation,
updateRecommendation,
- uploadFile,
- deleteFile,
- getSignedUrl,
},
),
withProps(({ review = {}, formValues = {} }) => ({
@@ -265,10 +265,10 @@ export default compose(
}),
reduxForm({
form: 'reviewerReport',
- enableReinitialize: true,
- keepDirtyOnReinitialize: true,
onChange: onReviewChange,
onSubmit: onReviewSubmit,
+ enableReinitialize: true,
+ keepDirtyOnReinitialize: true,
}),
)(ReviewerReportForm)
@@ -299,35 +299,36 @@ const Label = styled.div`
const ActionText = styled.span`
${defaultText};
- text-decoration: underline;
cursor: pointer;
margin-left: ${({ left }) => left || 0}px;
+ text-decoration: underline;
`
const ActionTextIcon = styled(ActionText)`
- display: flex;
align-items: center;
+ display: flex;
`
const ActionLink = styled.a`
${defaultText};
`
const Textarea = styled.textarea`
- width: 100%;
- padding: calc(${th('subGridUnit')}*2);
- font-size: ${th('fontSizeBaseSmall')};
- font-family: ${th('fontWriting')};
border-color: ${({ hasError }) =>
hasError ? th('colorError') : th('colorPrimary')};
+ font-size: ${th('fontSizeBaseSmall')};
+ font-family: ${th('fontWriting')};
+ padding: calc(${th('subGridUnit')} * 2);
transition: all 300ms linear;
+ width: 100%;
+
&:read-only {
background-color: ${th('colorBackgroundHue')};
}
`
const Spacing = styled.div`
- margin-top: ${th('gridUnit')};
flex: 1;
+ margin-top: ${th('gridUnit')};
`
const FullWidth = styled.div`
@@ -338,14 +339,14 @@ const FullWidth = styled.div`
`
const Row = styled.div`
+ ${defaultText};
+ align-items: center;
+ box-sizing: border-box;
display: flex;
flex-direction: row;
- align-items: center;
flex: 1;
- box-sizing: border-box;
flex-wrap: wrap;
justify-content: ${({ left }) => (left ? 'left' : 'space-between')};
- ${defaultText};
`
const ActionButton = styled(Button)`
@@ -354,9 +355,9 @@ const ActionButton = styled(Button)`
background-color: ${th('colorPrimary')};
color: ${th('colorTextReverse')};
display: flex;
- padding: 4px 8px;
+ padding: calc(${th('subGridUnit')} / 2) calc(${th('subGridUnit')});
text-align: center;
- height: calc(${th('subGridUnit')}*5);
+ height: calc(${th('subGridUnit')} * 5);
text-transform: uppercase;
`
// #endregion
diff --git a/packages/component-manuscript/src/components/ReviewsAndReports.js b/packages/component-manuscript/src/components/ReviewsAndReports.js
index 9010bcba8..83f781ca1 100644
--- a/packages/component-manuscript/src/components/ReviewsAndReports.js
+++ b/packages/component-manuscript/src/components/ReviewsAndReports.js
@@ -6,18 +6,16 @@ import styled from 'styled-components'
import { compose, withHandlers, lifecycle, withProps } from 'recompose'
import { ReviewerBreakdown } from 'pubsweet-components-faraday/src/components/Invitations'
import ReviewersDetailsList from 'pubsweet-components-faraday/src/components/Reviewers/ReviewersDetailsList'
-import ReviewerReportForm from 'pubsweet-component-manuscript/src/components/ReviewerReportForm'
-import ReviewReportCard from 'pubsweet-component-manuscript/src/components/ReviewReportCard'
import {
selectReviewers,
- selectFetchingReviewers,
- getCollectionReviewers,
currentUserIsReviewer,
+ getCollectionReviewers,
+ selectFetchingReviewers,
} from 'pubsweet-components-faraday/src/redux/reviewers'
import { selectRecommendations } from 'pubsweet-components-faraday/src/redux/recommendations'
-import Tabs from '../molecules/Tabs'
-import Expandable from '../molecules/Expandable'
+import { Tabs, Expandable } from '../molecules'
+import { ReviewReportCard, ReviewerReportForm } from './'
const getTabSections = (collectionId, reviewers, recommendations = []) => [
{
@@ -45,16 +43,16 @@ const getTabSections = (collectionId, reviewers, recommendations = []) => [
]
const ReviewsAndReports = ({
+ report,
project,
version,
- reviewers = [],
- recommendations = [],
isReviewer,
currentUserIs,
- report,
- review = {},
- mappedRecommendations,
mappedReviewers,
+ mappedRecommendations,
+ review = {},
+ reviewers = [],
+ recommendations = [],
}) => (
<Fragment>
{currentUserIs('staff') && (
@@ -125,8 +123,8 @@ export default compose(
})),
}),
withProps(({ recommendations = [] }) => ({
- report: head(recommendations.filter(r => r.submittedOn)),
review: head(recommendations),
+ report: head(recommendations.filter(r => r.submittedOn)),
})),
lifecycle({
componentDidMount() {
@@ -137,12 +135,10 @@ export default compose(
)(ReviewsAndReports)
// #region styled-components
-
const Root = styled.div`
background-color: ${th('colorBackground')};
border: ${th('borderDefault')};
margin-top: calc(${th('subGridUnit')} * 2);
transition: height 0.3s;
`
-
// #endregion
diff --git a/packages/component-manuscript/src/components/ShowMore.js b/packages/component-manuscript/src/components/ShowMore.js
index 937fda9d9..47553f198 100644
--- a/packages/component-manuscript/src/components/ShowMore.js
+++ b/packages/component-manuscript/src/components/ShowMore.js
@@ -86,5 +86,4 @@ const Control = styled.label`
opacity: 0.7;
}
`
-
// #endregion
diff --git a/packages/component-manuscript/src/components/SideBarRoles.js b/packages/component-manuscript/src/components/SideBarRoles.js
index 7bdf3f4e5..685b77ffb 100644
--- a/packages/component-manuscript/src/components/SideBarRoles.js
+++ b/packages/component-manuscript/src/components/SideBarRoles.js
@@ -27,7 +27,7 @@ const defaultText = css`
const Root = styled.div`
display: flex;
flex-direction: column;
- padding: calc(${th('subGridUnit')}*3) ${th('subGridUnit')};
+ padding: calc(${th('subGridUnit')} * 3) ${th('subGridUnit')};
`
const Text = styled.div`
${defaultText};
@@ -43,7 +43,7 @@ const Row = styled.div`
display: flex;
justify-content: space-between;
line-height: 1.5;
- margin-bottom: calc(${th('subGridUnit')}*2);
+ margin-bottom: calc(${th('subGridUnit')} * 2);
div {
justify-content: space-between;
}
@@ -52,16 +52,15 @@ const Row = styled.div`
align-items: center;
background-color: ${th('colorBackground')};
color: ${th('colorText')};
- padding: 4px 8px;
+ height: calc(${th('subGridUnit')} * 5);
+ margin: 0;
+ padding: calc(${th('subGridUnit')} / 2) ${th('subGridUnit')};
text-align: center;
- height: calc(${th('subGridUnit')}*5);
text-transform: uppercase;
- margin: 0;
}
&:last-child {
margin: 0 0 0 ${th('subGridUnit')};
}
}
`
-
// #endregion
diff --git a/packages/component-manuscript/src/components/index.js b/packages/component-manuscript/src/components/index.js
index 3483d64f2..1171be979 100644
--- a/packages/component-manuscript/src/components/index.js
+++ b/packages/component-manuscript/src/components/index.js
@@ -1,8 +1,14 @@
export { default as Files } from './Files'
export { default as Authors } from './Authors'
+export { default as ShowMore } from './ShowMore'
+export { default as MakeDecision } from './MakeDecision'
+export { default as SideBarRoles } from './SideBarRoles'
export { default as ManuscriptPage } from './ManuscriptPage'
-export { default as ManuscriptDetails } from './ManuscriptDetails'
export { default as SideBarActions } from './SideBarActions'
-export { default as SideBarRoles } from './SideBarRoles'
-export { default as MakeDecision } from './MakeDecision'
+export { default as ReviewReportCard } from './ReviewReportCard'
+export { default as ManuscriptHeader } from './ManuscriptHeader'
+export { default as ManuscriptLayout } from './ManuscriptLayout'
+export { default as ManuscriptDetails } from './ManuscriptDetails'
+export { default as ManuscriptVersion } from './ManuscriptVersion'
export { default as ReviewsAndReports } from './ReviewsAndReports'
+export { default as ReviewerReportForm } from './ReviewerReportForm'
diff --git a/packages/component-manuscript/src/components/utils.js b/packages/component-manuscript/src/components/utils.js
index fcc8c9f23..d9785efb4 100644
--- a/packages/component-manuscript/src/components/utils.js
+++ b/packages/component-manuscript/src/components/utils.js
@@ -47,12 +47,12 @@ export const mapStatusToLabel = ({ visibleStatus, status }) => {
}
export const parseVersion = version => ({
- author: parseAuthor(version),
+ type: parseType(version),
title: parseTitle(version),
+ author: parseAuthor(version),
+ version: get(version, 'version'),
submitted: parseSubmissionDate(version),
- type: parseType(version),
abstract: get(version, 'metadata.abstract'),
- version: get(version, 'version'),
})
export const parseJournalIssue = (journal, metadata) =>
diff --git a/packages/component-manuscript/src/molecules/AuthorsWithTooltip.js b/packages/component-manuscript/src/molecules/AuthorsWithTooltip.js
index ca3059bd7..79532b138 100644
--- a/packages/component-manuscript/src/molecules/AuthorsWithTooltip.js
+++ b/packages/component-manuscript/src/molecules/AuthorsWithTooltip.js
@@ -5,12 +5,12 @@ import { Tooltip } from 'react-tippy'
import styled, { ThemeProvider, withTheme, css } from 'styled-components'
const DefaultTooltip = ({
- authorName,
+ theme,
email,
+ authorName,
affiliation,
isSubmitting,
isCorresponding,
- theme,
}) => (
<ThemeProvider theme={theme}>
<TooltipRoot>
@@ -31,12 +31,12 @@ const DefaultTooltip = ({
)
const DefaultLabel = ({
- firstName,
+ arr,
+ index,
lastName,
+ firstName,
isSubmitting,
isCorresponding,
- arr,
- index,
}) => (
<Author>
<AuthorName>{`${firstName} ${lastName}`}</AuthorName>
@@ -64,13 +64,13 @@ const AuthorsWithTooltip = ({
{authors.map(
(
{
- affiliation = '',
- firstName = '',
- lastName = '',
- email = '',
userId,
isSubmitting,
isCorresponding,
+ email = '',
+ lastName = '',
+ firstName = '',
+ affiliation = '',
...rest
},
index,
@@ -109,16 +109,16 @@ const defaultText = css`
const AuthorList = styled.span`
${defaultText};
- text-align: left;
display: flex;
flex-direction: row;
justify-content: flex-start;
+ text-align: left;
`
const AuthorName = styled.span`
- text-decoration: underline;
- padding-left: 2px;
cursor: default;
+ padding-left: calc(${th('subGridUnit')} / 3);
+ text-decoration: underline;
`
const Author = styled.div`
padding-right: ${th('subGridUnit')};
@@ -127,10 +127,10 @@ const Author = styled.div`
const AuthorStatus = styled.span`
border: ${th('borderDefault')};
${defaultText};
+ margin-left: ${th('subGridUnit')};
+ padding: 0 calc(${th('subGridUnit')} / 3);
text-align: center;
text-transform: uppercase;
- padding: 0 2px;
- margin-left: 4px;
`
const TooltipRoot = styled.div`
@@ -138,7 +138,7 @@ const TooltipRoot = styled.div`
display: flex;
flex-direction: column;
justify-content: center;
- padding: calc(${th('subGridUnit')}*2);
+ padding: calc(${th('subGridUnit')} * 2);
`
const TooltipRow = styled.div`
diff --git a/packages/component-manuscript/src/molecules/index.js b/packages/component-manuscript/src/molecules/index.js
new file mode 100644
index 000000000..0796d9ef6
--- /dev/null
+++ b/packages/component-manuscript/src/molecules/index.js
@@ -0,0 +1,3 @@
+export { default as Tabs } from './Tabs'
+export { default as Expandable } from './Expandable'
+export { default as AuthorsWithTooltip } from './AuthorsWithTooltip'
--
GitLab