feat(handling-editor-response): create handling editor contextual box

packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.js

+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)

packages/component-faraday-ui/src/manuscriptDetails/HandlingEditorAnswer.md

+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')
+  }}
+/>
+```

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 {

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',