Skip to content
Snippets Groups Projects
Commit 5ed40d74 authored by Jure's avatar Jure
Browse files

feat: bring chat and manuscript content view to decision and submit component

parent 109055a9
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 175 additions and 151 deletions
app/components/component-review/src/components/DecisionPage.js
+ 20
− 7
View file @ 5ed40d74
......@@ -2,9 +2,14 @@ import React from 'react'
import { useQuery } from '@apollo/client'
import DecisionVersion from './DecisionVersion'
import { Columns, Manuscript, Chat } from './style'
import { Spinner, VersionSwitcher, ErrorBoundary } from '../../../shared'
import {
Spinner,
VersionSwitcher,
ErrorBoundary,
Columns,
Manuscript,
Chat,
} from '../../../shared'
import gatherManuscriptVersions from '../../../../shared/manuscript_versions'
......@@ -27,11 +32,18 @@ const DecisionPage = ({ match }) => {
const versions = gatherManuscriptVersions(manuscript)
// Protect if channels don't exist for whatever reason
let channelId
let editorialChannelId, allChannelId
if (Array.isArray(manuscript.channels) && manuscript.channels.length) {
channelId = manuscript.channels.find(c => c.type === 'editorial').id
editorialChannelId = manuscript.channels.find(c => c.type === 'editorial')
.id
allChannelId = manuscript.channels.find(c => c.type === 'all').id
}
const channels = [
{ id: allChannelId, name: 'Discussion with author' },
{ id: editorialChannelId, name: 'Editorial discussion' },
]
return (
<Columns>
<Manuscript>
......@@ -49,8 +61,9 @@ const DecisionPage = ({ match }) => {
</VersionSwitcher>
</ErrorBoundary>
</Manuscript>
<Chat>{channelId && <MessageContainer channelId={channelId} />}</Chat>
<Chat>
<MessageContainer channels={channels} />
</Chat>
</Columns>
)
}
......
app/components/component-review/src/components/Publish.js
+ 4
− 3
View file @ 5ed40d74
......@@ -4,7 +4,6 @@ import { Button } from '@pubsweet/ui'
import { publishManuscriptMutation } from './queries'
import {
Container,
Title,
SectionHeader,
SectionRowGrid,
......@@ -12,6 +11,8 @@ import {
SectionAction,
} from './style'
import { SectionContent } from '../../../shared'
const Publish = ({ manuscript }) => {
// Hooks from the old world
const [publishManuscript] = useMutation(publishManuscriptMutation)
......@@ -19,7 +20,7 @@ const Publish = ({ manuscript }) => {
const notAccepted = manuscript.status !== 'accepted'
return (
<Container>
<SectionContent>
<SectionHeader>
<Title>Publishing</Title>
</SectionHeader>
......@@ -47,7 +48,7 @@ const Publish = ({ manuscript }) => {
</Button>
</SectionAction>
</SectionRowGrid>
</Container>
</SectionContent>
)
}
......
app/components/component-review/src/components/assignEditors/AssignEditorsReviewers.js
+ 4
− 3
View file @ 5ed40d74
import React from 'react'
import { Container, SectionHeader, SectionRowGrid, Title } from '../style'
import { SectionHeader, SectionRowGrid, Title } from '../style'
import { SectionContent } from '../../../../shared'
const AssignEditorsReviewers = ({ manuscript, AssignEditor }) => (
<Container flatTop>
<SectionContent noGap>
<SectionHeader>
<Title>Assign Editors</Title>
</SectionHeader>
......@@ -10,6 +11,6 @@ const AssignEditorsReviewers = ({ manuscript, AssignEditor }) => (
<AssignEditor manuscript={manuscript} teamRole="seniorEditor" />
<AssignEditor manuscript={manuscript} teamRole="handlingEditor" />
</SectionRowGrid>
</Container>
</SectionContent>
)
export default AssignEditorsReviewers
app/components/component-review/src/components/decision/DecisionForm.js
+ 3
− 4
View file @ 5ed40d74
......@@ -11,12 +11,11 @@ import {
} from '@pubsweet/ui'
import { JournalContext } from '../../../../xpub-journal/src'
import { required } from '../../../../xpub-validators/src'
import { FilesUpload } from '../../../../shared'
import { FilesUpload, SectionContent } from '../../../../shared'
import { reviewWithComment } from '../review/util'
import {
Container,
Title,
SectionHeader,
SectionRowGrid,
......@@ -145,7 +144,7 @@ const DecisionForm = ({
}
return (
<Container>
<SectionContent>
<form onSubmit={handleSubmit}>
<SectionHeader>
<Title>Decision</Title>
......@@ -172,7 +171,7 @@ const DecisionForm = ({
</SectionAction>
</SectionRowGrid>
</form>
</Container>
</SectionContent>
)
}
......
app/components/component-review/src/components/decision/DecisionReviews.js
+ 4
− 4
View file @ 5ed40d74
import React from 'react'
import { Action } from '@pubsweet/ui'
import DecisionReview from './DecisionReview'
import { Container, SectionHeader, SectionRow, Title } from '../style'
import { SectionHeader, SectionRow, Title } from '../style'
import { SectionContent } from '../../../../shared'
// TODO: read reviewer ordinal and name from project reviewer
// const { status } =
// getUserFromTeam(manuscript, 'reviewer').filter(
......@@ -20,7 +20,7 @@ const getCompletedReviews = (manuscript, currentUser) => {
}
const DecisionReviews = ({ manuscript }) => (
<Container>
<SectionContent>
<SectionHeader>
<Title>Reviews</Title>
</SectionHeader>
......@@ -51,7 +51,7 @@ const DecisionReviews = ({ manuscript }) => (
Manage Reviewers
</Action>
</SectionRow>
</Container>
</SectionContent>
)
export default DecisionReviews
app/components/component-review/src/components/metadata/ReviewMetadata.js
+ 4
− 3
View file @ 5ed40d74
......@@ -6,7 +6,8 @@ import { Attachment } from '@pubsweet/ui'
import form from '../../../../../storage/forms/submit.json'
import { Container, Title, SectionHeader, SectionRowGrid } from '../style'
import { Title, SectionHeader, SectionRowGrid } from '../style'
import { SectionContent } from '../../../../shared'
const Heading = styled.span`
font-weight: inherit;
......@@ -78,7 +79,7 @@ const ReviewMetadata = ({ manuscript: rawManuscript }) => {
)
return (
<Container>
<SectionContent>
<SectionHeader>
<Title>Metadata</Title>
</SectionHeader>
......@@ -118,7 +119,7 @@ const ReviewMetadata = ({ manuscript: rawManuscript }) => {
)}
</SectionRowGrid>
)}
</Container>
</SectionContent>
)
}
......
app/components/component-review/src/components/style.js
+ 13
− 38
View file @ 5ed40d74
import styled, { css } from 'styled-components'
import { th, grid } from '@pubsweet/ui-toolkit'
export const Columns = styled.div`
display: grid;
// grid-column-gap: 2em;
grid-template-areas: 'manuscript chat';
grid-template-columns: 3fr 2fr;
justify-content: center;
overflow: hidden;
height: 100vh;
`
export const Manuscript = styled.div`
grid-area: manuscript;
overflow-y: scroll;
background: ${th('colorBackgroundHue')};
padding: ${grid(2)};
`
export const Chat = styled.div`
border-left: 1px solid ${th('colorFurniture')};
grid-area: chat;
height: 100vh;
// overflow-y: scroll;
display: flex;
`
export const AdminSection = styled.div`
margin-bottom: calc(${th('gridUnit')} * 3);
`
......@@ -66,19 +41,19 @@ export const EditorWrapper = styled.div`
}
`
export const Container = styled.div`
// max-width: 90rem;
box-shadow: ${th('boxShadow')};
background-color: ${th('colorBackground')};
border-radius: ${({ flatTop }) =>
flatTop
? css`0 ${th('borderRadius')} ${th('borderRadius')}`
: th('borderRadius')};
// padding: ${grid(2)} ${grid(3)};
&:not(:first-of-type) {
margin-top: ${grid(4)};
}
`
// export const Container = styled.div`
// // max-width: 90rem;
// box-shadow: ${th('boxShadow')};
// background-color: ${th('colorBackground')};
// border-radius: ${({ noGap }) =>
// noGap
// ? css`0 ${th('borderRadius')} ${th('borderRadius')}`
// : th('borderRadius')};
// // padding: ${grid(2)} ${grid(3)};
// &:not(:first-of-type) {
// margin-top: ${grid(4)};
// }
// `
export const FormStatus = styled.div`
line-height: ${grid(5)};
......
app/components/component-submit/src/components/CreateANewVersion.js
+ 61
− 61
View file @ 5ed40d74
......@@ -14,70 +14,70 @@ import {
HeadingWithAction,
} from '../../../shared'
const CreateANewVersion = ({ manuscript, currentVersion, createNewVersion }) =>
currentVersion && manuscript.status === 'revise' ? (
<>
<SectionContent>
<SectionHeader>
<Title>Create a new version</Title>
</SectionHeader>
<SectionRow>
<HeadingWithAction>
<p>
You have been asked to <strong>revise</strong> your manuscript and
the corresponding reviews and decision are available below. You
can create a new version of your manuscript and resubmit it.
</p>
<Button
onClick={() =>
createNewVersion({
variables: { id: manuscript.id },
update: (cache, { data: { createNewVersion } }) => {
// Always modify the main/original/parent manuscript
const parentId = manuscript.parentId || manuscript.id
cache.modify({
id: cache.identify({
id: parentId,
__typename: 'Manuscript',
}),
fields: {
manuscriptVersions(
existingVersionRefs = [],
{ readField },
) {
const newVersionRef = cache.writeFragment({
data: createNewVersion,
fragment: gql`
fragment NewManuscriptVersion on Manuscript {
id
}
`,
})
if (
existingVersionRefs.some(
ref =>
readField('id', ref) === createNewVersion.id,
)
) {
return existingVersionRefs
const CreateANewVersion = ({
manuscript,
currentVersion,
createNewVersion,
}) => (
<SectionContent noGap>
<SectionHeader>
<Title>Create a new version</Title>
</SectionHeader>
<SectionRow>
<HeadingWithAction>
<p>
You have been asked to <strong>revise</strong> your manuscript and the
corresponding reviews and decision are available below. You can create
a new version of your manuscript and resubmit it.
</p>
<Button
onClick={() =>
createNewVersion({
variables: { id: manuscript.id },
update: (cache, { data: { createNewVersion } }) => {
// Always modify the main/original/parent manuscript
const parentId = manuscript.parentId || manuscript.id
cache.modify({
id: cache.identify({
id: parentId,
__typename: 'Manuscript',
}),
fields: {
manuscriptVersions(
existingVersionRefs = [],
{ readField },
) {
const newVersionRef = cache.writeFragment({
data: createNewVersion,
fragment: gql`
fragment NewManuscriptVersion on Manuscript {
id
}
`,
})
if (
existingVersionRefs.some(
ref => readField('id', ref) === createNewVersion.id,
)
) {
return existingVersionRefs
}
return [newVersionRef, ...existingVersionRefs]
},
},
})
return [newVersionRef, ...existingVersionRefs]
},
},
})
}
primary
>
Create a new version
</Button>
</HeadingWithAction>
</SectionRow>
</SectionContent>
</>
) : null
},
})
}
primary
>
Create a new version
</Button>
</HeadingWithAction>
</SectionRow>
</SectionContent>
)
export default CreateANewVersion
app/components/component-submit/src/components/DecisionAndReviews.js
+ 2
− 2
View file @ 5ed40d74
......@@ -35,7 +35,7 @@ const Decision = ({ decision, editor }) =>
<SectionRow>Pending.</SectionRow>
)
const DecisionAndReviews = ({ manuscript }) => {
const DecisionAndReviews = ({ manuscript, noGap }) => {
const decision =
manuscript.reviews &&
!!manuscript.reviews.length &&
......@@ -48,7 +48,7 @@ const DecisionAndReviews = ({ manuscript }) => {
return (
<>
<SectionContent>
<SectionContent noGap={noGap}>
<SectionHeader>
<Title>Decision</Title>
</SectionHeader>
......
app/components/component-submit/src/components/Submit.js
+ 54
− 26
View file @ 5ed40d74
......@@ -5,21 +5,36 @@ import CurrentVersion from './CurrentVersion'
import DecisionAndReviews from './DecisionAndReviews'
import CreateANewVersion from './CreateANewVersion'
import FormTemplate from './FormTemplate'
import { Container, Content, VersionSwitcher, Tabs } from '../../../shared'
import MessageContainer from '../../../component-chat/src'
import {
Content,
VersionSwitcher,
Tabs,
Columns,
Chat,
Manuscript,
ErrorBoundary,
} from '../../../shared'
// TODO: Improve the import, perhaps a shared component?
import EditorSection from '../../../component-review/src/components/decision/EditorSection'
const SubmittedVersion = ({ manuscript, currentVersion, createNewVersion }) => (
<>
<CreateANewVersion
createNewVersion={createNewVersion}
currentVersion={currentVersion}
manuscript={manuscript}
/>
<DecisionAndReviews manuscript={manuscript} />
<CurrentVersion manuscript={manuscript} />
</>
)
const SubmittedVersion = ({ manuscript, currentVersion, createNewVersion }) => {
const reviseDecision = currentVersion && manuscript.status === 'revise'
return (
<>
{reviseDecision && (
<CreateANewVersion
createNewVersion={createNewVersion}
currentVersion={currentVersion}
manuscript={manuscript}
/>
)}
<DecisionAndReviews manuscript={manuscript} noGap={!reviseDecision} />
<CurrentVersion manuscript={manuscript} />
</>
)
}
const Submit = ({
versions = [],
......@@ -27,6 +42,7 @@ const Submit = ({
createNewVersion,
toggleConfirming,
confirming,
parent,
onChange,
onSubmit,
}) => {
......@@ -105,24 +121,36 @@ const Submit = ({
key: versionId,
label: 'Submitted info',
}
decisionSections.push({
content: (
<Tabs
defaultActiveKey={version.id}
sections={[decisionSection, editorSection]}
/>
),
key: manuscript.id,
label,
})
}
decisionSections.push({
content: (
<Tabs
defaultActiveKey={versionId}
sections={[decisionSection, editorSection]}
/>
),
key: manuscript.id,
label,
})
})
// Protect if channels don't exist for whatever reason
let channelId
if (Array.isArray(parent.channels) && parent.channels.length) {
channelId = parent.channels.find(c => c.type === 'all').id
}
return (
<Container>
<VersionSwitcher versions={decisionSections} />
</Container>
<Columns>
<Manuscript>
<ErrorBoundary>
<VersionSwitcher versions={decisionSections} />
</ErrorBoundary>
</Manuscript>
<Chat>
<MessageContainer channelId={channelId} />
</Chat>
</Columns>
)
}
......
app/components/component-submit/src/components/SubmitPage.js
+ 6
− 0
View file @ 5ed40d74
......@@ -132,6 +132,11 @@ const query = gql`
parentId
${fragmentFields}
}
channels {
id
type
topic
}
}
getFile(form: $form)
......@@ -229,6 +234,7 @@ const SubmitPage = ({ match, history, ...props }) => {
form={cloneDeep(form)}
onChange={handleChange}
onSubmit={onSubmit}
parent={manuscript}
toggleConfirming={toggleConfirming}
versions={versions}
{...props}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment