From 9eec7237de849ab92b59bf13f21c13585d697b7c Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Wed, 19 Mar 2025 23:27:52 +0200
Subject: [PATCH] chore(client/ts): port include dialog

---
 src/public/app/components/app_context.ts      |  3 +++
 .../{include_note.js => include_note.ts}      | 25 +++++++++++++------
 2 files changed, 21 insertions(+), 7 deletions(-)
 rename src/public/app/widgets/dialogs/{include_note.js => include_note.ts} (84%)

diff --git a/src/public/app/components/app_context.ts b/src/public/app/components/app_context.ts
index 079e9f737..367d99e8b 100644
--- a/src/public/app/components/app_context.ts
+++ b/src/public/app/components/app_context.ts
@@ -364,6 +364,9 @@ type EventMappings = {
         textTypeWidget: EditableTextTypeWidget;
         text: string;
     };
+    showIncludeDialog: {
+        textTypeWidget: EditableTextTypeWidget;
+    };
     openBulkActionsDialog: {
         selectedOrActiveNoteIds: string[];
     };
diff --git a/src/public/app/widgets/dialogs/include_note.js b/src/public/app/widgets/dialogs/include_note.ts
similarity index 84%
rename from src/public/app/widgets/dialogs/include_note.js
rename to src/public/app/widgets/dialogs/include_note.ts
index 94d813413..839d068dd 100644
--- a/src/public/app/widgets/dialogs/include_note.js
+++ b/src/public/app/widgets/dialogs/include_note.ts
@@ -5,6 +5,8 @@ import utils from "../../services/utils.js";
 import froca from "../../services/froca.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
+import type { EventData } from "../../components/app_context.js";
+import type EditableTextTypeWidget from "../type_widgets/editable_text.js";
 
 const TPL = `
 <div class="include-note-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -53,9 +55,15 @@ const TPL = `
 </div>`;
 
 export default class IncludeNoteDialog extends BasicWidget {
+
+    private modal!: bootstrap.Modal;
+    private $form!: JQuery<HTMLElement>;
+    private $autoComplete!: JQuery<HTMLElement>;
+    private textTypeWidget?: EditableTextTypeWidget;
+
     doRender() {
         this.$widget = $(TPL);
-        this.modal = Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget[0]);
         this.$form = this.$widget.find(".include-note-form");
         this.$autoComplete = this.$widget.find(".include-note-autocomplete");
         this.$form.on("submit", () => {
@@ -72,7 +80,7 @@ export default class IncludeNoteDialog extends BasicWidget {
         });
     }
 
-    async showIncludeNoteDialogEvent({ textTypeWidget }) {
+    async showIncludeNoteDialogEvent({ textTypeWidget }: EventData<"showIncludeDialog">) {
         this.textTypeWidget = textTypeWidget;
         await this.refresh();
         utils.openDialog(this.$widget);
@@ -80,7 +88,7 @@ export default class IncludeNoteDialog extends BasicWidget {
         this.$autoComplete.trigger("focus").trigger("select"); // to be able to quickly remove entered text
     }
 
-    async refresh(widget) {
+    async refresh() {
         this.$autoComplete.val("");
         noteAutocompleteService.initNoteAutocomplete(this.$autoComplete, {
             hideGoToSelectedNoteButton: true,
@@ -89,17 +97,20 @@ export default class IncludeNoteDialog extends BasicWidget {
         noteAutocompleteService.showRecentNotes(this.$autoComplete);
     }
 
-    async includeNote(notePath) {
+    async includeNote(notePath: string) {
         const noteId = treeService.getNoteIdFromUrl(notePath);
+        if (!noteId) {
+            return;
+        }
         const note = await froca.getNote(noteId);
         const boxSize = $("input[name='include-note-box-size']:checked").val();
 
-        if (["image", "canvas", "mermaid"].includes(note.type)) {
+        if (["image", "canvas", "mermaid"].includes(note?.type ?? "")) {
             // there's no benefit to use insert note functionlity for images,
             // so we'll just add an IMG tag
-            this.textTypeWidget.addImage(noteId);
+            this.textTypeWidget?.addImage(noteId);
         } else {
-            this.textTypeWidget.addIncludeNote(noteId, boxSize);
+            this.textTypeWidget?.addIncludeNote(noteId, boxSize);
         }
     }
 }