Skip to content
Snippets Groups Projects
Commit e7dd4cf4 authored by Sinzeanu Demetriad's avatar Sinzeanu Demetriad
Browse files

perf: Pulled from develop

parents 9d89dfdb bfce0617
No related branches found
No related tags found
3 merge requests!222Sprint #26,!217Sprint #26,!191Hin 1116 documentation
Hide whitespace changes
Inline Side-by-side
Showing
with 231 additions and 258 deletions
packages/component-email/package.json
+ 1
− 1
View file @ e7dd4cf4
......@@ -25,7 +25,7 @@
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"@pubsweet/component-send-email": "0.2.4",
"pubsweet-server": "^1.0.1"
"pubsweet-server": "^10.0.0"
},
"devDependencies": {
"apidoc": "^0.17.6",
......
packages/component-faraday-ui/package.json
+ 6
− 7
View file @ e7dd4cf4
......@@ -4,14 +4,13 @@
"main": "src",
"license": "MIT",
"dependencies": {
"@pubsweet/ui": "^8.6.0",
"@pubsweet/ui-toolkit": "^1.2.0",
"@pubsweet/ui": "^9.0.2",
"@pubsweet/ui-toolkit": "^2.0.0",
"country-list": "^1.1.0",
"grid-styled": "5.0.2",
"formik": "^1.3.2",
"prop-types": "^15.6.2",
"querystring": "^0.2.0",
"react": "^16.4.2",
"styled-components": "^3.4.2"
},
"devDependencies": {}
"react": "^16.6.0",
"styled-components": "^4.1.0"
}
}
packages/component-faraday-ui/src/AppBarMenu.js
+ 6
− 6
View file @ e7dd4cf4
......@@ -85,9 +85,9 @@ const User = styled.div`
display: flex;
cursor: pointer;
`
const Dropdown = styled.div.attrs({
'data-test-id': props => props['data-test-id'] || 'admin-dropdown',
})`
const Dropdown = styled.div.attrs(props => ({
'data-test-id': props['data-test-id'] || 'admin-dropdown',
}))`
background-color: ${th('appBar.colorBackground')};
border-radius: ${th('borderRadius')};
box-shadow: ${th('boxShadow')};
......@@ -98,9 +98,9 @@ const Dropdown = styled.div.attrs({
z-index: 10;
`
const DropdownOption = styled.div.attrs({
'data-test-id': props => props['data-test-id'] || 'dropdown-option',
})`
const DropdownOption = styled.div.attrs(props => ({
'data-test-id': props['data-test-id'] || 'dropdown-option',
}))`
align-items: center;
color: ${th('colorText')};
cursor: pointer;
......
packages/component-faraday-ui/src/ContextualBox.js
+ 3
− 3
View file @ e7dd4cf4
......@@ -78,9 +78,9 @@ ContextualBox.defaultProps = {
}
// #region styles
const Header = styled.div.attrs({
'data-test-id': props => props['data-test-id'] || 'accordion-header',
})`
const Header = styled.div.attrs(props => ({
'data-test-id': props['data-test-id'] || 'accordion-header',
}))`
align-items: center;
cursor: pointer;
display: flex;
......
packages/component-faraday-ui/src/FileSection.js
+ 4
− 4
View file @ e7dd4cf4
......@@ -51,13 +51,13 @@ const FileSection = ({
onDelete,
}) => (
<Root
innerRef={instance => {
connectFileDrop(instance)
connectDropTarget(instance)
}}
isFileItemOver={isFileItemOver && canDropFileItem}
isFirst={isFirst}
isLast={isLast}
ref={instance => {
connectFileDrop(instance)
connectDropTarget(instance)
}}
>
<Row alignItems="center">
<Item>
......
packages/component-faraday-ui/src/helpers/withRoles.js
+ 18
− 13
View file @ e7dd4cf4
import { get } from 'lodash'
import { withProps } from 'recompose'
import { withJournal } from 'xpub-journal'
import { compose, withProps } from 'recompose'
export default withProps(({ journal }) => ({
roles: Object.entries(get(journal, 'roles', {})).reduce(
(acc, el) => [
...acc,
{
value: el[0],
label: el[1],
},
],
[],
),
}))
export default compose(
withJournal,
withProps(({ journal }) => ({
titles: get(journal, 'title', []),
roles: Object.entries(get(journal, 'roles', {})).reduce(
(acc, el) => [
...acc,
{
value: el[0],
label: el[1],
},
],
[],
),
})),
)
packages/component-faraday-ui/src/modals/FormModal.js
+ 108
− 201
View file @ e7dd4cf4
import React, { Fragment } from 'react'
import { get } from 'lodash'
import { Formik } from 'formik'
import styled from 'styled-components'
import { reduxForm } from 'redux-form'
import { th } from '@pubsweet/ui-toolkit'
import { required } from 'xpub-validators'
import { H2, Button, TextField, ValidatedFieldFormik } from '@pubsweet/ui'
import { compose, setDisplayName, withHandlers, withProps } from 'recompose'
import {
H2,
Menu,
Button,
Spinner,
Checkbox,
TextField,
ValidatedField,
} from '@pubsweet/ui'
import {
Row,
Text,
Item,
Label,
MenuCountry,
IconButton,
RowOverrideAlert,
ItemOverrideAlert,
withRoles,
withCountries,
} from 'pubsweet-component-faraday-ui'
const AddUserForm = ({ roles, titles }) => (
<Fragment>
<Row alignItems="baseline" mb={1} mt={1}>
<Item mr={1} vertical>
<Label required>Email</Label>
<ValidatedField
component={TextField}
name="email"
validate={[required]}
/>
</Item>
<ItemOverrideAlert ml={1} vertical>
<Label required>Role</Label>
<ValidatedField
component={input => (
<Menu options={roles} {...input} placeholder="Please select" />
)}
name="role"
validate={[required]}
/>
</ItemOverrideAlert>
</Row>
<Row mb={2}>
<Item mr={1} vertical>
<Label>First Name</Label>
<ValidatedField component={TextField} name="firstName" />
</Item>
<Item ml={1} vertical>
<Label>Last Name</Label>
<ValidatedField component={TextField} name="lastName" />
</Item>
</Row>
<RowOverrideAlert alignItems="center" mb={2}>
<ItemOverrideAlert mr={1} vertical>
<Label>Title</Label>
<ValidatedField
component={input => (
<Menu options={titles} {...input} placeholder="Please select" />
)}
name="title"
/>
</ItemOverrideAlert>
<ItemOverrideAlert ml={1} vertical>
<Label>Country</Label>
<ValidatedField
component={input => (
<MenuCountry {...input} placeholder="Please select" />
)}
name="country"
/>
</ItemOverrideAlert>
</RowOverrideAlert>
<Row mb={3}>
<Item vertical>
<Label>Affiliation</Label>
<ValidatedField component={TextField} name="affiliation" />
</Item>
</Row>
</Fragment>
)
const EditForm = ({ titles }) => (
<Fragment>
<Row alignItems="center" mb={2} mt={1}>
<Item mr={1} vertical>
<Label>First Name</Label>
<ValidatedField component={TextField} name="firstName" />
</Item>
<Item ml={1} vertical>
<Label>Last Name</Label>
<ValidatedField component={TextField} name="lastName" />
</Item>
</Row>
<RowOverrideAlert alignItems="center" mb={2}>
<ItemOverrideAlert mr={1} vertical>
<Label>Title</Label>
<ValidatedField
component={input => (
<Menu options={titles} {...input} placeholder="Please select" />
)}
name="title"
/>
</ItemOverrideAlert>
<ItemOverrideAlert ml={1} vertical>
<Label>Country</Label>
<ValidatedField
component={input => (
<MenuCountry {...input} placeholder="Please select" />
)}
name="country"
/>
</ItemOverrideAlert>
</RowOverrideAlert>
<Row mb={2}>
<Item vertical>
<Label>Affiliation</Label>
<ValidatedField component={TextField} name="affiliation" />
</Item>
</Row>
<Row>
<Item>
<Label>Roles</Label>
</Item>
</Row>
<RowOverrideAlert mb={3} mt={1}>
<Item>
<ValidatedField
component={({ value, onChange }) => (
<Checkbox
checked={value}
label="Editor in Chief"
onChange={onChange}
value={value}
/>
)}
name="editorInChief"
/>
</Item>
<Item>
<ValidatedField
component={({ value, onChange }) => (
<Checkbox
checked={value}
label="Admin"
onChange={onChange}
value={value}
/>
)}
name="admin"
/>
</Item>
<Item>
<ValidatedField
component={({ value, onChange }) => (
<Checkbox
checked={value}
label="Handling Editor"
onChange={onChange}
value={value}
/>
)}
name="handlingEditor"
/>
</Item>
</RowOverrideAlert>
</Fragment>
)
import ValidatedMenuField from './ValidatedMenuField'
import ValidatedCheckboxField from './ValidatedCheckboxField'
const FormModal = ({
edit,
......@@ -187,41 +29,95 @@ const FormModal = ({
onClose,
subtitle,
onConfirm,
modalError,
isFetching,
handleSubmit,
countries,
confirmText = 'OK',
cancelText = 'Cancel',
onSubmit,
initialValues,
}) => (
<Root>
<IconButton icon="x" onClick={onClose} right={5} secondary top={5} />
<H2>{title}</H2>
{edit && <Text secondary>{user.email}</Text>}
{edit ? (
<EditForm titles={titles} />
) : (
<AddUserForm roles={roles} titles={titles} />
)}
{modalError && (
<Row mb={1}>
<Text error>{modalError}</Text>
</Row>
)}
<Row>
{isFetching ? (
<Spinner size={3} />
) : (
<Formik initialValues={initialValues} onSubmit={onSubmit}>
{({ handleSubmit }) => (
<Fragment>
<Button onClick={onClose}>{cancelText}</Button>
<Button onClick={handleSubmit} primary>
{confirmText}
</Button>
<Row alignItems="baseline" mb={1} mt={1}>
<Item mr={1} vertical>
<Label required>Email</Label>
<ValidatedFieldFormik
component={TextField}
name="email"
validate={[required]}
/>
</Item>
<ItemOverrideAlert ml={1} vertical>
<Label required>Role</Label>
<ValidatedMenuField name="role" options={roles} />
</ItemOverrideAlert>
</Row>
<Row mb={2}>
<Item mr={1} vertical>
<Label>First Name</Label>
<ValidatedFieldFormik component={TextField} name="firstName" />
</Item>
<Item ml={1} vertical>
<Label>Last Name</Label>
<ValidatedFieldFormik component={TextField} name="lastName" />
</Item>
</Row>
<RowOverrideAlert alignItems="center" mb={2}>
<ItemOverrideAlert mr={1} vertical>
<Label>Title</Label>
<ValidatedMenuField name="title" options={titles} />
</ItemOverrideAlert>
<ItemOverrideAlert ml={1} vertical>
<Label>Country</Label>
<ValidatedMenuField name="country" options={countries} />
</ItemOverrideAlert>
</RowOverrideAlert>
<Row mb={!edit && 3}>
<Item vertical>
<Label>Affiliation</Label>
<ValidatedFieldFormik component={TextField} name="affiliation" />
</Item>
</Row>
{edit && (
<RowOverrideAlert mb={3}>
<Item>
<ValidatedCheckboxField
label="Editor in Chief"
name="editorInChief"
/>
</Item>
<Item>
<ValidatedCheckboxField label="Admin" name="admin" />
</Item>
<Item>
<ValidatedCheckboxField
label="Handling Editor"
name="handlingEditor"
/>
</Item>
</RowOverrideAlert>
)}
<Row>
<Button onClick={onClose}>Cancel</Button>
<Button onClick={handleSubmit} primary>
{confirmText}
</Button>
</Row>
</Fragment>
)}
</Row>
</Formik>
</Root>
)
// #region FormHelpers
const setInitialRole = a => {
if (get(a, 'handlingEditor')) {
return 'handlingEditor'
......@@ -232,30 +128,41 @@ const setInitialRole = a => {
return 'author'
}
const parseValues = ({ email, role, ...rest }) => ({
email,
username: email,
admin: role === 'admin',
editorInChief: role === 'editorInChief',
handlingEditor: role === 'handlingEditor',
...rest,
})
// #endregion
export default compose(
withRoles,
withCountries,
withProps(({ user, edit }) => ({
initialValues: {
...user,
role: setInitialRole(user),
},
confirmText: edit ? 'EDIT USER' : 'SAVE USER',
title: edit ? 'Edit User' : 'Add User',
})),
withHandlers({
onConfirm: ({ onConfirm, ...props }) => () => {
if (onConfirm && typeof onConfirm === 'function') {
onConfirm(props)
onSubmit: ({ onSubmit, ...props }) => (values, formProps) => {
if (typeof onSubmit === 'function') {
onSubmit(parseValues(values), { formProps, props })
}
},
onClose: ({ onCancel, ...props }) => () => {
if (onCancel && typeof onCancel === 'function') {
if (typeof onCancel === 'function') {
onCancel(props)
}
props.hideModal()
},
}),
withProps(({ user, edit }) => ({
initialValues: {
...user,
role: setInitialRole(user),
},
confirmText: edit ? 'EDIT USER' : 'SAVE USER',
})),
reduxForm({
form: 'add-edit',
}),
setDisplayName('FormModal'),
)(FormModal)
......
packages/component-faraday-ui/src/modals/MyMenu.js 0 → 100644
+ 26
− 0
View file @ e7dd4cf4
import React, { Fragment } from 'react'
import { compose, withStateHandlers } from 'recompose'
const MyMenu = ({ open, toggleMenu, field, form }) => (
<div onClick={toggleMenu}>
Click to open
{open && (
<Fragment>
<span onClick={() => form.setFieldValue(field.name, 1)}>Option 1</span>
<span onClick={() => form.setFieldValue(field.name, 2)}>Option 2</span>
<span onClick={() => form.setFieldValue(field.name, 3)}>Option 3</span>
</Fragment>
)}
</div>
)
export default compose(
withStateHandlers(
{ open: false },
{
toggleMenu: ({ open }) => () => ({
open: !open,
}),
},
),
)(MyMenu)
packages/component-faraday-ui/src/modals/ValidatedCheckboxField.js 0 → 100644
+ 19
− 0
View file @ e7dd4cf4
import React from 'react'
import { Field } from 'formik'
import { Checkbox } from '@pubsweet/ui'
const ValidatedCheckboxField = ({ name, label }) => (
<Field name={name}>
{({ field, form }) => (
<Checkbox
checked={field.value}
label={label}
onChange={() => {
form.setFieldValue(field.name, !field.value)
}}
/>
)}
</Field>
)
export default ValidatedCheckboxField
packages/component-faraday-ui/src/modals/ValidatedMenuField.js 0 → 100644
+ 20
− 0
View file @ e7dd4cf4
import React from 'react'
import { Field } from 'formik'
import { Menu } from '@pubsweet/ui'
const ValidatedMenuField = ({ options, name }) => (
<Field name={name}>
{({ field, form }) => (
<Menu
onChange={v => {
// field.onChange(v)
form.setFieldValue(field.name, v)
}}
options={options}
value={field.value}
/>
)}
</Field>
)
export default ValidatedMenuField
packages/component-faraday-ui/src/pending/Accordion.js
+ 4
− 4
View file @ e7dd4cf4
......@@ -51,7 +51,7 @@ class Accordion extends React.Component {
} = this.props
const { expanded } = this.state
return (
<Root expanded={expanded} innerRef={r => (this._accordion = r)} {...rest}>
<Root expanded={expanded} ref={r => (this._accordion = r)} {...rest}>
<Header
expanded={expanded}
icon={icon}
......@@ -90,9 +90,9 @@ const Root = styled.div`
${override('ui.Accordion')};
`
const Header = styled.div.attrs({
'data-test-id': props => props['data-test-id'] || 'accordion-header',
})`
const Header = styled.div.attrs(props => ({
'data-test-id': props['data-test-id'] || 'accordion-header',
}))`
align-items: center;
cursor: pointer;
display: flex;
......
packages/component-faraday-ui/src/pending/ControlledAccordion.js
+ 4
− 4
View file @ e7dd4cf4
......@@ -42,7 +42,7 @@ class ControlledAccordion extends React.Component {
...rest
} = this.props
return (
<Root expanded={expanded} innerRef={r => (this._accordion = r)} {...rest}>
<Root expanded={expanded} ref={r => (this._accordion = r)} {...rest}>
<Header expanded={expanded} icon={icon} {...rest} />
{expanded && children}
</Root>
......@@ -62,9 +62,9 @@ const Root = styled.div`
${override('ui.Accordion')};
`
const Header = styled.div.attrs({
'data-test-id': props => props['data-test-id'] || 'accordion-header',
})`
const Header = styled.div.attrs(props => ({
'data-test-id': props['data-test-id'] || 'accordion-header',
}))`
align-items: center;
cursor: pointer;
display: flex;
......
packages/component-fixture-manager/package.json
+ 3
− 6
View file @ e7dd4cf4
......@@ -4,20 +4,17 @@
"description": "fixture service component for pubsweet",
"license": "MIT",
"author": "Collaborative Knowledge Foundation",
"files": [
"src"
],
"files": ["src"],
"main": "index.js",
"repository": {
"type": "git",
"url": "https://gitlab.coko.foundation/xpub/xpub-faraday",
"path": "component-fixture-service"
},
"dependencies": {
},
"dependencies": {},
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"pubsweet-server": "^1.0.1"
"pubsweet-server": "^10.0.0"
},
"publishConfig": {
"access": "public"
......
packages/component-helper-service/package.json
+ 1
− 1
View file @ e7dd4cf4
......@@ -17,7 +17,7 @@
},
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"pubsweet-server": "^1.0.1",
"pubsweet-server": "^10.0.0",
"@pubsweet/component-send-email": "0.2.4"
},
"publishConfig": {
......
packages/component-invite/package.json
+ 1
− 1
View file @ e7dd4cf4
......@@ -24,7 +24,7 @@
},
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"pubsweet-server": "^1.0.1",
"pubsweet-server": "^10.0.0",
"@pubsweet/component-send-email": "0.2.4"
},
"devDependencies": {
......
packages/component-manuscript-manager/package.json
+ 1
− 1
View file @ e7dd4cf4
......@@ -25,7 +25,7 @@
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"@pubsweet/component-send-email": "0.2.4",
"pubsweet-server": "^1.0.1",
"pubsweet-server": "^10.0.0",
"component-helper-service": "0.0.1"
},
"devDependencies": {
......
packages/component-manuscript/package.json
+ 2
− 2
View file @ e7dd4cf4
......@@ -11,8 +11,8 @@
"xpub-selectors": "^0.1.0"
},
"peerDependencies": {
"pubsweet-client": "^4.0.4",
"react": "^16.4.2",
"pubsweet-client": "^7.0.0",
"react": "^16.6.0",
"react-redux": ">=5.0.2",
"react-router-dom": ">=4.2.2"
}
......
packages/component-manuscript/src/components/EditorialComment.js
+ 2
− 2
View file @ e7dd4cf4
......@@ -79,7 +79,7 @@ const DefaultText = styled.span`
${defaultText};
`
const CommentAuthor = DefaultText.extend`
const CommentAuthor = styled(DefaultText)`
margin-left: calc(${th('subGridUnit')} * 2);
text-decoration: underline;
`
......@@ -103,7 +103,7 @@ const HeaderContainer = styled.div`
display: flex;
`
const ReasonText = DefaultText.extend`
const ReasonText = styled(DefaultText)`
font-family: ${th('fontHeading')};
font-weight: bold;
text-transform: uppercase;
......
packages/component-mts-package/package.json
+ 1
− 1
View file @ e7dd4cf4
......@@ -19,7 +19,7 @@
"license": "MIT",
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"pubsweet-server": "^1.0.1"
"pubsweet-server": "^10.0.0"
},
"devDependencies": {
"apidoc": "^0.17.6",
......
packages/component-publons/package.json
+ 1
− 1
View file @ e7dd4cf4
......@@ -24,7 +24,7 @@
},
"peerDependencies": {
"@pubsweet/logger": "^0.0.1",
"pubsweet-server": "^1.0.1"
"pubsweet-server": "^10.0.0"
},
"devDependencies": {
"apidoc": "^0.17.6",
......
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