From c2e2202e0af5b141d869645ba83f9a9c4ad7823c Mon Sep 17 00:00:00 2001
From: Daniel Sandu <daniel.sandu@thinslices.com>
Date: Tue, 4 Dec 2018 09:46:23 +0200
Subject: [PATCH] refactor(menucountry): refactored code and updated old menu
country field boxes
---
.../component-faraday-ui/src/AuthorCard.js | 15 ++------
.../src/InviteReviewers.js | 12 ++++---
.../component-faraday-ui/src/MenuCountry.js | 34 +++++++++----------
.../component-faraday-ui/src/UserProfile.js | 6 ++--
.../src/modals/FormModal.js | 14 ++++----
.../src/components/Admin/AddUser.js | 5 +--
6 files changed, 39 insertions(+), 47 deletions(-)
diff --git a/packages/component-faraday-ui/src/AuthorCard.js b/packages/component-faraday-ui/src/AuthorCard.js
index 2ace7fa98..36f74f2d4 100644
--- a/packages/component-faraday-ui/src/AuthorCard.js
+++ b/packages/component-faraday-ui/src/AuthorCard.js
@@ -4,14 +4,7 @@ import styled from 'styled-components'
import { th } from '@pubsweet/ui-toolkit'
import { required } from 'xpub-validators'
import { reduxForm, Field } from 'redux-form'
-import {
- Menu,
- H3,
- ValidatedField,
- TextField,
- Checkbox,
- Spinner,
-} from '@pubsweet/ui'
+import { H3, ValidatedField, TextField, Checkbox, Spinner } from '@pubsweet/ui'
import {
compose,
withState,
@@ -20,7 +13,7 @@ import {
setDisplayName,
} from 'recompose'
-import { withCountries } from 'pubsweet-component-faraday-ui'
+import { MenuCountry } from 'pubsweet-component-faraday-ui'
import { Tag, Label, Row, Item, PersonInfo, IconButton, OpenModal } from './'
import { validators } from './helpers'
@@ -129,7 +122,6 @@ const AuthorTitle = ({
// #region AuthorEdit
const AuthorEdit = ({
- countries,
author,
editMode,
listIndex,
@@ -196,7 +188,7 @@ const AuthorEdit = ({
<Label required>Country</Label>
<ValidatedField
component={input => (
- <Menu {...input} options={countries} placeholder="Please select" />
+ <MenuCountry {...input} placeholder="Please select" />
)}
data-test-id="author-card-country"
name="country"
@@ -208,7 +200,6 @@ const AuthorEdit = ({
// #endregion
const EnhancedAuthorEdit = compose(
- withCountries,
withProps(({ author }) => ({
initialValues: author,
})),
diff --git a/packages/component-faraday-ui/src/InviteReviewers.js b/packages/component-faraday-ui/src/InviteReviewers.js
index 7c93ebb31..7f07b70cb 100644
--- a/packages/component-faraday-ui/src/InviteReviewers.js
+++ b/packages/component-faraday-ui/src/InviteReviewers.js
@@ -5,7 +5,9 @@ import { reduxForm } from 'redux-form'
import { th } from '@pubsweet/ui-toolkit'
import { required } from 'xpub-validators'
import { withModal } from 'pubsweet-component-modal/src/components'
-import { Button, H4, Menu, TextField, ValidatedField } from '@pubsweet/ui'
+import { Button, H4, TextField, ValidatedField } from '@pubsweet/ui'
+
+import { MenuCountry } from 'pubsweet-component-faraday-ui'
import {
Row,
@@ -15,10 +17,9 @@ import {
ItemOverrideAlert,
withFetching,
validators,
- withCountries,
} from '../'
-const InviteReviewers = ({ countries, handleSubmit, reset }) => (
+const InviteReviewers = ({ handleSubmit, reset }) => (
<Root>
<Row justify="space-between" mb={2}>
<H4>Invite reviewer</H4>
@@ -82,7 +83,9 @@ const InviteReviewers = ({ countries, handleSubmit, reset }) => (
<ItemOverrideAlert vertical>
<Label required>Country</Label>
<ValidatedField
- component={input => <Menu options={countries} {...input} />}
+ component={input => (
+ <MenuCountry {...input} placeholder="Please select" />
+ )}
name="country"
validate={[required]}
/>
@@ -93,7 +96,6 @@ const InviteReviewers = ({ countries, handleSubmit, reset }) => (
export default compose(
withFetching,
- withCountries,
withModal(({ isFetching, modalKey }) => ({
modalKey,
isFetching,
diff --git a/packages/component-faraday-ui/src/MenuCountry.js b/packages/component-faraday-ui/src/MenuCountry.js
index d039d1544..8ca9f618b 100644
--- a/packages/component-faraday-ui/src/MenuCountry.js
+++ b/packages/component-faraday-ui/src/MenuCountry.js
@@ -13,23 +13,6 @@ const filteredCountries = (countries, userInput) =>
const firstFilteredCountry = props =>
filteredCountries(props.countries, props.userInput)[0]
-const Input = styled.input`
- width: 100%;
- height: calc(${th('gridUnit')} * 4);
- border: ${th('accordion.border')};
- border-radius: ${th('borderRadius')};
- padding: 0 ${th('gridUnit')};
- ::placeholder {
- color: ${th('colorText')};
- opacity: 1;
- font-family: ${th('fontWriting')};
- }
- :focus {
- border-color: ${th('action.colorActive')}
- outline: none;
- }
-`
-
const CustomOpener = ({
selected,
userInput,
@@ -79,3 +62,20 @@ const enhance = compose(
)
export default enhance(MenuCountry)
+
+const Input = styled.input`
+ width: 100%;
+ height: calc(${th('gridUnit')} * 4);
+ border: ${th('accordion.border')};
+ border-radius: ${th('borderRadius')};
+ padding: 0 ${th('gridUnit')};
+ ::placeholder {
+ color: ${th('colorText')};
+ opacity: 1;
+ font-family: ${th('fontWriting')};
+ }
+ :focus {
+ border-color: ${th('action.colorActive')}
+ outline: none;
+ }
+`
diff --git a/packages/component-faraday-ui/src/UserProfile.js b/packages/component-faraday-ui/src/UserProfile.js
index 292c04822..e1bdc2074 100644
--- a/packages/component-faraday-ui/src/UserProfile.js
+++ b/packages/component-faraday-ui/src/UserProfile.js
@@ -7,7 +7,7 @@ import { th } from '@pubsweet/ui-toolkit'
import { required as requiredValidator } from 'xpub-validators'
import { compose, withStateHandlers, withProps } from 'recompose'
import { H3, Spinner, ValidatedField, TextField, Menu } from '@pubsweet/ui'
-import { withCountries } from 'pubsweet-component-faraday-ui'
+import { withCountries, MenuCountry } from 'pubsweet-component-faraday-ui'
import {
Row,
@@ -179,7 +179,9 @@ const EditUserProfile = compose(
<Item ml={1} vertical>
<Label required>Country</Label>
<ValidatedField
- component={input => <Menu {...input} options={countries} />}
+ component={input => (
+ <MenuCountry {...input} placeholder="Please select" />
+ )}
name="country"
validate={[requiredValidator]}
/>
diff --git a/packages/component-faraday-ui/src/modals/FormModal.js b/packages/component-faraday-ui/src/modals/FormModal.js
index e9adb3b78..e798227aa 100644
--- a/packages/component-faraday-ui/src/modals/FormModal.js
+++ b/packages/component-faraday-ui/src/modals/FormModal.js
@@ -19,12 +19,13 @@ import {
Text,
Item,
Label,
+ MenuCountry,
IconButton,
RowOverrideAlert,
ItemOverrideAlert,
} from 'pubsweet-component-faraday-ui'
-const AddUserForm = ({ roles, countries, titles }) => (
+const AddUserForm = ({ roles, titles }) => (
<Fragment>
<Row alignItems="baseline" mb={1} mt={1}>
<Item mr={1} vertical>
@@ -72,7 +73,7 @@ const AddUserForm = ({ roles, countries, titles }) => (
<Label>Country</Label>
<ValidatedField
component={input => (
- <Menu options={countries} {...input} placeholder="Please select" />
+ <MenuCountry {...input} placeholder="Please select" />
)}
name="country"
/>
@@ -88,7 +89,7 @@ const AddUserForm = ({ roles, countries, titles }) => (
</Fragment>
)
-const EditForm = ({ titles, countries }) => (
+const EditForm = ({ titles }) => (
<Fragment>
<Row alignItems="center" mb={2} mt={1}>
<Item mr={1} vertical>
@@ -115,7 +116,7 @@ const EditForm = ({ titles, countries }) => (
<Label>Country</Label>
<ValidatedField
component={input => (
- <Menu options={countries} {...input} placeholder="Please select" />
+ <MenuCountry {...input} placeholder="Please select" />
)}
name="country"
/>
@@ -186,7 +187,6 @@ const FormModal = ({
onClose,
subtitle,
onConfirm,
- countries,
modalError,
isFetching,
handleSubmit,
@@ -198,9 +198,9 @@ const FormModal = ({
<H2>{title}</H2>
{edit && <Text secondary>{user.email}</Text>}
{edit ? (
- <EditForm countries={countries} titles={titles} />
+ <EditForm titles={titles} />
) : (
- <AddUserForm countries={countries} roles={roles} titles={titles} />
+ <AddUserForm roles={roles} titles={titles} />
)}
{modalError && (
<Row mb={1}>
diff --git a/packages/components-faraday/src/components/Admin/AddUser.js b/packages/components-faraday/src/components/Admin/AddUser.js
index 572e42f07..7fd409d67 100644
--- a/packages/components-faraday/src/components/Admin/AddUser.js
+++ b/packages/components-faraday/src/components/Admin/AddUser.js
@@ -9,7 +9,6 @@ import {
IconButton,
withRoles,
withFetching,
- withCountries,
} from 'pubsweet-component-faraday-ui'
const AddUser = ({ edit, journal, handleSubmit, ...rest }) => (
@@ -32,6 +31,4 @@ const AddUser = ({ edit, journal, handleSubmit, ...rest }) => (
</OpenModal>
)
-export default compose(withJournal, withCountries, withRoles, withFetching)(
- AddUser,
-)
+export default compose(withJournal, withRoles, withFetching)(AddUser)
--
GitLab