Skip to content
Snippets Groups Projects
Commit c0e22f81 authored by Alexandru Munteanu's avatar Alexandru Munteanu
Browse files

feat(make-recommendation): request a revision form

parent ff0f4880
No related branches found
No related tags found
1 merge request!10Sprint #12
Hide whitespace changes
Inline Side-by-side
packages/components-faraday/src/components/MakeRecommendation/FormItems.js
+ 3
− 3
View file @ c0e22f81
......@@ -8,7 +8,7 @@ export const RootContainer = styled.div`
flex-direction: column;
margin: 0 auto;
max-width: 550px;
min-width: 350px;
min-width: 450px;
padding: calc(${th('subGridUnit')} * 2) calc(${th('subGridUnit')} * 4);
`
......@@ -48,7 +48,7 @@ export const Row = styled.div`
export const RowItem = styled.div`
display: flex;
flex: 1;
flex: ${({ flex }) => flex || 1};
flex-direction: ${({ vertical }) => (vertical ? 'column' : 'row')};
justify-content: ${({ centered }) => (centered ? 'center' : 'initial')};
`
......@@ -67,7 +67,7 @@ export const Err = styled.span`
`
export const Textarea = styled.textarea`
width: 100%;
width: 400px;
padding: calc(${th('subGridUnit')}*2);
font-size: ${th('fontSizeBaseSmall')};
font-family: ${th('fontWriting')};
......
packages/components-faraday/src/components/MakeRecommendation/StepTwo.js
+ 163
− 31
View file @ c0e22f81
import React from 'react'
import React, { Fragment } from 'react'
import { capitalize } from 'lodash'
import { compose } from 'recompose'
import { reduxForm } from 'redux-form'
import { Button, Spinner, ValidatedField } from '@pubsweet/ui'
import { connect } from 'react-redux'
import { required } from 'xpub-validators'
import styled, { css } from 'styled-components'
import { reduxForm, change as changeForm } from 'redux-form'
import { compose, withState, withHandlers } from 'recompose'
import {
th,
Icon,
Button,
Spinner,
RadioGroup,
ValidatedField,
} from '@pubsweet/ui'
import {
Row,
......@@ -15,41 +25,118 @@ import {
FormContainer,
} from './'
const revisionOptions = [
{ value: 'minor', label: 'Minor' },
{ value: 'major', label: 'Major' },
]
const Form = RootContainer.withComponent(FormContainer)
const StepTwo = ({
recommendationError,
goBack,
hasNote,
decision,
handleSubmit,
showNote,
removeNote,
isFetching,
handleSubmit,
recommendationError,
}) => (
<Form onSubmit={handleSubmit}>
<Title>{`Recommandation to ${capitalize(decision)}`}</Title>
<Row>
<RowItem vertical>
<Label>Message for Editor in Chief (optional)</Label>
<ValidatedField
component={input => <Textarea {...input} />}
name="message.eic"
/>
</RowItem>
</Row>
<Row>
<RowItem vertical>
<Label>Message for Author (optional)</Label>
<ValidatedField
component={input => <Textarea {...input} />}
name="message.author"
/>
</RowItem>
</Row>
{recommendationError && (
<Row>
<RowItem centered>
<Err>{recommendationError}</Err>
</RowItem>
</Row>
<Title>
{decision !== 'revise'
? `Recommandation to ${capitalize(decision)}`
: `Request a revision from Author`}
</Title>
{decision !== 'revise' ? (
<Fragment>
<Row>
<RowItem vertical>
<Label>Message for Editor in Chief (optional)</Label>
<ValidatedField
component={input => <Textarea {...input} />}
name="message.eic"
/>
</RowItem>
</Row>
<Row>
<RowItem vertical>
<Label>Message for Author (optional)</Label>
<ValidatedField
component={input => <Textarea {...input} />}
name="message.author"
/>
</RowItem>
</Row>
{recommendationError && (
<Row>
<RowItem centered>
<Err>{recommendationError}</Err>
</RowItem>
</Row>
)}
</Fragment>
) : (
<Fragment>
<CustomRow>
<RowItem vertical>
<Label>REVISION TYPE</Label>
<ValidatedField
component={input => (
<RadioGroup
name="revision.revision-type"
{...input}
options={revisionOptions}
/>
)}
name="revision.revisionType"
/>
</RowItem>
</CustomRow>
<CustomRow>
<RowItem vertical>
<Label>REASON & DETAILS</Label>
<ValidatedField
component={input => <Textarea {...input} />}
name="revision.reason"
validate={[required]}
/>
</RowItem>
</CustomRow>
{!hasNote ? (
<Row>
<RowItem>
<TextButton onClick={showNote}>Add Internal Note</TextButton>
<HintText>Not shared with author</HintText>
</RowItem>
</Row>
) : (
<Fragment>
<CustomRow>
<RowItem>
<Label>INTERNAL NOTE</Label>
</RowItem>
<RowItem>
<HintText>Not shared with author</HintText>
</RowItem>
<CustomRowItem onClick={removeNote}>
<IconButton>
<Icon primary>x</Icon>
</IconButton>
<TextButton>Remove</TextButton>
</CustomRowItem>
</CustomRow>
<CustomRow>
<RowItem>
<ValidatedField
component={input => <Textarea {...input} />}
name="revision.internal-note"
/>
</RowItem>
</CustomRow>
</Fragment>
)}
</Fragment>
)}
<Row>
<RowItem centered>
......@@ -69,9 +156,54 @@ const StepTwo = ({
)
export default compose(
connect(null, { changeForm }),
withState('hasNote', 'changeHasNote', false),
withHandlers({
showNote: ({ changeHasNote }) => () => {
changeHasNote(true)
},
removeNote: ({ changeHasNote, changeForm }) => () => {
changeHasNote(false)
changeForm('recommendation', 'revision.internal-note', '')
},
}),
reduxForm({
form: 'recommendation',
destroyOnUnmount: false,
forceUnregisterOnUnmount: true,
}),
)(StepTwo)
// #region styled components
const defaultText = css`
color: ${th('colorPrimary')};
font-family: ${th('fontInterface')};
font-size: ${th('fontSizeBaseSmall')};
`
const TextButton = styled.span`
${defaultText};
cursor: pointer;
margin-right: ${th('subGridUnit')};
text-decoration: underline;
`
const HintText = styled.span`
${defaultText};
font-style: oblique;
`
const IconButton = styled.div`
display: flex;
justify-content: center;
`
const CustomRowItem = RowItem.extend`
align-items: center;
justify-content: flex-end;
`
const CustomRow = Row.extend`
margin: ${th('subGridUnit')} 0;
`
// #endregion
packages/xpub-faraday/app.js
+ 1
− 1
View file @ c0e22f81
......@@ -3,6 +3,6 @@ const startServer = require('pubsweet-server')
require('dotenv').config()
startServer().catch(err => {
logger.error('FATAL ERROR, SHUTTING DOWN::', err)
logger.error('FATAL ERROR, SHUTTING DOWN:', err)
process.exit(1)
})
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