diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx index f61bae0f5a..a02db324e6 100644 --- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx @@ -6,28 +6,17 @@ * you may not use this file except in compliance with the License. */ import { observer } from 'mobx-react-lite'; -import { useState } from 'react'; import { Container, Loader, s, TableItemExpandProps, useS } from '@cloudbeaver/core-blocks'; -import { IServiceProvider, useService } from '@cloudbeaver/core-di'; import { FormMode } from '@cloudbeaver/core-ui'; import { AdministrationUserForm } from '../UserForm/AdministrationUserForm'; -import { AdministrationUserFormService } from '../UserForm/AdministrationUserFormService'; -import { AdministrationUserFormState } from '../UserForm/AdministrationUserFormState'; +import { useAdministrationUserFormState } from './useAdministrationUserFormState'; import style from './UserEdit.module.css'; export const UserEdit = observer>(function UserEdit({ item, onClose }) { const styles = useS(style); - const administrationUserFormService = useService(AdministrationUserFormService); - const serviceProvider = useService(IServiceProvider); - const [state] = useState(() => { - const state = new AdministrationUserFormState(serviceProvider, administrationUserFormService, { - userId: item, - }); - state.setMode(FormMode.Edit); - return state; - }); + const state = useAdministrationUserFormState(item, state => state.setMode(FormMode.Edit)); return ( diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/useAdministrationUserFormState.ts b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/useAdministrationUserFormState.ts new file mode 100644 index 0000000000..65d15e83ba --- /dev/null +++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/useAdministrationUserFormState.ts @@ -0,0 +1,28 @@ +/* + * CloudBeaver - Cloud Database Manager + * Copyright (C) 2020-2024 DBeaver Corp and others + * + * Licensed under the Apache License, Version 2.0. + * you may not use this file except in compliance with the License. + */ +import { useRef } from 'react'; + +import { IServiceProvider, useService } from '@cloudbeaver/core-di'; + +import { AdministrationUserFormService } from '../UserForm/AdministrationUserFormService'; +import { AdministrationUserFormState } from '../UserForm/AdministrationUserFormState'; + +export function useAdministrationUserFormState(id: string | null, configure?: (state: AdministrationUserFormState) => any) { + const service = useService(AdministrationUserFormService); + const serviceProvider = useService(IServiceProvider); + const ref = useRef(null); + + if (ref.current?.id !== id) { + ref.current = new AdministrationUserFormState(serviceProvider, service, { + userId: id, + }); + configure?.(ref.current); + } + + return ref.current; +}