External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-11 10:00:01 -03:30
Code Issues Packages Projects Releases Wiki Activity

Add type column to users list

Browse Source 
Add type column to users list. Also, update `UserListItem` to be a
functional component.

See: https://github.com/ansible/awx/issues/5684
This commit is contained in:
nixocio 2020-08-16 14:57:00 -04:00
parent a659b9d994
commit 8402cf97de
2 changed files with 89 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

147
awx/ui_next/src/screens/User/UserList/UserListItem.jsx
View File

@ -19,72 +19,89 @@ import DataListCell from '../../../components/DataListCell';
import { User } from '../../../types';
class UserListItem extends React.Component {
static propTypes = {
user: User.isRequired,
detailUrl: string.isRequired,
isSelected: bool.isRequired,
onSelect: func.isRequired,
};
function UserListItem({ user, isSelected, onSelect, detailUrl, i18n }) {
const labelId = `check-action-${user.id}`;
render() {
const { user, isSelected, onSelect, detailUrl, i18n } = this.props;
const labelId = `check-action-${user.id}`;
return (
<DataListItem key={user.id} aria-labelledby={labelId} id={`${user.id}`}>
<DataListItemRow>
<DataListCheck
id={`select-user-${user.id}`}
checked={isSelected}
onChange={onSelect}
aria-labelledby={labelId}
/>
<DataListItemCells
dataListCells={[
<DataListCell key="username">
<Link to={`${detailUrl}`} id={labelId}>
<b>{user.username}</b>
</Link>
</DataListCell>,
<DataListCell key="first-name">
{user.first_name && (
<Fragment>
<b css="margin-right: 24px">{i18n._(t`First Name`)}</b>
{user.first_name}
</Fragment>
)}
</DataListCell>,
<DataListCell key="last-name">
{user.last_name && (
<Fragment>
<b css="margin-right: 24px">{i18n._(t`Last Name`)}</b>
{user.last_name}
</Fragment>
)}
</DataListCell>,
]}
/>
<DataListAction
aria-label="actions"
aria-labelledby={labelId}
id={labelId}
>
{user.summary_fields.user_capabilities.edit && (
<Tooltip content={i18n._(t`Edit User`)} position="top">
<Button
aria-label={i18n._(t`Edit User`)}
variant="plain"
component={Link}
to={`/users/${user.id}/edit`}
>
<PencilAltIcon />
</Button>
</Tooltip>
)}
</DataListAction>
</DataListItemRow>
</DataListItem>
);
let user_type;
if (user.is_superuser) {
user_type = i18n._(t`System Administrator`);
} else if (user.is_system_auditor) {
user_type = i18n._(t`System Auditor`);
} else {
user_type = i18n._(t`Normal User`);
}
return (
<DataListItem key={user.id} aria-labelledby={labelId} id={`${user.id}`}>
<DataListItemRow>
<DataListCheck
id={`select-user-${user.id}`}
checked={isSelected}
onChange={onSelect}
aria-labelledby={labelId}
/>
<DataListItemCells
dataListCells={[
<DataListCell key="username" aria-label={i18n._(t`username`)}>
<Link to={`${detailUrl}`} id={labelId}>
<b>{user.username}</b>
</Link>
</DataListCell>,
<DataListCell
key="first-name"
aria-label={i18n._(t`user first name`)}
>
{user.first_name && (
<Fragment>
<b css="margin-right: 24px">{i18n._(t`First Name`)}</b>
{user.first_name}
</Fragment>
)}
</DataListCell>,
<DataListCell
key="last-name"
aria-label={i18n._(t`user last name`)}
>
{user.last_name && (
<Fragment>
<b css="margin-right: 24px">{i18n._(t`Last Name`)}</b>
{user.last_name}
</Fragment>
)}
</DataListCell>,
<DataListCell key="user-type" aria-label={i18n._(t`user type`)}>
{user_type}
</DataListCell>,
]}
/>
<DataListAction
aria-label="actions"
aria-labelledby={labelId}
id={labelId}
>
{user.summary_fields.user_capabilities.edit && (
<Tooltip content={i18n._(t`Edit User`)} position="top">
<Button
aria-label={i18n._(t`Edit User`)}
variant="plain"
component={Link}
to={`/users/${user.id}/edit`}
>
<PencilAltIcon />
</Button>
</Tooltip>
)}
</DataListAction>
</DataListItemRow>
</DataListItem>
);
}
UserListItem.prototype = {
user: User.isRequired,
detailUrl: string.isRequired,
isSelected: bool.isRequired,
onSelect: func.isRequired,
};
export default withI18n()(UserListItem);

8
awx/ui_next/src/screens/User/UserList/UserListItem.test.jsx
View File

@ -28,12 +28,18 @@ describe('UserListItem with full permissions', () => {
</I18nProvider>
);
});
test('initially renders succesfully', () => {
test('initially renders successfully', () => {
expect(wrapper.length).toBe(1);
});
test('edit button shown to users with edit capabilities', () => {
expect(wrapper.find('PencilAltIcon').exists()).toBeTruthy();
});
test('should display user type', () => {
expect(
wrapper.find('DataListCell[aria-label="user type"]').prop('children')
).toEqual('System Administrator');
});
});
describe('UserListItem without full permissions', () => {