From abd51ea42535edd5bcf577fc03fd6ba49c992472 Mon Sep 17 00:00:00 2001 From: Wroud Date: Sat, 30 May 2020 18:14:32 +0300 Subject: [PATCH] chore(authentication): some improvements CB-109 --- .../packages/authentication/locales/en.json | 5 +- .../packages/authentication/locales/ru.json | 5 +- .../CreateUserDialog/CreateUserDialog.tsx | 41 +++++++++--- .../CreateUserDialogController.ts | 21 +++--- .../CreateUserDialogFooter.tsx | 15 +++++ .../NotificationsItem/Snackbar/Snackbar.tsx | 2 +- webapp/packages/core/src/blocks/Checkbox.tsx | 67 +++++++++++++++++++ .../packages/core/src/blocks/InputField.tsx | 2 +- webapp/packages/core/src/blocks/index.ts | 1 + 9 files changed, 136 insertions(+), 23 deletions(-) create mode 100644 webapp/packages/core/src/blocks/Checkbox.tsx diff --git a/webapp/packages/authentication/locales/en.json b/webapp/packages/authentication/locales/en.json index b616fe5737..cd3bd8728f 100644 --- a/webapp/packages/authentication/locales/en.json +++ b/webapp/packages/authentication/locales/en.json @@ -4,5 +4,8 @@ "authentication_create_user_dialog_create": "Create", "authentication_user_name": "User name", "authentication_user_password": "User password", - "authentication_user_role": "User role" + "authentication_user_password_repeat": "Repeat password", + "authentication_user_role": "User role", + "authentication_user_passwords_not_match": "Passwords don't match", + "authentication_user_user_created": "User was created successfully" } \ No newline at end of file diff --git a/webapp/packages/authentication/locales/ru.json b/webapp/packages/authentication/locales/ru.json index c711def40c..60468d55eb 100644 --- a/webapp/packages/authentication/locales/ru.json +++ b/webapp/packages/authentication/locales/ru.json @@ -4,5 +4,8 @@ "authentication_create_user_dialog_create": "Создать", "authentication_user_name": "Имя", "authentication_user_password": "Пароль", - "authentication_user_role": "Роль" + "authentication_user_password_repeat": "Повторите пароль", + "authentication_user_role": "Роль", + "authentication_user_passwords_not_match": "Пароли не совпадают", + "authentication_user_user_created": "Пользователь создан успешно" } \ No newline at end of file diff --git a/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialog.tsx b/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialog.tsx index 4e3b534e7e..b20675d940 100644 --- a/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialog.tsx +++ b/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialog.tsx @@ -11,7 +11,7 @@ import { useCallback } from 'react'; import styled, { css } from 'reshadow'; import { - SubmittingForm, ErrorMessage, InputField + SubmittingForm, ErrorMessage, InputField, Checkbox } from '@dbeaver/core/blocks'; import { useController } from '@dbeaver/core/di'; import { DialogComponent, CommonDialogWrapper } from '@dbeaver/core/dialogs'; @@ -37,7 +37,6 @@ const styles = composes( } SubmittingForm { overflow: auto; - margin: auto; margin-top: 20px; margin-bottom: 20px; } @@ -47,9 +46,13 @@ const styles = composes( flex-direction: column; } create-form { + flex: 2; flex-direction: column; padding: 18px 24px; } + fill { + flex: 1; + } ErrorMessage { position: sticky; bottom: 0; @@ -70,8 +73,12 @@ export const CreateUserDialog: DialogComponent = observer( (value: string) => controller.credentials.password = value, [] ); + const handlePasswordRepeatChange = useCallback( + (value: string) => controller.credentials.passwordRepeat = value, + [] + ); const handleRoleChange = useCallback( - (value: string) => controller.credentials.roles = value, + (roleId: string, value: boolean) => controller.credentials.roles.set(roleId, value), [] ); @@ -82,6 +89,7 @@ export const CreateUserDialog: DialogComponent = observer( footer={( )} @@ -115,18 +123,33 @@ export const CreateUserDialog: DialogComponent = observer( - {translate('authentication_user_role')} + {translate('authentication_user_password_repeat')} + {controller.roles.map((role, i) => ( + + handleRoleChange(role.roleId, checked)} + checked={controller.credentials.roles.get(role.roleId)} + disabled={controller.isCreating} + mod='surface' + > + {i === 0 && translate('authentication_user_role')} + + + ))} + {controller.error.responseMessage && ( (), }; @computed get roles() { - return this.rolesManagerService.roles.data.map(role => role.roleId); + return this.rolesManagerService.roles.data; } readonly error = new GQLErrorCatcher(); private isDistructed = false; @@ -54,6 +55,10 @@ export class CreateUserDialogController implements IInitializableController, IDe if (this.isCreating) { return; } + if (this.credentials.password !== this.credentials.passwordRepeat) { + this.notificationService.logError({ title: 'authentication_user_passwords_not_match' }); + return; + } this.isCreating = true; let isUserCreated = false; @@ -61,17 +66,13 @@ export class CreateUserDialogController implements IInitializableController, IDe const user = await this.usersManagerService.create(this.credentials.login, false); isUserCreated = !!user; await this.usersManagerService.updateCredentials(user.userId, { password: this.credentials.password }); - if (this.credentials.roles) { - const roles = this.credentials.roles - .trim() - .replace(/\s+/g, ' ') - .split(' '); - - for (const role of roles) { - await this.usersManagerService.grantRole(user.userId, role); + for (const [roleId, checked] of this.credentials.roles) { + if (checked) { + await this.usersManagerService.grantRole(user.userId, roleId); } } await this.usersManagerService.users.refresh(user.userId); + this.notificationService.logInfo({ title: 'authentication_user_user_created' }); this.close(); } catch (exception) { if (isUserCreated) { diff --git a/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialogFooter.tsx b/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialogFooter.tsx index a85f5677ff..f43f745195 100644 --- a/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialogFooter.tsx +++ b/webapp/packages/authentication/src/Administration/Users/CreateUserDialog/CreateUserDialogFooter.tsx @@ -21,22 +21,37 @@ const styles = css` margin: auto; justify-content: flex-end; } + + fill { + flex: 1; + } `; export type Props = { isCreating: boolean; + onCancel(): void; onCreate(): void; } export const CreateUserDialogFooter = observer( function CreateUserDialogFooter({ isCreating, + onCancel, onCreate, }: Props) { const translate = useTranslate(); return styled(styles)( + +