From 8b93c89a90112970eb7055415fa7e65c6eedd494 Mon Sep 17 00:00:00 2001 From: ahamelers <audrey@ahamelers.com> Date: Sun, 10 Mar 2019 20:02:40 +0000 Subject: [PATCH] #410 manuscript deletion setup --- app/components/SubmissionMutations.jsx | 36 ++- app/components/activity/MetaEdit.jsx | 85 ++---- app/components/activity/operations.js | 6 - app/components/operations.js | 6 + app/components/submission-wizard/Submit.jsx | 285 ++++++++++-------- .../submission-wizard/SubmitComplete.jsx | 35 ++- 6 files changed, 253 insertions(+), 200 deletions(-) diff --git a/app/components/SubmissionMutations.jsx b/app/components/SubmissionMutations.jsx index 0c12e8ede..417c58bab 100644 --- a/app/components/SubmissionMutations.jsx +++ b/app/components/SubmissionMutations.jsx @@ -5,6 +5,7 @@ import { UPDATE_NOTE, GET_MANUSCRIPT, UPDATE_MANUSCRIPT, + DELETE_MANUSCRIPT, } from './operations' export const ManuscriptMutations = BaseComponent => ({ @@ -43,16 +44,31 @@ export const ManuscriptMutations = BaseComponent => ({ callBack && callBack() } return ( - <BaseComponent - changeCitation={changeCitation} - manuscript={manuscript} - setStatus={setStatus} - updateEmbargo={updateEmbargo} - updateGrants={updateGrants} - {...props} - > - {children} - </BaseComponent> + <Mutation mutation={DELETE_MANUSCRIPT} refetchQueries={() => refetch}> + {(deleteManuscript, { data }) => { + const deleteMan = async callBack => { + await deleteManuscript({ + variables: { + id: manuscript.id, + }, + }) + callBack && callBack() + } + return ( + <BaseComponent + changeCitation={changeCitation} + deleteMan={deleteMan} + manuscript={manuscript} + setStatus={setStatus} + updateEmbargo={updateEmbargo} + updateGrants={updateGrants} + {...props} + > + {children} + </BaseComponent> + ) + }} + </Mutation> ) }} </Mutation> diff --git a/app/components/activity/MetaEdit.jsx b/app/components/activity/MetaEdit.jsx index 506846957..08e34778d 100644 --- a/app/components/activity/MetaEdit.jsx +++ b/app/components/activity/MetaEdit.jsx @@ -1,5 +1,4 @@ import React from 'react' -import { Mutation } from 'react-apollo' import { omit } from 'lodash' import styled, { withTheme } from 'styled-components' import { Action, Button, Icon, TextField } from '@pubsweet/ui' @@ -9,7 +8,6 @@ import { ManuscriptMutations, NoteMutations } from '../SubmissionMutations' import ResolveDuplicates from '../ResolveDuplicates' import GrantSearch from '../GrantSearch' import CitationEdit, { Exit } from './CitationEdit' -import { DELETE_MANUSCRIPT, QUERY_ACTIVITY_INFO } from './operations' const RouteButton = styled(Button)` align-items: center; @@ -136,60 +134,41 @@ const MetaEdit = withTheme( </React.Fragment> )} </p> - <Mutation - mutation={DELETE_MANUSCRIPT} - refetchQueries={() => [ - { - query: QUERY_ACTIVITY_INFO, - variables: { id: manuscript.id }, - }, - ]} - > - {(deleteManuscript, { data }) => { - const deleteIt = async button => { - await deleteManuscript({ - variables: { - id: manuscript.id, - }, - }) - button.parentElement.parentElement.nextElementSibling.classList.remove( + <p> + <RouteButton + disabled={curr >= done} + onClick={e => + e.currentTarget.nextElementSibling.classList.remove( 'hidden', ) } - return ( - <React.Fragment> - <p> - <RouteButton - disabled={curr >= done} - onClick={e => - e.currentTarget.nextElementSibling.classList.remove( - 'hidden', - ) - } - > - <Icon color="currentColor" size={2.5}> - trash-2 - </Icon> - Delete manuscript - </RouteButton> - <span className="hidden"> - {` Are you certain? `} - <Action - onClick={e => deleteIt(e.currentTarget)} - > - Confirm deletion - </Action> - </span> - {curr >= done && - ' Manuscript has been sent to PMC and must be withdrawn.'} - </p> - <Notification className="hidden" type="info"> - {`Manuscript succesfully deleted. If not already sent, please send a message to the user(s) explaining the deletion.`} - </Notification> - </React.Fragment> - ) - }} - </Mutation> + > + <Icon color="currentColor" size={2.5}> + trash-2 + </Icon> + Delete manuscript + </RouteButton> + <span className="hidden"> + {` Are you certain? `} + <Action + onClick={e => { + const sec = + e.currentTarget.parentElement.parentElement + .nextElementSibling + props.deleteMan(() => + sec.classList.remove('hidden'), + ) + }} + > + Confirm deletion + </Action> + </span> + {curr >= done && + ' Manuscript has been sent to PMC and must be withdrawn.'} + </p> + <Notification className="hidden" type="info"> + {`Manuscript succesfully deleted. If not already sent, please send a message to the user(s) explaining the deletion.`} + </Notification> <Exit close={close} /> </React.Fragment> ) diff --git a/app/components/activity/operations.js b/app/components/activity/operations.js index 402987c1c..50a3e8b38 100644 --- a/app/components/activity/operations.js +++ b/app/components/activity/operations.js @@ -26,12 +26,6 @@ export const GET_JOURNAL = gql` } ` -export const DELETE_MANUSCRIPT = gql` - mutation DeleteManuscript($id: ID!) { - deleteManuscript(id: $id) - } -` - export const QUERY_ACTIVITY_INFO = gql` query QueryActivitiesByManuscriptId($id: ID!) { activities: epmc_queryActivitiesByManuscriptId(id: $id) { diff --git a/app/components/operations.js b/app/components/operations.js index 8c2a7045a..5a7420822 100644 --- a/app/components/operations.js +++ b/app/components/operations.js @@ -146,3 +146,9 @@ export const REPLACE_MANUSCRIPT = gql` replaceManuscript(keepId: $keepId, throwId: $throwId) } ` + +export const DELETE_MANUSCRIPT = gql` + mutation DeleteManuscript($id: ID!) { + deleteManuscript(id: $id) + } +` diff --git a/app/components/submission-wizard/Submit.jsx b/app/components/submission-wizard/Submit.jsx index ca1129d7b..f75e85652 100644 --- a/app/components/submission-wizard/Submit.jsx +++ b/app/components/submission-wizard/Submit.jsx @@ -3,6 +3,7 @@ import styled, { withTheme } from 'styled-components' import { th } from '@pubsweet/ui-toolkit' import { Button, Action, H1, H2, H3, Icon } from '@pubsweet/ui' import { + Portal, Page, Buttons, Close, @@ -41,6 +42,7 @@ class Submit extends React.Component { constructor(props) { super(props) this.state = { + cancel: false, editing: null, highlights: '', error: '', @@ -74,7 +76,7 @@ class Submit extends React.Component { formState, } = manuscript if (teams && allfiles) { - const { editing, highlights, prune } = this.state + const { editing, highlights, prune, cancel } = this.state const sections = submitSections( manuscript, checkDupes, @@ -111,135 +113,166 @@ class Submit extends React.Component { : null const notDupes = dupeNote ? JSON.parse(dupeNote.content) : [] const duplicates = checkDupes.filter(d => !notDupes.includes(d.id)) - - if ( - (reviewer && - reviewer.id === currentUser.id && - !['in-review', 'submission-error'].includes(status)) || - (submitter && - submitter.user.id === currentUser.id && - !['INITIAL', 'READY', 'submission-error'].includes(status)) - ) { - return ( - <SubmitComplete - history={this.props.history} - manuscript={manuscript} - /> - ) - } else if (editing) { - return ( - <Page> - <Close> - <CloseButton onClick={() => this.setState({ editing: null })} /> - </Close> - {editing.props['data-upload'] ? ( - <div> - <H2>Files</H2> - <UploadFiles - checked - files={files} - manuscript={mId} - types={SubmissionTypes} - /> - </div> - ) : ( - <React.Fragment>{editing}</React.Fragment> - )} - {this.state.error && ( - <ErrorMessage> - <Icon color="currentColor" size={2}> - alert_circle - </Icon> - {this.state.error} - </ErrorMessage> - )} - <Buttons> - <Button - onClick={() => this.setState({ editing: null })} - primary={!editing.props['data-citation']} - > - {editing.props['data-citation'] ? 'Cancel' : 'Save'} - </Button> - </Buttons> - </Page> - ) - } return ( - <PreviewPage> - <PreviewPanel> - <div> - <PanelHeader> - <H1>Preview submission</H1> - </PanelHeader> - <PanelContent> - <ManuscriptPreview - file={files.find(file => file.type === 'manuscript')} - textContent={highlights => - currentUser.admin && status === 'submitted' - ? this.setState({ highlights }) - : false - } - /> - </PanelContent> - </div> - </PreviewPanel> - <EditPanel> - <div> - <PanelHeader> - <H2>Check submission details</H2> - </PanelHeader> - <PanelContent> - <Content> - {status === 'submission-error' && formState && ( - <ErrorReport>{formState}</ErrorReport> - )} - </Content> - {sections.map(sec => ( - <React.Fragment key={sec.title}> - <Header error={!!sec.error}> - <H3>{sec.title}</H3> - {sec.edit && ( - <Action - id={`edit-${sec.title}`} - onClick={() => this.setState({ editing: sec.edit })} - style={{ - display: 'inline-flex', - alignItems: 'center', - }} - > - {!!sec.error && <Alert>alert_circle</Alert>} - <Icon color="currentColor" size={2.5}> - edit - </Icon> - Edit - </Action> - )} - </Header> - <Content> - <div> - {sec.content} - {sec.error} - </div> - </Content> - </React.Fragment> - ))} - <SubmitForm + <React.Fragment> + {(() => { + if ( + (reviewer && + reviewer.id === currentUser.id && + !['in-review', 'submission-error'].includes(status)) || + (submitter && + submitter.user.id === currentUser.id && + !['INITIAL', 'READY', 'submission-error'].includes(status)) + ) { + return ( + <SubmitComplete + cancel={() => this.setState({ cancel: true })} currentUser={currentUser} - manuscript={this.props.manuscript} - sections={sections} + history={this.props.history} + manuscript={manuscript} /> - </PanelContent> - </div> - </EditPanel> - {duplicates.length > 0 && prune && ( - <DuplicatesWithMutations - close={() => this.setState({ prune: false })} - duplicates={duplicates} - manuscript={manuscript} - note={dupeNote} - /> + ) + } else if (editing) { + return ( + <Page> + <Close> + <CloseButton + onClick={() => this.setState({ editing: null })} + /> + </Close> + {editing.props['data-upload'] ? ( + <div> + <H2>Files</H2> + <UploadFiles + checked + files={files} + manuscript={mId} + types={SubmissionTypes} + /> + </div> + ) : ( + <React.Fragment>{editing}</React.Fragment> + )} + {this.state.error && ( + <ErrorMessage> + <Icon color="currentColor" size={2}> + alert_circle + </Icon> + {this.state.error} + </ErrorMessage> + )} + <Buttons> + <Button + onClick={() => this.setState({ editing: null })} + primary={!editing.props['data-citation']} + > + {editing.props['data-citation'] ? 'Cancel' : 'Save'} + </Button> + </Buttons> + </Page> + ) + } + return ( + <PreviewPage> + <PreviewPanel> + <div> + <PanelHeader> + <H1>Preview submission</H1> + </PanelHeader> + <PanelContent> + <ManuscriptPreview + file={files.find(file => file.type === 'manuscript')} + textContent={highlights => + currentUser.admin && status === 'submitted' + ? this.setState({ highlights }) + : false + } + /> + </PanelContent> + </div> + </PreviewPanel> + <EditPanel> + <div> + <PanelHeader> + <H2>Check submission details</H2> + </PanelHeader> + <PanelContent> + <Content> + {status === 'submission-error' && formState && ( + <ErrorReport>{formState}</ErrorReport> + )} + </Content> + {sections.map(sec => ( + <React.Fragment key={sec.title}> + <Header error={!!sec.error}> + <H3>{sec.title}</H3> + {sec.edit && ( + <Action + id={`edit-${sec.title}`} + onClick={() => + this.setState({ editing: sec.edit }) + } + style={{ + display: 'inline-flex', + alignItems: 'center', + }} + > + {!!sec.error && <Alert>alert_circle</Alert>} + <Icon color="currentColor" size={2.5}> + edit + </Icon> + Edit + </Action> + )} + </Header> + <Content> + <div> + {sec.content} + {sec.error} + </div> + </Content> + </React.Fragment> + ))} + <SubmitForm + currentUser={currentUser} + manuscript={this.props.manuscript} + sections={sections} + /> + </PanelContent> + </div> + </EditPanel> + {duplicates.length > 0 && prune && ( + <DuplicatesWithMutations + close={() => this.setState({ prune: false })} + duplicates={duplicates} + manuscript={manuscript} + note={dupeNote} + /> + )} + </PreviewPage> + ) + })()} + {cancel && ( + <Portal transparent> + <p> + {`Are you sure you want to cancel this submission? The submission will be removed and processing will not be completed.`} + </p> + <Buttons right> + <Button + onClick={() => + this.props.deleteMan(() => this.props.history.push('/')) + } + primary + > + Yes + </Button> + <Button onClick={() => this.setState({ cancel: false })}> + No + </Button> + </Buttons> + </Portal> )} - </PreviewPage> + </React.Fragment> ) } return null diff --git a/app/components/submission-wizard/SubmitComplete.jsx b/app/components/submission-wizard/SubmitComplete.jsx index ea1abfe61..0336d27aa 100644 --- a/app/components/submission-wizard/SubmitComplete.jsx +++ b/app/components/submission-wizard/SubmitComplete.jsx @@ -1,15 +1,29 @@ import { states } from 'config' import React from 'react' -import { Button, H1, H2, H3 } from '@pubsweet/ui' +import { Action, Icon, Button, H1, H2, H3 } from '@pubsweet/ui' import { B, Buttons, Page } from '../ui' +import { SubmissionTypes } from '../upload-files' import { FileThumbnails } from '../preview-files' import Citation from './Citation' -const SubmitComplete = ({ manuscript, history }) => { - const { status, meta, files, journal } = manuscript +const SubmitComplete = ({ currentUser, cancel, manuscript, history }) => { + const { status, meta, files, journal, teams } = manuscript const { fundingGroup, releaseDelay } = meta + const submitter = + teams && teams.find(team => team.role === 'submitter') + ? teams.find(team => team.role === 'submitter').teamMembers[0] + : null + const showFiles = files + ? files.filter( + file => + !file.type || + file.type === 'manuscript' || + SubmissionTypes.some(t => t.value === file.type), + ) + : [] const curr = states.indexOf(status) const done = states.indexOf('xml-complete') + const sent = states.indexOf('ncbi-ready') return ( <Page> <H1>Thank you for your submission</H1> @@ -23,16 +37,27 @@ const SubmitComplete = ({ manuscript, history }) => { : 'being processed' }. You will receive email updates as it is processed. You can also log in to Europe PMC plus at any time to check the status of your submission. If you require any changes to the following information, please click the link above to contact the Helpdesk.`} </p> - <Buttons right> + <Buttons> <Button onClick={() => history.push('/')} primary> Done </Button> + {submitter && submitter.user.id === currentUser.id && curr < sent && ( + <Action + onClick={() => cancel()} + style={{ display: 'inline-flex', alignItems: 'center' }} + > + <Icon color="currentColor" size={2.5}> + trash-2 + </Icon> + Cancel submission + </Action> + )} </Buttons> <H2>Submission details</H2> <H3>Citation</H3> <Citation journal={journal} metadata={meta} /> <H3>Files</H3> - <FileThumbnails files={files} /> + <FileThumbnails files={showFiles} /> <H3>Funding</H3> {fundingGroup && fundingGroup.length > 0 && ( <p> -- GitLab