CB-5478 Add an ability to new forms to edit formState id (#2885)

* CB-5478 adds useAdministrationUserFormState with flexible id field * CB-5478 simplifies logic fork form state hooks --------- Co-authored-by: mr-anton-t <[email protected]>
dbeaver · Sep 16, 2024 · 6e575d3 · 6e575d3
1 parent d2b6734
commit 6e575d3
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 13 deletions.
diff --git a/...ges/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx b/...ges/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<TableItemExpandProps<string>>(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 (
     <Container className={s(styles, { box: true })} parent vertical>

diff --git a/...tion-administration/src/Administration/Users/UsersTable/useAdministrationUserFormState.ts b/...tion-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 | AdministrationUserFormState>(null);
+
+  if (ref.current?.id !== id) {
+    ref.current = new AdministrationUserFormState(serviceProvider, service, {
+      userId: id,
+    });
+    configure?.(ref.current);
+  }
+
+  return ref.current;
+}