R: Apply withPreventDefault utility

This commit is contained in:
Ivan 2025-07-08 12:37:08 +03:00
parent 022041881b
commit b62797205b
7 changed files with 84 additions and 107 deletions

View File

@ -5,6 +5,8 @@ import { Background, ReactFlow, type ReactFlowProps } from 'reactflow';
export { useReactFlow, useStoreApi } from 'reactflow';
import { withPreventDefault } from '@/utils/utils';
import { cn } from '../utils';
type DiagramFlowProps = {
@ -48,9 +50,7 @@ export function DiagramFlow({
function handleKeyDown(event: React.KeyboardEvent<HTMLDivElement>) {
if (event.code === 'Space') {
event.preventDefault();
event.stopPropagation();
setSpaceMode(true);
withPreventDefault(() => setSpaceMode(true))(event);
}
onKeyDown?.(event);
}

View File

@ -9,6 +9,7 @@ import { useDialogsStore } from '@/stores/dialogs';
import { usePreferencesStore } from '@/stores/preferences';
import { PARAMETER } from '@/utils/constants';
import { promptText } from '@/utils/labels';
import { withPreventDefault } from '@/utils/utils';
import { useDeleteBlock } from '../../../backend/use-delete-block';
import { useMutatingOss } from '../../../backend/use-mutating-oss';
@ -149,36 +150,26 @@ export function OssFlow() {
return;
}
if (event.key === 'Escape') {
event.preventDefault();
event.stopPropagation();
resetSelectedElements();
withPreventDefault(resetSelectedElements)(event);
return;
}
if (!isMutable) {
return;
}
if ((event.ctrlKey || event.metaKey) && event.code === 'KeyS') {
event.preventDefault();
event.stopPropagation();
handleSavePositions();
withPreventDefault(handleSavePositions)(event);
return;
}
if (event.altKey && event.code === 'Key1') {
event.preventDefault();
event.stopPropagation();
handleCreateBlock();
withPreventDefault(handleCreateBlock)(event);
return;
}
if (event.altKey && event.code === 'Key2') {
event.preventDefault();
event.stopPropagation();
handleCreateOperation();
withPreventDefault(handleCreateOperation)(event);
return;
}
if (event.key === 'Delete') {
event.preventDefault();
event.stopPropagation();
handleDeleteSelected();
withPreventDefault(handleDeleteSelected)(event);
return;
}
}

View File

@ -18,6 +18,7 @@ import { usePreferencesStore } from '@/stores/preferences';
import { APP_COLORS } from '@/styling/colors';
import { CodeMirrorWrapper } from '@/utils/codemirror';
import { PARAMETER } from '@/utils/constants';
import { withPreventDefault } from '@/utils/utils';
import { type IReferenceInputState } from '../../dialogs/dlg-edit-reference/dlg-edit-reference';
import { ReferenceType } from '../../models/language';
@ -117,16 +118,7 @@ export const RefsInput = forwardRef<ReactCodeMirrorRef, RefsInputInputProps>(
if (onBlur) onBlur(event);
}
function handleInput(event: React.KeyboardEvent<HTMLDivElement>) {
if (!thisRef.current?.view) {
event.preventDefault();
event.stopPropagation();
return;
}
if ((event.ctrlKey || event.metaKey) && event.code === 'Space') {
event.preventDefault();
event.stopPropagation();
function onEditRef() {
const wrap = new CodeMirrorWrapper(thisRef.current as Required<ReactCodeMirrorRef>);
wrap.fixSelection(ReferenceTokens);
const nodes = wrap.getEnvelopingNodes(ReferenceTokens);
@ -172,6 +164,17 @@ export const RefsInput = forwardRef<ReactCodeMirrorRef, RefsInputInputProps>(
}
});
}
function handleInput(event: React.KeyboardEvent<HTMLDivElement>) {
if (!thisRef.current?.view) {
event.preventDefault();
event.stopPropagation();
return;
}
if ((event.ctrlKey || event.metaKey) && event.code === 'Space') {
withPreventDefault(onEditRef)(event);
return;
}
}
return (

View File

@ -10,7 +10,7 @@ import { IconCSV } from '@/components/icons';
import { SearchBar } from '@/components/input';
import { useFitHeight } from '@/stores/app-layout';
import { infoMsg } from '@/utils/labels';
import { convertToCSV } from '@/utils/utils';
import { convertToCSV, withPreventDefault } from '@/utils/utils';
import { CstType } from '../../../backend/types';
import { useMutatingRSForm } from '../../../backend/use-mutating-rsform';
@ -34,7 +34,6 @@ export function EditorRSList() {
moveUp,
moveDown,
cloneCst,
canDeleteSelected,
promptDeleteCst,
navigateCst
} = useRSEdit();
@ -74,29 +73,24 @@ export function EditorRSList() {
function handleKeyDown(event: React.KeyboardEvent<HTMLDivElement>) {
if (event.key === 'Escape') {
event.preventDefault();
event.stopPropagation();
deselectAll();
withPreventDefault(deselectAll)(event);
return;
}
if (!isContentEditable || isProcessing) {
return;
}
if (event.key === 'Delete' && canDeleteSelected) {
event.preventDefault();
event.stopPropagation();
promptDeleteCst();
return;
}
if (!event.altKey || event.shiftKey) {
if (event.key === 'Delete') {
withPreventDefault(promptDeleteCst)(event);
return;
}
if (event.altKey && !event.shiftKey) {
if (processAltKey(event.code)) {
event.preventDefault();
event.stopPropagation();
return;
}
}
}
function processAltKey(code: string): boolean {
if (selected.length > 0) {

View File

@ -6,6 +6,7 @@ import { type Edge, MarkerType, type Node, useEdgesState, useNodesState, useOnSe
import { DiagramFlow, useReactFlow, useStoreApi } from '@/components/flow/diagram-flow';
import { useMainHeight } from '@/stores/app-layout';
import { PARAMETER } from '@/utils/constants';
import { withPreventDefault } from '@/utils/utils';
import { useMutatingRSForm } from '../../../backend/use-mutating-rsform';
import { ToolbarGraphSelection } from '../../../components/toolbar-graph-selection';
@ -39,17 +40,8 @@ export function TGFlow() {
const store = useStoreApi();
const { addSelectedNodes } = store.getState();
const isProcessing = useMutatingRSForm();
const {
isContentEditable,
schema,
selected,
setSelected,
canDeleteSelected,
promptDeleteCst,
focusCst,
setFocus,
deselectAll
} = useRSEdit();
const { isContentEditable, schema, selected, setSelected, promptDeleteCst, focusCst, setFocus, deselectAll } =
useRSEdit();
const [nodes, setNodes, onNodesChange] = useNodesState([]);
const [edges, setEdges] = useEdgesState([]);
@ -140,20 +132,14 @@ export function TGFlow() {
return;
}
if (event.key === 'Escape') {
event.preventDefault();
event.stopPropagation();
setFocus(null);
withPreventDefault(() => setFocus(null))(event);
return;
}
if (!isContentEditable) {
return;
}
if (event.key === 'Delete') {
event.preventDefault();
event.stopPropagation();
if (canDeleteSelected) {
promptDeleteCst();
}
withPreventDefault(promptDeleteCst)(event);
return;
}
}

View File

@ -2,6 +2,7 @@ import { useReactFlow } from 'reactflow';
import { HelpTopic } from '@/features/help';
import { BadgeHelp } from '@/features/help/components/badge-help';
import { type ILibraryItemReference } from '@/features/library';
import { MiniSelectorOSS } from '@/features/library/components/mini-selector-oss';
import { MiniButton } from '@/components/control';
@ -61,7 +62,7 @@ export function ToolbarTermGraph() {
}
function handleDeleteCst() {
if (!canDeleteSelected || isProcessing) {
if (isProcessing) {
return;
}
promptDeleteCst();
@ -94,14 +95,13 @@ export function ToolbarTermGraph() {
});
}
function handleSelectOss(event: React.MouseEvent<HTMLElement>, newValue: ILibraryItemReference) {
navigateOss(newValue.id, event.ctrlKey || event.metaKey);
}
return (
<div className='cc-icons'>
{schema.oss.length > 0 ? (
<MiniSelectorOSS
items={schema.oss}
onSelect={(event, value) => navigateOss(value.id, event.ctrlKey || event.metaKey)}
/>
) : null}
{schema.oss.length > 0 ? <MiniSelectorOSS items={schema.oss} onSelect={handleSelectOss} /> : null}
<MiniButton
title='Настройки фильтрации узлов и связей'
icon={<IconFilter size='1.25rem' className='icon-primary' />}

View File

@ -241,6 +241,9 @@ export const RSEditState = ({
}
function promptDeleteCst() {
if (!canDeleteSelected) {
return;
}
showDeleteCst({
schema: schema,
selected: selected,