ConceptProd/ConceptPortal-public
1
0
Fork 0
mirror of https://github.com/IRBorisov/ConceptPortal.git synced 2025-06-25 20:40:36 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

F: Rework graph filter params dialog
Some checks are pending
Frontend CI / build (22.x) (push) Waiting to run
Details

Browse Source
This commit is contained in:
Ivan 2025-02-08 17:10:38 +03:00
parent ef209868bf
commit bc948eff0b
4 changed files with 82 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

148
rsconcept/frontend/src/dialogs/DlgGraphParams.tsx
View File

@ -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<GraphFilterParams>({
defaultValues: { ...params }
});
function onSubmit(data: GraphFilterParams) {
setParams(data);
}
return (
<ModalForm
canSubmit
header='Настройки графа термов'
onSubmit={handleSubmit}
onSubmit={event => void handleSubmit(onSubmit)(event)}
submitText='Применить'
className='flex gap-6 justify-between px-6 pb-3 w-[30rem]'
>
<div className='flex flex-col gap-1'>
<h1 className='mb-2'>Преобразования</h1>
<Checkbox
label='Скрыть текст'
title='Не отображать термины'
value={params.noText}
onChange={value => updateParams({ noText: value })}
<Controller
control={control}
name='noText'
render={({ field }) => <Checkbox {...field} label='Скрыть текст' title='Не отображать термины' />}
/>
<Checkbox
label='Скрыть несвязанные'
title='Неиспользуемые конституенты'
value={params.noHermits}
onChange={value => updateParams({ noHermits: value })}
<Controller
control={control}
name='noHermits'
render={({ field }) => <Checkbox {...field} label='Скрыть несвязанные' title='Неиспользуемые конституенты' />}
/>
<Checkbox
label='Скрыть шаблоны'
titleHtml='Терм-функции и предикат-функции <br/>с параметризованными аргументами'
value={params.noTemplates}
onChange={value => updateParams({ noTemplates: value })}
<Controller
control={control}
name='noTemplates'
render={({ field }) => (
<Checkbox
{...field}
label='Скрыть шаблоны'
titleHtml='Терм-функции и предикат-функции <br/>с параметризованными аргументами'
/>
)}
/>
<Checkbox
label='Транзитивная редукция'
titleHtml='Удалить связи, образующие <br/>транзитивные пути в графе'
value={params.noTransitive}
onChange={value => updateParams({ noTransitive: value })}
<Controller
control={control}
name='noTransitive'
render={({ field }) => (
<Checkbox
{...field}
label='Транзитивная редукция'
titleHtml='Удалить связи, образующие <br/>транзитивные пути в графе'
/>
)}
/>
<Checkbox
label='Свернуть порожденные'
title='Не отображать порожденные понятия'
value={params.foldDerived}
onChange={value => updateParams({ foldDerived: value })}
<Controller
control={control}
name='foldDerived'
render={({ field }) => (
<Checkbox {...field} label='Свернуть порожденные' title='Не отображать порожденные понятия' />
)}
/>
</div>
<div className='flex flex-col gap-1'>
<h1 className='mb-2'>Типы конституент</h1>
<Checkbox
label={labelCstType(CstType.BASE)}
value={params.allowBase}
onChange={value => updateParams({ allowBase: value })}
<Controller
control={control}
name='allowBase'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.BASE)} />}
/>
<Checkbox
label={labelCstType(CstType.STRUCTURED)}
value={params.allowStruct}
onChange={value => updateParams({ allowStruct: value })}
<Controller
control={control}
name='allowStruct'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.STRUCTURED)} />}
/>
<Checkbox
label={labelCstType(CstType.TERM)}
value={params.allowTerm}
onChange={value => updateParams({ allowTerm: value })}
<Controller
control={control}
name='allowTerm'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.TERM)} />}
/>
<Checkbox
label={labelCstType(CstType.AXIOM)}
value={params.allowAxiom}
onChange={value => updateParams({ allowAxiom: value })}
<Controller
control={control}
name='allowAxiom'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.AXIOM)} />}
/>
<Checkbox
label={labelCstType(CstType.FUNCTION)}
value={params.allowFunction}
onChange={value => updateParams({ allowFunction: value })}
<Controller
control={control}
name='allowFunction'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.FUNCTION)} />}
/>
<Checkbox
label={labelCstType(CstType.PREDICATE)}
value={params.allowPredicate}
onChange={value => updateParams({ allowPredicate: value })}
<Controller
control={control}
name='allowPredicate'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.PREDICATE)} />}
/>
<Checkbox
label={labelCstType(CstType.CONSTANT)}
value={params.allowConstant}
onChange={value => updateParams({ allowConstant: value })}
<Controller
control={control}
name='allowConstant'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.CONSTANT)} />}
/>
<Checkbox
label={labelCstType(CstType.THEOREM)}
value={params.allowTheorem}
onChange={value => updateParams({ allowTheorem: value })}
<Controller
control={control}
name='allowTheorem'
render={({ field }) => <Checkbox {...field} label={labelCstType(CstType.THEOREM)} />}
/>
</div>
</ModalForm>

1
rsconcept/frontend/src/dialogs/DlgRenameCst.tsx
View File

@ -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 });
}

4
rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TGFlow.tsx
View File

@ -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() {
<ToolbarTermGraph
noText={filter.noText}
foldDerived={filter.foldDerived}
showParamsDialog={() => showParams({ initial: filter, onConfirm: setFilter })}
showParamsDialog={() => showParams()}
onCreate={handleCreateCst}
onDelete={handleDeleteCst}
onFitView={() => setToggleResetView(prev => !prev)}

5
rsconcept/frontend/src/stores/dialogs.ts
View File

@ -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<DialogsStore>()(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 }),