From bc948eff0b67d957f6a5d428623581c4656145ef Mon Sep 17 00:00:00 2001 From: Ivan <8611739+IRBorisov@users.noreply.github.com> Date: Sat, 8 Feb 2025 17:10:38 +0300 Subject: [PATCH] F: Rework graph filter params dialog --- .../frontend/src/dialogs/DlgGraphParams.tsx | 148 +++++++++--------- .../frontend/src/dialogs/DlgRenameCst.tsx | 1 - .../RSFormPage/EditorTermGraph/TGFlow.tsx | 4 +- rsconcept/frontend/src/stores/dialogs.ts | 5 +- 4 files changed, 82 insertions(+), 76 deletions(-) diff --git a/rsconcept/frontend/src/dialogs/DlgGraphParams.tsx b/rsconcept/frontend/src/dialogs/DlgGraphParams.tsx index e0c59740..4a6e8c9d 100644 --- a/rsconcept/frontend/src/dialogs/DlgGraphParams.tsx +++ b/rsconcept/frontend/src/dialogs/DlgGraphParams.tsx @@ -1,109 +1,117 @@ 'use client'; +import { Controller, useForm } from 'react-hook-form'; + import { Checkbox } from '@/components/ui/Input'; import { ModalForm } from '@/components/ui/Modal'; -import usePartialUpdate from '@/hooks/usePartialUpdate'; import { GraphFilterParams } from '@/models/miscellaneous'; import { CstType } from '@/models/rsform'; -import { useDialogsStore } from '@/stores/dialogs'; +import { useTermGraphStore } from '@/stores/termGraph'; import { labelCstType } from '@/utils/labels'; -export interface DlgGraphParamsProps { - initial: GraphFilterParams; - onConfirm: (params: GraphFilterParams) => void; -} - function DlgGraphParams() { - const { initial, onConfirm } = useDialogsStore(state => state.props as DlgGraphParamsProps); - const [params, updateParams] = usePartialUpdate(initial); + const params = useTermGraphStore(state => state.filter); + const setParams = useTermGraphStore(state => state.setFilter); - function handleSubmit() { - onConfirm(params); - return true; + const { handleSubmit, control } = useForm({ + defaultValues: { ...params } + }); + + function onSubmit(data: GraphFilterParams) { + setParams(data); } return ( void handleSubmit(onSubmit)(event)} submitText='Применить' className='flex gap-6 justify-between px-6 pb-3 w-[30rem]' >

Преобразования

- updateParams({ noText: value })} + } /> - updateParams({ noHermits: value })} + } /> - updateParams({ noTemplates: value })} + ( + + )} /> - updateParams({ noTransitive: value })} + ( + + )} /> - updateParams({ foldDerived: value })} + ( + + )} />

Типы конституент

- updateParams({ allowBase: value })} + } /> - updateParams({ allowStruct: value })} + } /> - updateParams({ allowTerm: value })} + } /> - updateParams({ allowAxiom: value })} + } /> - updateParams({ allowFunction: value })} + } /> - updateParams({ allowPredicate: value })} + } /> - updateParams({ allowConstant: value })} + } /> - updateParams({ allowTheorem: value })} + } />
diff --git a/rsconcept/frontend/src/dialogs/DlgRenameCst.tsx b/rsconcept/frontend/src/dialogs/DlgRenameCst.tsx index 4068cc3f..08c3b76b 100644 --- a/rsconcept/frontend/src/dialogs/DlgRenameCst.tsx +++ b/rsconcept/frontend/src/dialogs/DlgRenameCst.tsx @@ -39,7 +39,6 @@ function DlgRenameCst() { const validated = alias !== target.alias && validateNewAlias(alias, cst_type, schema); function onSubmit(data: ICstRenameDTO) { - console.log(data); cstRename({ itemID: schema.id, data: data }); } diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx index 72ef3306..3c533f56 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx @@ -152,7 +152,7 @@ function TGFlow() { useEffect(() => { setNeedReset(true); - }, [controller.schema, filter.noText, focusCst, coloring, flow.viewportInitialized]); + }, [controller.schema, focusCst, coloring, filter]); useEffect(() => { if (!needReset || !flow.viewportInitialized) { @@ -286,7 +286,7 @@ function TGFlow() { showParams({ initial: filter, onConfirm: setFilter })} + showParamsDialog={() => showParams()} onCreate={handleCreateCst} onDelete={handleDeleteCst} onFitView={() => setToggleResetView(prev => !prev)} diff --git a/rsconcept/frontend/src/stores/dialogs.ts b/rsconcept/frontend/src/stores/dialogs.ts index c45af1db..2b2bf779 100644 --- a/rsconcept/frontend/src/stores/dialogs.ts +++ b/rsconcept/frontend/src/stores/dialogs.ts @@ -14,7 +14,6 @@ import { DlgEditOperationProps } from '@/dialogs/DlgEditOperation/DlgEditOperati import { DlgEditReferenceProps } from '@/dialogs/DlgEditReference/DlgEditReference'; import { DlgEditVersionsProps } from '@/dialogs/DlgEditVersions/DlgEditVersions'; import { DlgEditWordFormsProps } from '@/dialogs/DlgEditWordForms/DlgEditWordForms'; -import { DlgGraphParamsProps } from '@/dialogs/DlgGraphParams'; import { DlgInlineSynthesisProps } from '@/dialogs/DlgInlineSynthesis/DlgInlineSynthesis'; import { DlgRelocateConstituentsProps } from '@/dialogs/DlgRelocateConstituents'; import { DlgRenameCstProps } from '@/dialogs/DlgRenameCst'; @@ -47,7 +46,7 @@ interface DialogsStore { showCloneLibraryItem: (props: DlgCloneLibraryItemProps) => void; showCreateVersion: (props: DlgCreateVersionProps) => void; showDeleteOperation: (props: DlgDeleteOperationProps) => void; - showGraphParams: (props: DlgGraphParamsProps) => void; + showGraphParams: () => void; showRelocateConstituents: (props: DlgRelocateConstituentsProps) => void; showRenameCst: (props: DlgRenameCstProps) => void; showQR: (props: DlgShowQRProps) => void; @@ -77,7 +76,7 @@ export const useDialogsStore = create()(set => ({ showCloneLibraryItem: props => set({ active: DialogType.CLONE_LIBRARY_ITEM, props: props }), showCreateVersion: props => set({ active: DialogType.CREATE_VERSION, props: props }), showDeleteOperation: props => set({ active: DialogType.DELETE_OPERATION, props: props }), - showGraphParams: props => set({ active: DialogType.GRAPH_PARAMETERS, props: props }), + showGraphParams: () => set({ active: DialogType.GRAPH_PARAMETERS, props: undefined }), showRelocateConstituents: props => set({ active: DialogType.RELOCATE_CONSTITUENTS, props: props }), showRenameCst: props => set({ active: DialogType.RENAME_CONSTITUENTA, props: props }), showQR: props => set({ active: DialogType.SHOW_QR_CODE, props: props }),