diff --git a/app/components/activity/MetaEdit.jsx b/app/components/activity/MetaEdit.jsx index 59c4d81fc5ce20a5254835e922a49e5a3ba50f5d..50684695729ed0287ca3cbb89d4c3fd04002da84 100644 --- a/app/components/activity/MetaEdit.jsx +++ b/app/components/activity/MetaEdit.jsx @@ -1,13 +1,15 @@ import React from 'react' +import { Mutation } from 'react-apollo' import { omit } from 'lodash' import styled, { withTheme } from 'styled-components' -import { Button, Icon, TextField } from '@pubsweet/ui' +import { Action, Button, Icon, TextField } from '@pubsweet/ui' import { states } from 'config' -import { Portal, Buttons, Close, CloseButton } from '../ui' +import { Portal, Buttons, Close, CloseButton, Notification } from '../ui' 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; @@ -134,23 +136,60 @@ const MetaEdit = withTheme( </React.Fragment> )} </p> - <p> - {curr >= done ? ( - <RouteButton> - <Icon color="currentColor" size={2.5}> - delete - </Icon> - Withdraw manuscript - </RouteButton> - ) : ( - <RouteButton> - <Icon color="currentColor" size={2.5}> - trash-2 - </Icon> - Remove manuscript - </RouteButton> - )} - </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( + '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> <Exit close={close} /> </React.Fragment> ) diff --git a/app/components/activity/operations.js b/app/components/activity/operations.js index 50a3e8b383f4aba1c811f190c4d4aad560f8b2ea..402987c1cabbd76d0cf26f0c4d8452b4da6ad092 100644 --- a/app/components/activity/operations.js +++ b/app/components/activity/operations.js @@ -26,6 +26,12 @@ 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) {