refactor(react/ribbon): set up keyboard shortcuts

apps/client/src/widgets/attribute_widgets/attribute_editor.ts

@@ -1,20 +0,0 @@
-export default class AttributeEditorWidget extends NoteContextAwareWidget implements EventListener<"entitiesReloaded">, EventListener<"addNewLabel">, EventListener<"addNewRelation"> {
-
-    // triggered from keyboard shortcut
-    async addNewLabelEvent({ ntxId }: EventData<"addNewLabel">) {
-        if (this.isNoteContext(ntxId)) {
-            await this.refresh();
-
-            this.handleAddNewAttributeCommand("addNewLabel");
-        }
-    }
-
-    // triggered from keyboard shortcut
-    async addNewRelationEvent({ ntxId }: EventData<"addNewRelation">) {
-        if (this.isNoteContext(ntxId)) {
-            await this.refresh();
-
-            this.handleAddNewAttributeCommand("addNewRelation");
-        }
-    }
-}

apps/client/src/widgets/react/hooks.tsx

@@ -450,7 +450,6 @@ export function useLegacyWidget<T extends BasicWidget>(widgetFactory: () => T, {
 
     // Inject the note context.
     useEffect(() => {
-        console.log("Injecting note context");
         if (noteContext && widget instanceof NoteContextAwareWidget) {
             widget.activeContextChangedEvent({ noteContext });
         }

apps/client/src/widgets/ribbon/OwnedAttributesTab.tsx

@@ -1,15 +1,11 @@
 import AttributeEditor from "./components/AttributeEditor";
 import { TabContext } from "./ribbon-interface";
 
-export default function OwnedAttributesTab({ note, notePath, componentId }: TabContext) {
+export default function OwnedAttributesTab({ note, ...restProps }: TabContext) {
     return (
         <div className="attribute-list">
             { note && (
-                <AttributeEditor
+                <AttributeEditor note={note} {...restProps} />
-                    componentId={componentId}
-                    note={note}
-                    notePath={notePath}
-                />
             )}
         </div>
     )

apps/client/src/widgets/ribbon/components/AttributeEditor.tsx

@@ -76,7 +76,7 @@ const mentionSetup: MentionFeed[] = [
 ];
 
 
-export default function AttributeEditor({ note, componentId, notePath }: { note: FNote, componentId: string, notePath?: string | null }) {
+export default function AttributeEditor({ note, componentId, notePath, ntxId }: { note: FNote, componentId: string, notePath?: string | null, ntxId?: string | null }) {
     const [ state, setState ] = useState<"normal" | "showHelpTooltip" | "showAttributeDetail">();
     const [ error, setError ] = useState<unknown>();
     const [ needsSaving, setNeedsSaving ] = useState(false);
@@ -254,6 +254,16 @@ export default function AttributeEditor({ note, componentId, notePath }: { note:
         updateAttributeListCommand: ({ attributes }: CommandListenerData<"updateAttributeList">) => renderOwnedAttributes(attributes as FAttribute[], false)
     }), []));
 
+    // Keyboard shortcuts
+    useTriliumEventBeta("addNewLabel", ({ ntxId: eventNtxId }) => {
+        if (eventNtxId !== ntxId) return;
+        handleAddNewAttributeCommand("addNewLabel");
+    });
+    useTriliumEventBeta("addNewRelation", ({ ntxId: eventNtxId }) => {
+        if (eventNtxId !== ntxId) return;
+        handleAddNewAttributeCommand("addNewRelation");
+    });
+    
     return (
         <>
             <div