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 <42037741+mr-anton-t@users.noreply.github.com>
This commit is contained in:
sergeyteleshev
2024-09-16 14:22:28 +03:00
committed by GitHub
co-authored by mr-anton-t
parent d2b6734dd3
commit 6e575d3e7e
2 changed files with 30 additions and 13 deletions
@@ -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>
@@ -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;
}