From 435b856b72ae0539ab923b974069fb592319b259 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sat, 22 Nov 2025 18:35:07 +0200 Subject: [PATCH] fix(quick_edit): keyboard shortcuts triggering on wrong editor --- apps/client/src/services/keyboard_actions.ts | 6 ++++-- apps/client/src/widgets/react/hooks.tsx | 6 +++--- apps/client/src/widgets/type_widgets/code/Code.tsx | 2 +- .../src/widgets/type_widgets/text/CKEditorWithWatchdog.tsx | 4 ++-- apps/client/src/widgets/type_widgets/text/EditableText.tsx | 5 ++--- 5 files changed, 12 insertions(+), 11 deletions(-) diff --git a/apps/client/src/services/keyboard_actions.ts b/apps/client/src/services/keyboard_actions.ts index 5678d6196..d447a9001 100644 --- a/apps/client/src/services/keyboard_actions.ts +++ b/apps/client/src/services/keyboard_actions.ts @@ -28,7 +28,7 @@ async function getActionsForScope(scope: string) { return actions.filter((action) => action.scope === scope); } -async function setupActionsForElement(scope: string, $el: JQuery, component: Component) { +async function setupActionsForElement(scope: string, $el: JQuery, component: Component, ntxId: string | null | undefined) { if (!$el[0]) return []; const actions = await getActionsForScope(scope); @@ -36,7 +36,9 @@ async function setupActionsForElement(scope: string, $el: JQuery, c for (const action of actions) { for (const shortcut of action.effectiveShortcuts ?? []) { - const binding = shortcutService.bindElShortcut($el, shortcut, () => component.triggerCommand(action.actionName, { ntxId: appContext.tabManager.activeNtxId })); + const binding = shortcutService.bindElShortcut($el, shortcut, () => { + component.triggerCommand(action.actionName, { ntxId }); + }); if (binding) { bindings.push(binding); } diff --git a/apps/client/src/widgets/react/hooks.tsx b/apps/client/src/widgets/react/hooks.tsx index 0ee92f8af..856896f2c 100644 --- a/apps/client/src/widgets/react/hooks.tsx +++ b/apps/client/src/widgets/react/hooks.tsx @@ -760,18 +760,18 @@ export function useResizeObserver(ref: RefObject, callback: () => v }, [ callback, ref ]); } -export function useKeyboardShortcuts(scope: "code-detail" | "text-detail", containerRef: RefObject, parentComponent: Component | undefined) { +export function useKeyboardShortcuts(scope: "code-detail" | "text-detail", containerRef: RefObject, parentComponent: Component | undefined, ntxId: string | null | undefined) { useEffect(() => { if (!parentComponent) return; const $container = refToJQuerySelector(containerRef); - const bindingPromise = keyboard_actions.setupActionsForElement(scope, $container, parentComponent); + const bindingPromise = keyboard_actions.setupActionsForElement(scope, $container, parentComponent, ntxId); return async () => { const bindings = await bindingPromise; for (const binding of bindings) { removeIndividualBinding(binding); } } - }, []); + }, [ scope, containerRef, parentComponent, ntxId ]); } /** diff --git a/apps/client/src/widgets/type_widgets/code/Code.tsx b/apps/client/src/widgets/type_widgets/code/Code.tsx index 0c089b9a8..02117f19f 100644 --- a/apps/client/src/widgets/type_widgets/code/Code.tsx +++ b/apps/client/src/widgets/type_widgets/code/Code.tsx @@ -100,7 +100,7 @@ export function EditableCode({ note, ntxId, noteContext, debounceUpdate, parentC } }); - useKeyboardShortcuts("code-detail", containerRef, parentComponent); + useKeyboardShortcuts("code-detail", containerRef, parentComponent, ntxId); return ( <> diff --git a/apps/client/src/widgets/type_widgets/text/CKEditorWithWatchdog.tsx b/apps/client/src/widgets/type_widgets/text/CKEditorWithWatchdog.tsx index 1c3a85e23..e19032d46 100644 --- a/apps/client/src/widgets/type_widgets/text/CKEditorWithWatchdog.tsx +++ b/apps/client/src/widgets/type_widgets/text/CKEditorWithWatchdog.tsx @@ -39,9 +39,9 @@ export default function CKEditorWithWatchdog({ containerRef: externalContainerRe const watchdogRef = useRef(null); const [ uiLanguage ] = useTriliumOption("locale"); const [ editor, setEditor ] = useState(); - const { parentComponent } = useNoteContext(); + const { parentComponent, ntxId } = useNoteContext(); - useKeyboardShortcuts("text-detail", containerRef, parentComponent); + useKeyboardShortcuts("text-detail", containerRef, parentComponent, ntxId); useImperativeHandle(editorApi, () => ({ hasSelection() { diff --git a/apps/client/src/widgets/type_widgets/text/EditableText.tsx b/apps/client/src/widgets/type_widgets/text/EditableText.tsx index e3fa1ecee..828989671 100644 --- a/apps/client/src/widgets/type_widgets/text/EditableText.tsx +++ b/apps/client/src/widgets/type_widgets/text/EditableText.tsx @@ -2,12 +2,11 @@ import { useEffect, useRef, useState } from "preact/hooks"; import dialog from "../../../services/dialog"; import toast from "../../../services/toast"; import utils, { hasTouchBar, isMobile } from "../../../services/utils"; -import { useEditorSpacedUpdate, useKeyboardShortcuts, useLegacyImperativeHandlers, useNoteLabel, useTriliumEvent, useTriliumOption, useTriliumOptionBool } from "../../react/hooks"; +import { useEditorSpacedUpdate, useLegacyImperativeHandlers, useNoteLabel, useTriliumEvent, useTriliumOption, useTriliumOptionBool } from "../../react/hooks"; import { TypeWidgetProps } from "../type_widget"; import CKEditorWithWatchdog, { CKEditorApi } from "./CKEditorWithWatchdog"; import "./EditableText.css"; -import { CKTextEditor, ClassicEditor, EditorWatchdog, TemplateDefinition } from "@triliumnext/ckeditor5"; -import Component from "../../../components/component"; +import { CKTextEditor, EditorWatchdog, TemplateDefinition } from "@triliumnext/ckeditor5"; import options from "../../../services/options"; import { loadIncludedNote, refreshIncludedNote, setupImageOpening } from "./utils"; import getTemplates, { updateTemplateCache } from "./snippets.js";