tidy(ui): clean up addnodepopover hotkeys

This commit is contained in:
psychedelicious 2024-05-18 18:46:03 +10:00
parent 468644ab18
commit 9f7841a04b

View File

@ -21,7 +21,6 @@ import { getFirstValidConnection, validateSourceAndTargetTypes } from 'features/
import type { AnyNode } from 'features/nodes/types/invocation'; import type { AnyNode } from 'features/nodes/types/invocation';
import { isInvocationNode } from 'features/nodes/types/invocation'; import { isInvocationNode } from 'features/nodes/types/invocation';
import { filter, map, memoize, some } from 'lodash-es'; import { filter, map, memoize, some } from 'lodash-es';
import type { KeyboardEventHandler } from 'react';
import { memo, useCallback, useMemo, useRef } from 'react'; import { memo, useCallback, useMemo, useRef } from 'react';
import { flushSync } from 'react-dom'; import { flushSync } from 'react-dom';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
@ -159,25 +158,24 @@ const AddNodePopover = () => {
); );
const handleHotkeyOpen: HotkeyCallback = useCallback((e) => { const handleHotkeyOpen: HotkeyCallback = useCallback((e) => {
e.preventDefault(); if (!$isAddNodePopoverOpen.get()) {
openAddNodePopover(); e.preventDefault();
flushSync(() => { openAddNodePopover();
selectRef.current?.inputRef?.focus(); flushSync(() => {
}); selectRef.current?.inputRef?.focus();
});
}
}, []); }, []);
const handleHotkeyClose: HotkeyCallback = useCallback(() => { const handleHotkeyClose: HotkeyCallback = useCallback(() => {
closeAddNodePopover(); if ($isAddNodePopoverOpen.get()) {
}, []);
useHotkeys(['shift+a', 'space'], handleHotkeyOpen);
useHotkeys(['escape'], handleHotkeyClose);
const onKeyDown: KeyboardEventHandler = useCallback((e) => {
if (e.key === 'Escape') {
closeAddNodePopover(); closeAddNodePopover();
} }
}, []); }, []);
useHotkeys(['shift+a', 'space'], handleHotkeyOpen);
useHotkeys(['escape'], handleHotkeyClose, { enableOnFormTags: ['TEXTAREA'] });
const noOptionsMessage = useCallback(() => t('nodes.noMatchingNodes'), [t]); const noOptionsMessage = useCallback(() => t('nodes.noMatchingNodes'), [t]);
return ( return (
@ -214,7 +212,6 @@ const AddNodePopover = () => {
filterOption={filterOption} filterOption={filterOption}
onChange={onChange} onChange={onChange}
onMenuClose={closeAddNodePopover} onMenuClose={closeAddNodePopover}
onKeyDown={onKeyDown}
inputRef={inputRef} inputRef={inputRef}
closeMenuOnSelect={false} closeMenuOnSelect={false}
/> />