Commit 5f6758bd authored by Audrey Hamelers's avatar Audrey Hamelers
parent a4ce7655
Pipeline #12989 passed with stages
in 11 minutes and 42 seconds
......@@ -32,6 +32,11 @@ const Columns = styled.div`
box-sizing: border-box;
margin-right: 1%;
margin-left: 1%;
opacity: 1;
transition: opacity 0.5s linear;
&.scaled {
opacity: 0;
}
}
`
const Current = styled.div`
......@@ -61,7 +66,25 @@ const FlexP = styled.div`
justify-content: space-between;
`
class ResolveDuplicates extends React.Component {
state = { error: null }
state = { error: null, success: null }
componentDidUpdate() {
const { duplicates, close } = this.props
const { success } = this.state
if (success && this.portal) {
const redirect = duplicates && duplicates.find(d => d.id === success)
setTimeout(() => {
this.setState({ success: null })
if (duplicates.length < 1) {
close()
}
if (redirect) {
this.props.history.replace(
`/submission/${redirect.id}/${States.admin[redirect.status].url}`,
)
}
}, 2500)
}
}
setRef = portal => {
this.portal = portal
}
......@@ -111,7 +134,7 @@ class ResolveDuplicates extends React.Component {
}
render() {
const { close, manuscript: current, duplicates } = this.props
const { error } = this.state
const { error, success } = this.state
return (
<Mutation
mutation={REPLACE_MANUSCRIPT}
......@@ -135,13 +158,14 @@ class ResolveDuplicates extends React.Component {
}}
>
{(replaceManuscript, { data }) => {
const replace = async (keepId, throwId) => {
const { data } = await replaceManuscript({
variables: { keepId, throwId },
})
if (data.replaceManuscript && throwId === current.id) {
this.props.history.push('/')
}
const replace = (keepId, throwId, e) => {
e.currentTarget.parentNode.classList.add('scaled')
setTimeout(async () => {
await replaceManuscript({
variables: { keepId, throwId },
})
this.setState({ success: keepId })
}, 500)
}
return (
<Portal ref={this.setRef} transparent>
......@@ -149,13 +173,22 @@ class ResolveDuplicates extends React.Component {
<Columns>
<H3>This manuscript</H3>
<H3>Duplicate(s)</H3>
{error && (
<div style={{ flex: '0 0 100%' }}>
<Notification type="error">
Two articles cannot have the same {error.toUpperCase()}.
</Notification>
</div>
)}
{error ||
(success && (
<div style={{ flex: '0 0 100%' }}>
{error && (
<Notification type="error">
Two articles cannot have the same{' '}
{error.toUpperCase()}.
</Notification>
)}
{success && (
<Notification type="success">
Duplicate merged and removed.
</Notification>
)}
</div>
))}
<Current>
<H4>{current.id}</H4>
<Citation journal={current.journal} metadata={current.meta} />
......@@ -178,13 +211,14 @@ class ResolveDuplicates extends React.Component {
))}
</p>
<Button
onClick={() => replace(duplicates[0].id, current.id)}
onClick={e => replace(duplicates[0].id, current.id, e)}
primary
>
Remove this &amp; transfer grants
<Icon color="currentColor">arrow-right</Icon>
</Button>
</Current>
{duplicates.length < 1 && <div />}
{duplicates.map((dupe, i) => (
<React.Fragment key={dupe.id}>
<Dupes>
......@@ -225,7 +259,7 @@ class ResolveDuplicates extends React.Component {
))}
</p>
<Button
onClick={() => replace(current.id, dupe.id)}
onClick={e => replace(current.id, dupe.id, e)}
primary
>
<Icon color="currentColor">arrow-left</Icon>
......
Markdown is supported
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