chore(client/ts): port menus/tree_context_menu

src/public/app/menus/tree_context_menu.ts

@@ -1,26 +1,34 @@
-import treeService from '../services/tree.js';
+import treeService, { Node } from '../services/tree.js';
 import froca from "../services/froca.js";
 import clipboard from '../services/clipboard.js';
 import noteCreateService from "../services/note_create.js";
-import contextMenu from "./context_menu.js";
+import contextMenu, { MenuCommandItem, MenuItem } from "./context_menu.js";
 import appContext from "../components/app_context.js";
 import noteTypesService from "../services/note_types.js";
 import server from "../services/server.js";
 import toastService from "../services/toast.js";
 import dialogService from "../services/dialog.js";
 import { t } from "../services/i18n.js";
+import NoteTreeWidget from '../widgets/note_tree.js';
+import FAttachment from '../entities/fattachment.js';
+import { SelectMenuItemEventListener } from '../components/events.js';
 
-export default class TreeContextMenu {
+// TODO: Deduplicate once client/server is well split.
-    /**
+interface ConvertToAttachmentResponse {
-     * @param {NoteTreeWidget} treeWidget
+    attachment?: FAttachment;
-     * @param {FancytreeNode} node
+}
-     */
+
-    constructor(treeWidget, node) {
+export default class TreeContextMenu implements SelectMenuItemEventListener {
+
+    private treeWidget: NoteTreeWidget;
+    private node: Node;
+
+    constructor(treeWidget: NoteTreeWidget, node: Node) {
         this.treeWidget = treeWidget;
         this.node = node;
     }
 
-    async show(e) {
+    async show(e: PointerEvent) {
         contextMenu.show({
             x: e.pageX,
             y: e.pageY,
@@ -29,12 +37,12 @@ export default class TreeContextMenu {
         })
     }
 
-    async getMenuItems() {
+    async getMenuItems(): Promise<MenuItem[]> {
-        const note = await froca.getNote(this.node.data.noteId);
+        const note = this.node.data.noteId ? await froca.getNote(this.node.data.noteId) : null;
         const branch = froca.getBranch(this.node.data.branchId);
-        const isNotRoot = note.noteId !== 'root';
+        const isNotRoot = note?.noteId !== 'root';
-        const isHoisted = note.noteId === appContext.tabManager.getActiveContext().hoistedNoteId;
+        const isHoisted = note?.noteId === appContext.tabManager.getActiveContext().hoistedNoteId;
-        const parentNote = isNotRoot ? await froca.getNote(branch.parentNoteId) : null;
+        const parentNote = isNotRoot && branch ? await froca.getNote(branch.parentNoteId) : null;
 
         // some actions don't support multi-note, so they are disabled when notes are selected,
         // the only exception is when the only selected note is the one that was right-clicked, then
@@ -43,8 +51,8 @@ export default class TreeContextMenu {
         const noSelectedNotes = selNodes.length === 0
                 || (selNodes.length === 1 && selNodes[0] === this.node);
 
-        const notSearch = note.type !== 'search';
+        const notSearch = note?.type !== 'search';
-        const notOptions = !note.noteId.startsWith("_options");
+        const notOptions = !note?.noteId.startsWith("_options");
         const parentNotSearch = !parentNote || parentNote.type !== 'search';
         const insertNoteAfterEnabled = isNotRoot && !isHoisted && parentNotSearch;
 
@@ -141,10 +149,10 @@ export default class TreeContextMenu {
             { title: `${t("tree-context-menu.search-in-subtree")} <kbd data-command="searchInSubtree"></kbd>`, command: "searchInSubtree", uiIcon: "bx bx-search",
             enabled: notSearch && noSelectedNotes },
 
-        ].filter(row => row !== null);
+        ].filter(row => row !== null) as MenuItem[];
     }
 
-    async selectMenuItemHandler({command, type, templateNoteId}) {
+    async selectMenuItemHandler({command, type, templateNoteId}: MenuCommandItem) {
         const notePath = treeService.getNotePath(this.node);
 
         if (command === 'openInTab') {
@@ -187,8 +195,8 @@ export default class TreeContextMenu {
             for (const noteId of this.treeWidget.getSelectedOrActiveNoteIds(this.node)) {
                 const note = await froca.getNote(noteId);
 
-                if (note.isEligibleForConversionToAttachment()) {
+                if (note?.isEligibleForConversionToAttachment()) {
-                    const {attachment} = await server.post(`notes/${note.noteId}/convert-to-attachment`);
+                    const {attachment} = await server.post<ConvertToAttachmentResponse>(`notes/${note.noteId}/convert-to-attachment`);
 
                     if (attachment) {
                         converted++;
@@ -201,7 +209,7 @@ export default class TreeContextMenu {
         else if (command === 'copyNotePathToClipboard') {
             navigator.clipboard.writeText('#' + notePath);
         }
-        else {
+        else if (command) {
             this.treeWidget.triggerCommand(command, {
                 node: this.node,
                 notePath: notePath,