From 2006035287dbd060201ca628ff4d491c6c29e577 Mon Sep 17 00:00:00 2001 From: Alexandru Munteanu <alexandru.munt@gmail.com> Date: Fri, 14 Sep 2018 19:38:33 +0300 Subject: [PATCH] feat(handling-editor-response): create handling editor contextual box --- .../manuscriptDetails/HandlingEditorAnswer.js | 83 +++++++++++++++++++ .../manuscriptDetails/HandlingEditorAnswer.md | 15 ++++ packages/hindawi-theme/src/elements/Radio.js | 1 + packages/hindawi-theme/src/index.js | 2 +- 4 files changed, 100 insertions(+), 1 deletion(-) create mode 100644 packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.js create mode 100644 packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.md diff --git a/packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.js b/packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.js new file mode 100644 index 000000000..15dda7a9f --- /dev/null +++ b/packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.js @@ -0,0 +1,83 @@ +import React from 'react' +import { get, has } from 'lodash' +import { reduxForm } from 'redux-form' +import { compose, withProps } from 'recompose' +import { Button, RadioGroup, ValidatedField } from '@pubsweet/ui' + +import { + Row, + Item, + Text, + Label, + Textarea, + OpenModal, + ContextualBox, + RowOverrideAlert, +} from '../' + +const options = [ + { label: 'Accept', value: 'accept' }, + { label: 'Decline', value: 'decline' }, +] + +const HandlingEditorAnswer = ({ + disabled, + handleSubmit, + shouldShowComments, +}) => ( + <ContextualBox label="Respond to Editorial Invitation"> + <RowOverrideAlert justify="flex-start" ml={1} mt={1}> + <Item vertical> + <Label required> + Do you agree to be the handling editor for this manuscript? + </Label> + <ValidatedField + component={input => ( + <RadioGroup inline name="decision" options={options} {...input} /> + )} + name="decision" + /> + </Item> + </RowOverrideAlert> + + {shouldShowComments && ( + <RowOverrideAlert ml={1} mt={2}> + <Item vertical> + <Label> + Decline Reason{' '} + <Text secondary small> + Optional + </Text> + </Label> + <ValidatedField component={Textarea} name="reason" /> + </Item> + </RowOverrideAlert> + )} + + <Row justify="flex-end" mb={1} pr={1}> + <OpenModal + onConfirm={modalProps => handleSubmit()(modalProps)} + title="Are you sure?" + > + {showModal => ( + <Button disabled={disabled} onClick={showModal} primary size="medium"> + RESPOND TO INVITATION + </Button> + )} + </OpenModal> + </Row> + </ContextualBox> +) + +export default compose( + withProps(({ formValues }) => ({ + disabled: !has(formValues, 'decision'), + shouldShowComments: get(formValues, 'decision', 'agree') === 'decline', + })), + reduxForm({ + form: 'he-answer-invitation', + onSubmit: (values, dispatch, { onResponse }) => modalProps => { + onResponse(values, modalProps) + }, + }), +)(HandlingEditorAnswer) diff --git a/packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.md b/packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.md new file mode 100644 index 000000000..444b043f6 --- /dev/null +++ b/packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.md @@ -0,0 +1,15 @@ +Handling Editor answer invitation. + +```js +const formValues = { + decision: 'decline', +}; + +<HandlingEditorAnswer + formValues={formValues} + onResponse={(values, modalProps) => { + console.log('se da surmit', values, modalProps) + modalProps.setModalError('bine coite') + }} +/> +``` diff --git a/packages/hindawi-theme/src/elements/Radio.js b/packages/hindawi-theme/src/elements/Radio.js index db51c9522..124dbf445 100644 --- a/packages/hindawi-theme/src/elements/Radio.js +++ b/packages/hindawi-theme/src/elements/Radio.js @@ -27,6 +27,7 @@ export default { `, Label: css` color: ${th('colorText')}; + font-family: ${th('fontWriting')}; margin-right: ${th('gridUnit')}; &::before { diff --git a/packages/hindawi-theme/src/index.js b/packages/hindawi-theme/src/index.js index 10265c377..e60cef34f 100644 --- a/packages/hindawi-theme/src/index.js +++ b/packages/hindawi-theme/src/index.js @@ -64,7 +64,7 @@ const hindawiTheme = { accordion: { headerBackgroundColor: '#ffffff', - backgroundColor: '#f6f6f6', + backgroundColor: '#ffffff', headerFontSize: '16px', headerFontFamily: "'Myriad Pro'", border: '1px solid #dbdbdb', -- GitLab