Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Regression: Custom roles displaying ID instead of name on some admin screens #24999

Merged
merged 5 commits into from
Mar 31, 2022
Merged

Regression: Custom roles displaying ID instead of name on some admin screens #24999

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
2798524
Regression: Custom roles displaying ID instead of name on admin screens
pierre-lehnen-rc Mar 31, 2022
ad7fbab
fix: missing NewRolePage role name validation
dougfabris Mar 31, 2022
c282329
Update client/views/admin/users/AddUser.js
pierre-lehnen-rc Mar 31, 2022
0a8adf8
filter
pierre-lehnen-rc Mar 31, 2022
53bf5dc
prettier
pierre-lehnen-rc Mar 31, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 7 additions & 2 deletions client/views/admin/permissions/NewRolePage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { Box, ButtonGroup, Button, Margins } from '@rocket.chat/fuselage';
import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
import React from 'react';
import React, { useState } from 'react';

import VerticalBar from '../../../components/VerticalBar';
import { useRoute } from '../../../contexts/RouterContext';
Expand All @@ -14,6 +14,7 @@ const NewRolePage = () => {
const t = useTranslation();
const router = useRoute('admin-permissions');
const dispatchToastMessage = useToastMessageDispatch();
const [errors, setErrors] = useState();

const { values, handlers } = useForm({
name: '',
Expand All @@ -25,6 +26,10 @@ const NewRolePage = () => {
const saveRole = useEndpoint('POST', 'roles.create');

const handleSave = useMutableCallback(async () => {
if (values.name === '') {
return setErrors({ name: t('error-the-field-is-required', { field: t('Role') }) });
}

try {
await saveRole(values);
dispatchToastMessage({ type: 'success', message: t('Saved') });
Expand All @@ -39,7 +44,7 @@ const NewRolePage = () => {
<VerticalBar.ScrollableContent>
<Box w='full' alignSelf='center' mb='neg-x8'>
<Margins block='x8'>
<RoleForm values={values} handlers={handlers} />
<RoleForm values={values} handlers={handlers} errors={errors} />
</Margins>
</Box>
</VerticalBar.ScrollableContent>
Expand Down
3 changes: 2 additions & 1 deletion client/views/admin/permissions/RoleForm.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import React, { useMemo } from 'react';

import { useTranslation } from '../../../contexts/TranslationContext';

const RoleForm = ({ values, handlers, className, editing = false, isProtected = false }) => {
const RoleForm = ({ values, handlers, className, errors, editing = false, isProtected = false }) => {
const t = useTranslation();

const { name, description, scope, mandatory2fa } = values;
Expand All @@ -25,6 +25,7 @@ const RoleForm = ({ values, handlers, className, editing = false, isProtected =
<Field.Row>
<TextInput disabled={editing} value={name} onChange={handleName} placeholder={t('Role')} />
</Field.Row>
<Field.Error>{errors?.name}</Field.Error>
</Field>
<Field className={className}>
<Field.Label>{t('Description')}</Field.Label>
Expand Down
2 changes: 1 addition & 1 deletion client/views/admin/users/AddUser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ export function AddUser({ roles, onReload, ...props }) {
}
});

const availableRoles = useMemo(() => roleData?.roles?.map(({ _id, description }) => [_id, description || _id]) ?? [], [roleData]);
const availableRoles = useMemo(() => roleData?.roles?.map(({ _id, description, name }) => [_id, description || name]) ?? [], [roleData]);

const append = useMemo(
() => (
Expand Down
8 changes: 7 additions & 1 deletion client/views/admin/users/UserRow.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { Box, Table } from '@rocket.chat/fuselage';
import { capitalize } from '@rocket.chat/string-helpers';
import React from 'react';

import { Roles } from '../../../../app/models/client';
import UserAvatar from '../../../components/avatar/UserAvatar';
import { useTranslation } from '../../../contexts/TranslationContext';

Expand All @@ -15,6 +16,11 @@ const UserRow = ({ emails, _id, username, name, roles, status, avatarETag, onCli
const t = useTranslation();

const statusText = active ? t(capitalize(status)) : t('Disabled');
const roleNames = (roles || [])
.map((roleId) => Roles.findOne(roleId, { fields: { name: 1 } })?.name)
.filter((roleName) => !!roleName)
.join(', ');

return (
<Table.Row onKeyDown={onClick(_id)} onClick={onClick(_id)} tabIndex={0} role='link' action qa-user-id={_id}>
<Table.Cell style={style}>
Expand Down Expand Up @@ -44,7 +50,7 @@ const UserRow = ({ emails, _id, username, name, roles, status, avatarETag, onCli
</Table.Cell>
)}
<Table.Cell style={style}>{emails && emails.length && emails[0].address}</Table.Cell>
{mediaQuery && <Table.Cell style={style}>{roles && roles.join(', ')}</Table.Cell>}
{mediaQuery && <Table.Cell style={style}>{roleNames}</Table.Cell>}
<Table.Cell fontScale='p2' color='hint' style={style}>
{statusText}
</Table.Cell>
Expand Down