From 76c3609a113bb35139577c17f5490419edd7654d Mon Sep 17 00:00:00 2001
From: Alexandru Munteanu <alexandru.munt@gmail.com>
Date: Thu, 7 Jun 2018 17:52:15 +0300
Subject: [PATCH] fix(ui): fix ui after testing session
---
.../src/components/ManuscriptHeader.js | 7 ++-
.../src/components/ReviewerReportForm.js | 55 +++++++++----------
.../src/components/withModal.js | 5 +-
.../src/components/Dashboard/AssignHEModal.js | 10 +++-
.../Dashboard/HandlingEditorActions.js | 12 ++--
.../components/Dashboard/ReviewerDecision.js | 2 +
.../components/MakeDecision/DecisionForm.js | 6 +-
.../src/components/Reviewers/ReviewerForm.js | 1 +
.../Reviewers/ReviewersDetailsList.js | 8 ++-
.../components-faraday/src/redux/editors.js | 2 +-
.../src/redux/recommendations.js | 13 +++--
11 files changed, 71 insertions(+), 50 deletions(-)
diff --git a/packages/component-manuscript/src/components/ManuscriptHeader.js b/packages/component-manuscript/src/components/ManuscriptHeader.js
index caa38eb70..197352213 100644
--- a/packages/component-manuscript/src/components/ManuscriptHeader.js
+++ b/packages/component-manuscript/src/components/ManuscriptHeader.js
@@ -30,10 +30,13 @@ const ManuscriptDetails = ({ version, project, journal }) => {
<Row>
<LeftDetails flex={3}>
<StatusLabel>{mapStatusToLabel(project)}</StatusLabel>
- <DateParser timestamp={get(version, 'submitted')}>
+ <DateParser
+ durationThreshold={0}
+ timestamp={get(version, 'submitted')}
+ >
{(timestamp, days) => (
<DateField>
- {timestamp} ({days})
+ {timestamp} ({days} ago)
</DateField>
)}
</DateParser>
diff --git a/packages/component-manuscript/src/components/ReviewerReportForm.js b/packages/component-manuscript/src/components/ReviewerReportForm.js
index 649d41190..d61e01938 100644
--- a/packages/component-manuscript/src/components/ReviewerReportForm.js
+++ b/packages/component-manuscript/src/components/ReviewerReportForm.js
@@ -34,12 +34,11 @@ import {
FilePicker,
} from 'pubsweet-components-faraday/src/components/Files'
-import { FormItems } from 'pubsweet-components-faraday/src/components/UIComponents'
-
import {
withModal,
ConfirmationModal,
} from 'pubsweet-component-modal/src/components'
+
import {
selectError,
selectFetching,
@@ -53,7 +52,6 @@ import {
parseReviewResponseToForm,
} from './utils'
-const { CustomValidatedField } = FormItems
const guidelinesLink =
'https://about.hindawi.com/authors/peer-review-at-hindawi/'
@@ -97,6 +95,7 @@ const ReviewerReportForm = ({
/>
</Row>
<Spacing />
+ <Spacing />
<Row left>
<Label>Report</Label>
{!fileFetching.review ? (
@@ -116,30 +115,32 @@ const ReviewerReportForm = ({
</Row>
<Row>
<FullWidth>
- <CustomValidatedField>
- <ValidatedField
- component={TextAreaField}
- name="public"
- validate={isEmpty(formValues.files) ? [required] : []}
- />
- </CustomValidatedField>
+ <ValidatedField
+ component={TextAreaField}
+ name="public"
+ validate={isEmpty(formValues.files) ? [required] : []}
+ />
</FullWidth>
</Row>
{formValues.files && (
- <Row left>
- {formValues.files.map(file => (
- <FileItem
- compact
- id={file.id}
- key={file.id}
- {...file}
- removeFile={removeFile}
- />
- ))}
- </Row>
+ <Fragment>
+ <Spacing />
+ <Row left>
+ {formValues.files.map(file => (
+ <FileItem
+ compact
+ id={file.id}
+ key={file.id}
+ {...file}
+ removeFile={removeFile}
+ />
+ ))}
+ </Row>
+ </Fragment>
)}
{formValues.hasConfidential ? (
<Fragment>
+ <Spacing />
<Row>
<Label>
Note for the editorial team <i>Not shared with the author</i>
@@ -153,13 +154,11 @@ const ReviewerReportForm = ({
</Row>
<Row>
<FullWidth>
- <CustomValidatedField>
- <ValidatedField
- component={TextAreaField}
- name="confidential"
- validate={[required]}
- />
- </CustomValidatedField>
+ <ValidatedField
+ component={TextAreaField}
+ name="confidential"
+ validate={[required]}
+ />
</FullWidth>
</Row>
</Fragment>
diff --git a/packages/component-modal/src/components/withModal.js b/packages/component-modal/src/components/withModal.js
index 18f16ebcb..35bb92362 100644
--- a/packages/component-modal/src/components/withModal.js
+++ b/packages/component-modal/src/components/withModal.js
@@ -23,12 +23,13 @@ const withModal = mapperFn => BaseComponent =>
compose(connect(mapState, mapDispatch))(baseProps => {
const { modalComponent: Component, overlayColor } = mapperFn(baseProps)
const {
+ modalKey,
+ showModal,
hideModal,
modalProps,
modalError,
+ setModalError,
modalsVisibility,
- modalKey,
- showModal,
...rest
} = baseProps
return (
diff --git a/packages/components-faraday/src/components/Dashboard/AssignHEModal.js b/packages/components-faraday/src/components/Dashboard/AssignHEModal.js
index eb201ac3b..31422da54 100644
--- a/packages/components-faraday/src/components/Dashboard/AssignHEModal.js
+++ b/packages/components-faraday/src/components/Dashboard/AssignHEModal.js
@@ -6,7 +6,7 @@ import { compose } from 'recompose'
import { connect } from 'react-redux'
import styled from 'styled-components'
import { actions } from 'pubsweet-client'
-import { th, Icon, Spinner } from '@pubsweet/ui'
+import { th, Icon, ErrorText, Spinner } from '@pubsweet/ui'
import {
selectFetching,
@@ -61,7 +61,7 @@ class AssignHEModal extends React.Component {
render() {
const { searchInput } = this.state
- const { editors, hideModal, isFetching } = this.props
+ const { editors, hideModal, isFetching, modalError } = this.props
const filteredEditors = this.filterEditors(editors)
return (
<RootModal>
@@ -105,6 +105,7 @@ class AssignHEModal extends React.Component {
))}
</ModalContent>
</ScrollContainer>
+ <CustomError>{modalError}</CustomError>
</RootModal>
)
}
@@ -125,6 +126,11 @@ export default compose(
)(AssignHEModal)
// #region styled-components
+const CustomError = ErrorText.extend`
+ font-family: ${th('fontReading')};
+ margin: ${th('subGridUnit')} 0;
+`
+
const SubtitleRow = styled.div`
display: flex;
justify-content: space-between;
diff --git a/packages/components-faraday/src/components/Dashboard/HandlingEditorActions.js b/packages/components-faraday/src/components/Dashboard/HandlingEditorActions.js
index 82907e31d..380e50fc3 100644
--- a/packages/components-faraday/src/components/Dashboard/HandlingEditorActions.js
+++ b/packages/components-faraday/src/components/Dashboard/HandlingEditorActions.js
@@ -28,10 +28,10 @@ const DeclineModal = compose(
value={reason}
/>
<div data-test="he-buttons">
- <Button onClick={hideModal}>Cancel</Button>
- <Button onClick={onConfirm(reason)} primary>
+ <DecisionButton onClick={hideModal}>Cancel</DecisionButton>
+ <DecisionButton onClick={onConfirm(reason)} primary>
Decline
- </Button>
+ </DecisionButton>
</div>
</DeclineRoot>
))
@@ -119,6 +119,8 @@ const DecisionButton = styled(Button)`
background-color: ${({ primary }) =>
primary ? th('colorPrimary') : th('backgroundColorReverse')};
height: calc(${th('subGridUnit')} * 5);
+ margin-left: ${th('gridUnit')};
+ padding: 0;
text-align: center;
`
@@ -158,7 +160,5 @@ const DeclineRoot = styled.div`
}
`
-const Root = styled.div`
- margin-left: ${th('gridUnit')};
-`
+const Root = styled.div``
// #endregion
diff --git a/packages/components-faraday/src/components/Dashboard/ReviewerDecision.js b/packages/components-faraday/src/components/Dashboard/ReviewerDecision.js
index 6dece3361..7037dbebf 100644
--- a/packages/components-faraday/src/components/Dashboard/ReviewerDecision.js
+++ b/packages/components-faraday/src/components/Dashboard/ReviewerDecision.js
@@ -97,6 +97,8 @@ const DecisionButton = styled(Button)`
color: ${({ primary }) =>
primary ? th('colorTextReverse') : th('colorPrimary')});
height: calc(${th('subGridUnit')} * 5);
+ margin-left: ${th('gridUnit')};
+ padding: 0;
text-align: center;
`
// #endregion
diff --git a/packages/components-faraday/src/components/MakeDecision/DecisionForm.js b/packages/components-faraday/src/components/MakeDecision/DecisionForm.js
index ad282d0f6..3e0d89583 100644
--- a/packages/components-faraday/src/components/MakeDecision/DecisionForm.js
+++ b/packages/components-faraday/src/components/MakeDecision/DecisionForm.js
@@ -142,6 +142,7 @@ export default compose(
dispatch,
{
showModal,
+ hideModal,
fragmentId,
collectionId,
getCollections,
@@ -150,8 +151,11 @@ export default compose(
) => {
const recommendation = parseFormValues(values)
createRecommendation(collectionId, fragmentId, recommendation).then(r => {
- getCollections()
showModal({
+ onCancel: () => {
+ getCollections()
+ hideModal()
+ },
title: 'Decision submitted',
cancelText: 'OK',
})
diff --git a/packages/components-faraday/src/components/Reviewers/ReviewerForm.js b/packages/components-faraday/src/components/Reviewers/ReviewerForm.js
index 465ed9dcb..0a26dbfc5 100644
--- a/packages/components-faraday/src/components/Reviewers/ReviewerForm.js
+++ b/packages/components-faraday/src/components/Reviewers/ReviewerForm.js
@@ -96,6 +96,7 @@ export default compose(
const FormButton = styled(Button)`
height: calc(${th('subGridUnit')} * 5);
margin: ${th('subGridUnit')};
+ padding: 0;
`
const Err = styled.span`
diff --git a/packages/components-faraday/src/components/Reviewers/ReviewersDetailsList.js b/packages/components-faraday/src/components/Reviewers/ReviewersDetailsList.js
index b9cb3ea8d..b24ca0035 100644
--- a/packages/components-faraday/src/components/Reviewers/ReviewersDetailsList.js
+++ b/packages/components-faraday/src/components/Reviewers/ReviewersDetailsList.js
@@ -54,9 +54,11 @@ const TR = ({
<StatusText>
{`${r.status === 'accepted' ? 'Agreed' : r.status}`}
</StatusText>
- <DateParser timestamp={r.respondedOn}>
- {timestamp => <DateText>{`: ${timestamp}`}</DateText>}
- </DateParser>
+ {r.respondedOn && (
+ <DateParser timestamp={r.respondedOn}>
+ {timestamp => <DateText>{`: ${timestamp}`}</DateText>}
+ </DateParser>
+ )}
</td>
<DateParser timestamp={submittedOn}>
{timestamp => <td>{timestamp}</td>}
diff --git a/packages/components-faraday/src/redux/editors.js b/packages/components-faraday/src/redux/editors.js
index 63cb3b837..34f1423cc 100644
--- a/packages/components-faraday/src/redux/editors.js
+++ b/packages/components-faraday/src/redux/editors.js
@@ -38,7 +38,7 @@ export const assignHandlingEditor = (email, collectionId) => dispatch => {
},
err => {
dispatch(editorsDone())
- return err
+ throw err
},
)
}
diff --git a/packages/components-faraday/src/redux/recommendations.js b/packages/components-faraday/src/redux/recommendations.js
index a85e13f8c..3314f901d 100644
--- a/packages/components-faraday/src/redux/recommendations.js
+++ b/packages/components-faraday/src/redux/recommendations.js
@@ -21,9 +21,9 @@ export const recommendationsError = error => ({
error,
})
-export const getRecommendationsSuccess = recommendations => ({
+export const getRecommendationsSuccess = recommendation => ({
type: GET_RECOMMENDATIONS_SUCCESS,
- payload: { recommendations },
+ payload: { recommendation },
})
export const createRecommendationSuccess = recommendation => ({
@@ -61,7 +61,7 @@ export const createRecommendation = (
recommendation,
).then(
r => {
- dispatch(getRecommendationsSuccess([r]))
+ dispatch(getRecommendationsSuccess(r))
return r
},
err => {
@@ -88,7 +88,7 @@ export const updateRecommendation = (
recommendation,
).then(
r => {
- dispatch(getRecommendationsSuccess([r]))
+ dispatch(getRecommendationsSuccess(r))
return r
},
err => {
@@ -97,6 +97,7 @@ export const updateRecommendation = (
const errorMessage = get(JSON.parse(error), 'error')
dispatch(recommendationsError(errorMessage))
}
+ throw err
},
)
}
@@ -134,7 +135,9 @@ export default (state = initialState, action = {}) => {
...state,
fetching: false,
error: null,
- recommendations: action.payload.recommendations,
+ recommendations: state.recommendations
+ ? [...state.recommendations, action.payload.recommendation]
+ : action.payload.recommendation,
}
case UPDATE_RECOMMENDATION_SUCCESS:
case CREATE_RECOMMENDATION_SUCCESS:
--
GitLab