diff --git a/packages/component-faraday-ui/src/ReviewerReport.js b/packages/component-faraday-ui/src/ReviewerReport.js
index 401f3818edffd6781810f1e5f2e7c3456d984f32..212ded253217b36bc07f1dda42ba9998adf6c14d 100644
--- a/packages/component-faraday-ui/src/ReviewerReport.js
+++ b/packages/component-faraday-ui/src/ReviewerReport.js
@@ -1,4 +1,6 @@
-import React from 'react'
+import React, { Fragment } from 'react'
+import { get } from 'lodash'
+import { withProps } from 'recompose'
import styled from 'styled-components'
import { th } from '@pubsweet/ui-toolkit'
import { DateParser } from '@pubsweet/ui'
@@ -6,14 +8,14 @@ import { DateParser } from '@pubsweet/ui'
import { Label, Item, FileItem, Row, Text } from './'
const ReviewerReport = ({
- report: {
- report,
- files = [],
- submittedOn,
- recommendation,
- confidentialNote,
- reviewer: { fullName, reviewerNumber },
- },
+ onPreview,
+ onDownload,
+ reportFile,
+ publicReport,
+ privateReport,
+ recommendation,
+ showOwner = false,
+ report: { submittedOn },
}) => (
<Root>
<Row justify="space-between" mb={2}>
@@ -23,42 +25,64 @@ const ReviewerReport = ({
</Item>
<Item justify="flex-end">
- <Text>{fullName}</Text>
- <Text customId ml={1} mr={1}>
- {`Reviewer ${reviewerNumber}`}
- </Text>
+ {showOwner && (
+ <Fragment>
+ <Text>Reviewer name</Text>
+ <Text customId ml={1} mr={1}>
+ {`Reviewer ${1}`}
+ </Text>
+ </Fragment>
+ )}
<DateParser timestamp={submittedOn}>
{date => <Text>{date}</Text>}
</DateParser>
</Item>
</Row>
- <Row mb={2}>
- <Item vertical>
- <Label mb={1 / 2}>Report</Label>
- <Text>{report}</Text>
- </Item>
- </Row>
-
- <Label mb={1 / 2}>Files</Label>
- <Row justify="flex-start" mb={2}>
- {files.map(file => (
- <Item flex={0} key={file.id} mr={1}>
- <FileItem item={file} />
+ {publicReport && (
+ <Row mb={2}>
+ <Item vertical>
+ <Label mb={1 / 2}>Report</Label>
+ <Text>{publicReport}</Text>
</Item>
- ))}
- </Row>
+ </Row>
+ )}
- <Row mb={2}>
- <Item vertical>
- <Label mb={1 / 2}>Confidential note for the Editorial Team</Label>
- <Text>{confidentialNote}</Text>
- </Item>
- </Row>
+ {reportFile && (
+ <Fragment>
+ <Label mb={1 / 2}>Report file</Label>
+ <Row justify="flex-start" mb={2}>
+ <Item flex={0} mr={1}>
+ <FileItem
+ item={reportFile}
+ onDownload={onDownload}
+ onPreview={onPreview}
+ />
+ </Item>
+ </Row>
+ </Fragment>
+ )}
+
+ {privateReport && (
+ <Row mb={2}>
+ <Item vertical>
+ <Label mb={1 / 2}>Confidential note for the Editorial Team</Label>
+ <Text>{privateReport}</Text>
+ </Item>
+ </Row>
+ )}
</Root>
)
-export default ReviewerReport
+export default withProps(({ report, journal: { recommendations = [] } }) => ({
+ recommendation: get(
+ recommendations.find(r => r.value === report.recommendation),
+ 'label',
+ ),
+ reportFile: get(report, 'comments.0.files.0'),
+ publicReport: get(report, 'comments.0.content'),
+ privateReport: get(report, 'comments.1.content'),
+}))(ReviewerReport)
// #region styles
const Root = styled.div`
diff --git a/packages/component-faraday-ui/src/ReviewerReport.md b/packages/component-faraday-ui/src/ReviewerReport.md
index e16f2bc1a28bc427029e6c9388d8f8288f031112..927701f99f9d8375c2e4115050706be80e313270 100644
--- a/packages/component-faraday-ui/src/ReviewerReport.md
+++ b/packages/component-faraday-ui/src/ReviewerReport.md
@@ -1,26 +1,61 @@
Reviewer report.
```js
-<ReviewerReport
- report={{
- submittedOn: Date.now(),
- recommendation: 'Reject',
- report: `Of all of the celestial bodies that capture our attention and
- fascination as astronomers, none has a greater influence on life on
- planet Earth than it’s own satellite, the moon. When you think about
- it, we regard the moon with such powerful significance that unlike the
- moons of other planets which we give names, we only refer to our one
- and only orbiting orb as THE moon. It is not a moon. To us, it is the
- one and only moon.`,
- reviewer: {
- fullName: 'Kenny Hudson',
- reviewerNumber: 1,
+const report = {
+ id: '71effdc0-ccb1-4ea9-9422-dcc9f8713347',
+ userId: '9ac5b5b5-252c-4933-9e66-72ec7c644a5c',
+ comments: [
+ {
+ files: [
+ {
+ id:
+ '5c0a233b-2569-443b-8110-ef98a18a60a4/2cac524e-0259-45fb-ad3c-9ebc94af8acc',
+ name: '1508309142.png',
+ size: 35249,
+ originalName: '1508309142.png',
+ },
+ ],
+ public: true,
+ content: 'Arata foarte bine',
},
- confidentialNote: `First 10 pages feel very familiar, you should check for plagarism.`,
- files: [
- { id: 'file1', name: 'file1.pdf', size: 12356 },
- { id: 'file2', name: 'file2.pdf', size: 76421 },
- ],
- }}
+ {
+ files: [],
+ public: false,
+ content: 'o da bine baiatul',
+ },
+ ],
+ createdOn: 1538053564396,
+ updatedOn: 1538053600643,
+ submittedOn: 1538053600624,
+ recommendation: 'publish',
+ recommendationType: 'review',
+}
+
+const journal = {
+ recommendations: [
+ {
+ value: 'publish',
+ label: 'Publish unaltered',
+ },
+ {
+ value: 'major',
+ label: 'Consider after major revision',
+ },
+ {
+ value: 'minor',
+ label: 'Consider after minor revision',
+ },
+ {
+ value: 'reject',
+ label: 'Reject',
+ },
+ ],
+}
+
+;<ReviewerReport
+ journal={journal}
+ report={report}
+ showOwner
+ onPreview={file => console.log('preview file', file)}
/>
```
diff --git a/packages/component-manuscript/src/components/ManuscriptLayout.js b/packages/component-manuscript/src/components/ManuscriptLayout.js
index fb73c967cf33e4da9d7116f3f97a9bbde938c034..a33f986d60e6d92505444b1aa0fecaa748a3fdf6 100644
--- a/packages/component-manuscript/src/components/ManuscriptLayout.js
+++ b/packages/component-manuscript/src/components/ManuscriptLayout.js
@@ -13,6 +13,7 @@ import {
paddingHelper,
} from 'pubsweet-component-faraday-ui'
+import ReviewerReportCard from './ReviewReportCard'
import ReviewerReportForm from './ReviewerReportForm'
const eicDecisions = [
@@ -60,6 +61,7 @@ const ManuscriptLayout = ({
reviewerRecommendationExpanded,
//
shouldReview,
+ submittedOwnRecommendation,
}) => (
<Root pb={1}>
{!isEmpty(collection) && !isEmpty(fragment) ? (
@@ -91,6 +93,15 @@ const ManuscriptLayout = ({
getSignedUrl={getSignedUrl}
/>
+ {submittedOwnRecommendation && (
+ <ReviewerReportCard
+ getSignedUrl={getSignedUrl}
+ journal={journal}
+ report={submittedOwnRecommendation}
+ token={get(currentUser, 'token')}
+ />
+ )}
+
{shouldReview && (
<ReviewerReportForm
changeForm={changeForm}
diff --git a/packages/component-manuscript/src/components/ReviewReportCard.js b/packages/component-manuscript/src/components/ReviewReportCard.js
index 0ea6fdb252d3fc855f364bbe13547ee3f4be5669..35ca28d568e24848ec5e22eb4a91ba6a8f520e8c 100644
--- a/packages/component-manuscript/src/components/ReviewReportCard.js
+++ b/packages/component-manuscript/src/components/ReviewReportCard.js
@@ -1,151 +1,20 @@
-import React, { Fragment } from 'react'
-import { compose } from 'recompose'
-import { get, isEmpty } from 'lodash'
-import { th } from '@pubsweet/ui-toolkit'
-import { withJournal } from 'xpub-journal'
-import styled, { css } from 'styled-components'
-import { DateParser } from 'pubsweet-components-faraday/src/components'
-
-import { ShowMore } from './'
-
-const ReviewReportCard = ({
- i = 0,
- report = {},
- showBorder = false,
- journal: { recommendations },
-}) => {
- const hasReviewer = !isEmpty(get(report, 'user'))
- const { submittedOn, comments = [], user } = report
- const publicComment = comments.find(c => c.public)
- const privateComment = comments.find(c => !c.public)
- const recommendationLabel = get(
- recommendations.find(r => report.recommendation === r.value),
- 'label',
- )
-
- return (
- <Root showBorder={showBorder}>
- {hasReviewer && (
- <Row>
- <Text>
- <b>Reviewer {i}</b>
- <Underline>{user.name}</Underline>
- <span>{user.email}</span>
- </Text>
- <DateParser timestamp={submittedOn}>
- {timestamp => <Text>{timestamp}</Text>}
- </DateParser>
- </Row>
- )}
- <Row>
- <Label>Recommendation</Label>
- {!hasReviewer && (
- <DateParser timestamp={submittedOn}>
- {timestamp => <Text>{timestamp}</Text>}
- </DateParser>
- )}
- </Row>
- <Row>
- <Text>{recommendationLabel}</Text>
- </Row>
- {get(publicComment, 'content') && (
- <Fragment>
- <Spacing />
- <Row left>
- <Label>Report Text</Label>
- </Row>
- <Row>
- <ShowMore
- content={publicComment.content}
- id={`public-content-${i}`}
- />
- </Row>
- </Fragment>
- )}
-
- {get(publicComment, 'files') &&
- !!publicComment.files.length && (
- <Fragment>
- <Spacing />
- <Row left>
- <Label>Files</Label>
- </Row>
- </Fragment>
- )}
-
- {get(privateComment, 'content') && (
- <Fragment>
- <Spacing />
- <Row left>
- <Label>Confidential Note</Label>
- </Row>
- <Row>
- <ShowMore
- content={privateComment.content}
- id={`private-content-${i}`}
- />
- </Row>
- </Fragment>
- )}
- </Root>
- )
-}
-
-export default compose(withJournal)(ReviewReportCard)
-
-// #region styled-components
-const defaultText = css`
- color: ${th('colorPrimary')};
- font-family: ${th('fontReading')};
- font-size: ${th('fontSizeBaseSmall')};
-`
-
-const cardStyle = css`
- margin: 0 auto calc(${th('subGridUnit')}*3);
- border: ${th('borderDefault')};
- padding: calc(${th('subGridUnit')}*2);
-`
-
-const Root = styled.div`
- display: flex;
- flex-direction: column;
- margin: auto;
- border: none;
- padding: 0;
- ${({ showBorder }) => (showBorder ? cardStyle : null)};
-`
-const Text = styled.div`
- ${defaultText};
- span {
- margin-left: calc(${th('subGridUnit')}*3);
- }
-`
-const Underline = styled.span`
- text-decoration: underline;
-`
-const Label = styled.div`
- ${defaultText};
- text-transform: uppercase;
- i {
- text-transform: none;
- margin-left: ${th('gridUnit')};
- }
-`
-
-const Spacing = styled.div`
- margin-top: ${th('gridUnit')};
- flex: 1;
-`
-
-const Row = styled.div`
- 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};
-`
-
-// #endregion
+import React from 'react'
+import {
+ ReviewerReport,
+ ContextualBox,
+ withFilePreview,
+ withFileDownload,
+} from 'pubsweet-component-faraday-ui'
+
+const ReviewReportCard = ({ journal, report, previewFile, downloadFile }) => (
+ <ContextualBox label="Your report" mb={2} startExpanded>
+ <ReviewerReport
+ journal={journal}
+ onDownload={downloadFile}
+ onPreview={previewFile}
+ report={report}
+ />
+ </ContextualBox>
+)
+
+export default withFileDownload(withFilePreview(ReviewReportCard))
diff --git a/packages/component-manuscript/src/components/ReviewReportCard.old.js b/packages/component-manuscript/src/components/ReviewReportCard.old.js
new file mode 100644
index 0000000000000000000000000000000000000000..3262f640303f162ceed9a07a211122b248d21c0a
--- /dev/null
+++ b/packages/component-manuscript/src/components/ReviewReportCard.old.js
@@ -0,0 +1,151 @@
+import React, { Fragment } from 'react'
+import { compose } from 'recompose'
+import { get, isEmpty } from 'lodash'
+import { th } from '@pubsweet/ui-toolkit'
+import { withJournal } from 'xpub-journal'
+import styled, { css } from 'styled-components'
+import { DateParser } from 'pubsweet-components-faraday/src/components'
+
+import { ShowMore } from '.'
+
+const ReviewReportCard = ({
+ i = 0,
+ report = {},
+ showBorder = false,
+ journal: { recommendations },
+}) => {
+ const hasReviewer = !isEmpty(get(report, 'user'))
+ const { submittedOn, comments = [], user } = report
+ const publicComment = comments.find(c => c.public)
+ const privateComment = comments.find(c => !c.public)
+ const recommendationLabel = get(
+ recommendations.find(r => report.recommendation === r.value),
+ 'label',
+ )
+
+ return (
+ <Root showBorder={showBorder}>
+ {hasReviewer && (
+ <Row>
+ <Text>
+ <b>Reviewer {i}</b>
+ <Underline>{user.name}</Underline>
+ <span>{user.email}</span>
+ </Text>
+ <DateParser timestamp={submittedOn}>
+ {timestamp => <Text>{timestamp}</Text>}
+ </DateParser>
+ </Row>
+ )}
+ <Row>
+ <Label>Recommendation</Label>
+ {!hasReviewer && (
+ <DateParser timestamp={submittedOn}>
+ {timestamp => <Text>{timestamp}</Text>}
+ </DateParser>
+ )}
+ </Row>
+ <Row>
+ <Text>{recommendationLabel}</Text>
+ </Row>
+ {get(publicComment, 'content') && (
+ <Fragment>
+ <Spacing />
+ <Row left>
+ <Label>Report Text</Label>
+ </Row>
+ <Row>
+ <ShowMore
+ content={publicComment.content}
+ id={`public-content-${i}`}
+ />
+ </Row>
+ </Fragment>
+ )}
+
+ {get(publicComment, 'files') &&
+ !!publicComment.files.length && (
+ <Fragment>
+ <Spacing />
+ <Row left>
+ <Label>Files</Label>
+ </Row>
+ </Fragment>
+ )}
+
+ {get(privateComment, 'content') && (
+ <Fragment>
+ <Spacing />
+ <Row left>
+ <Label>Confidential Note</Label>
+ </Row>
+ <Row>
+ <ShowMore
+ content={privateComment.content}
+ id={`private-content-${i}`}
+ />
+ </Row>
+ </Fragment>
+ )}
+ </Root>
+ )
+}
+
+export default compose(withJournal)(ReviewReportCard)
+
+// #region styled-components
+const defaultText = css`
+ color: ${th('colorPrimary')};
+ font-family: ${th('fontReading')};
+ font-size: ${th('fontSizeBaseSmall')};
+`
+
+const cardStyle = css`
+ margin: 0 auto calc(${th('subGridUnit')}*3);
+ border: ${th('borderDefault')};
+ padding: calc(${th('subGridUnit')}*2);
+`
+
+const Root = styled.div`
+ display: flex;
+ flex-direction: column;
+ margin: auto;
+ border: none;
+ padding: 0;
+ ${({ showBorder }) => (showBorder ? cardStyle : null)};
+`
+const Text = styled.div`
+ ${defaultText};
+ span {
+ margin-left: calc(${th('subGridUnit')}*3);
+ }
+`
+const Underline = styled.span`
+ text-decoration: underline;
+`
+const Label = styled.div`
+ ${defaultText};
+ text-transform: uppercase;
+ i {
+ text-transform: none;
+ margin-left: ${th('gridUnit')};
+ }
+`
+
+const Spacing = styled.div`
+ margin-top: ${th('gridUnit')};
+ flex: 1;
+`
+
+const Row = styled.div`
+ 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};
+`
+
+// #endregion