From ddf9b67f9feaeb9df2bfbcd11e2e7b5f2bfc02e7 Mon Sep 17 00:00:00 2001
From: Bogdan Cochior <bogdan.cochior@thinslices.com>
Date: Thu, 15 Mar 2018 13:54:32 +0200
Subject: [PATCH] fix(users): map user roles accordingly - fix HIN-477
---
.../src/components/Admin/AdminUsers.js | 19 ++-
.../src/components/Admin/EditUserForm.js | 151 ++++++++++--------
.../src/components/Admin/utils.js | 4 +-
3 files changed, 95 insertions(+), 79 deletions(-)
diff --git a/packages/components-faraday/src/components/Admin/AdminUsers.js b/packages/components-faraday/src/components/Admin/AdminUsers.js
index 01fcf26ab..0970cde4a 100644
--- a/packages/components-faraday/src/components/Admin/AdminUsers.js
+++ b/packages/components-faraday/src/components/Admin/AdminUsers.js
@@ -1,5 +1,5 @@
import React from 'react'
-import { get } from 'lodash'
+import { get, isEqual } from 'lodash'
import { connect } from 'react-redux'
import styled, { withTheme } from 'styled-components'
import { Icon, Menu, th } from '@pubsweet/ui'
@@ -23,6 +23,8 @@ const TableRow = ({
lastName = '',
affiliation,
isConfirmed,
+ editorInChief,
+ admin,
roleOptions,
}) => (
<Row>
@@ -33,12 +35,9 @@ const TableRow = ({
<td>{`${firstName} ${lastName}`}</td>
<td>{affiliation}</td>
<td>
- {roles &&
- roles.map((r, i, arr) => (
- <Role key={r}>{`${roleOptions[r]}${
- i !== arr.length - 1 ? ', ' : ''
- }`}</Role>
- ))}
+ <Role>{`Author${isEqual(editorInChief, true) ? ', Editor in Chief' : ''}${
+ isEqual(admin, true) ? ', Admin' : ''
+ }`}</Role>
</td>
<td>
<Tag>{isConfirmed ? 'Confirmed' : 'Invited'}</Tag>
@@ -129,7 +128,7 @@ const Users = ({
<td>Email</td>
<td>Full name</td>
<td>Affiliation</td>
- <td width="200">Roles</td>
+ <td width="220">Roles</td>
<td>Status</td>
<td width="50" />
</tr>
@@ -297,12 +296,12 @@ const Tag = styled.span`
margin-right: calc(${th('subGridUnit')});
`
-const Role = styled.span`
- height: 17px;
+const Role = styled.div`
font-size: ${th('fontSizeBaseSmall')};
text-align: left;
color: ${th('colorPrimary')};
text-transform: uppercase;
+ line-height: 1.5;
`
const Action = styled(Link)`
diff --git a/packages/components-faraday/src/components/Admin/EditUserForm.js b/packages/components-faraday/src/components/Admin/EditUserForm.js
index 06cb09c44..ecbef0d9a 100644
--- a/packages/components-faraday/src/components/Admin/EditUserForm.js
+++ b/packages/components-faraday/src/components/Admin/EditUserForm.js
@@ -1,75 +1,92 @@
import React from 'react'
import styled from 'styled-components'
-import {
- ValidatedField,
- TextField,
- Menu,
- CheckboxGroup,
- th,
-} from '@pubsweet/ui'
+import { ValidatedField, TextField, Menu, Checkbox, th } from '@pubsweet/ui'
import { required } from 'xpub-validators'
-const EditUserForm = ({ roles, journal, user, error }) => {
- const roleOptions = roles.filter(r =>
- ['editorInChief', 'author', 'admin'].includes(r.value),
- )
- return (
- <div>
- <Title>Edit user</Title>
- <Subtitle>{user.email}</Subtitle>
- <Row>
- <RowItem>
- <Label> First name* </Label>
- <ValidatedField
- component={TextField}
- name="firstName"
- validate={[required]}
- />
- </RowItem>
- <RowItem>
- <Label> Last name* </Label>
- <ValidatedField
- component={TextField}
- name="lastName"
- validate={[required]}
- />
- </RowItem>
- </Row>
- <Row>
- <RowItem>
- <Label> Affiliation* </Label>
- <ValidatedField
- component={TextField}
- name="affiliation"
- validate={[required]}
- />
- </RowItem>
- <RowItem>
- <Label> Title* </Label>
- <ValidatedField
- component={input => <Menu {...input} options={journal.title} />}
- name="title"
- />
- </RowItem>
- </Row>
- <Row>
- <RowItem>
- <Label> Roles*</Label>
- <ValidatedField
- component={input => (
- <CheckboxGroup {...input} options={roleOptions} />
- )}
- name="roles"
- />
- </RowItem>
- </Row>
- <Row>
- <RowItem>{error && <ErrorMessage>{error}</ErrorMessage>}</RowItem>
- </Row>
- </div>
- )
-}
+const EditUserForm = ({ roles, journal, user, error }) => (
+ <div>
+ <Title>Edit user</Title>
+ <Subtitle>{user.email}</Subtitle>
+ <Row>
+ <RowItem>
+ <Label> First name* </Label>
+ <ValidatedField
+ component={TextField}
+ name="firstName"
+ validate={[required]}
+ />
+ </RowItem>
+ <RowItem>
+ <Label> Last name* </Label>
+ <ValidatedField
+ component={TextField}
+ name="lastName"
+ validate={[required]}
+ />
+ </RowItem>
+ </Row>
+ <Row>
+ <RowItem>
+ <Label> Affiliation* </Label>
+ <ValidatedField
+ component={TextField}
+ name="affiliation"
+ validate={[required]}
+ />
+ </RowItem>
+ <RowItem>
+ <Label> Title* </Label>
+ <ValidatedField
+ component={input => <Menu {...input} options={journal.title} />}
+ name="title"
+ />
+ </RowItem>
+ </Row>
+ <Row>
+ <RowItem>
+ <Label> Roles*</Label>
+ <ValidatedField
+ component={input => (
+ <Checkbox
+ checked
+ readonly
+ type="checkbox"
+ {...input}
+ label="Author"
+ />
+ )}
+ name="author"
+ />
+ <ValidatedField
+ component={input => (
+ <Checkbox
+ checked={input.value}
+ type="checkbox"
+ {...input}
+ label="Editor in Chief"
+ />
+ )}
+ name="editorInChief"
+ />
+ <ValidatedField
+ component={input => (
+ <Checkbox
+ checked={input.value}
+ type="checkbox"
+ {...input}
+ label="Admin"
+ />
+ )}
+ name="admin"
+ />
+ </RowItem>
+ </Row>
+ <Row>
+ <RowItem>{error && <ErrorMessage>{error}</ErrorMessage>}</RowItem>
+ </Row>
+ </div>
+)
export default EditUserForm
diff --git a/packages/components-faraday/src/components/Admin/utils.js b/packages/components-faraday/src/components/Admin/utils.js
index de7049e41..18d686787 100644
--- a/packages/components-faraday/src/components/Admin/utils.js
+++ b/packages/components-faraday/src/components/Admin/utils.js
@@ -23,8 +23,8 @@ export const parseUpdateUser = values => {
'title',
'roles',
'rev',
+ 'editorInChief',
]
- const newValues = setAdmin(values)
- return pick(newValues, valuesToSave)
+ return pick(values, valuesToSave)
}
--
GitLab