chore(client/ts): port more dialogs

src/public/app/types.d.ts

@@ -283,6 +283,7 @@ declare global {
                     getLastPosition(): undefined | TextPosition;
                 }
             },
+            insertContent(modelFragment: any, selection: any);
             change(cb: (writer: Writer) => void)
         },
         editing: {
@@ -311,6 +312,12 @@ declare global {
         plugins: {
             get(command: string)
         },
+        data: {
+            processor: {
+                toView(html: string);
+            };
+            toModel(viewFeragment: any);
+        },
         getData(): string;
         setData(data: string): void;
         getSelectedHtml(): string;

src/public/app/widgets/dialogs/jump_to_note.ts

@@ -28,6 +28,13 @@ const TPL = `<div class="jump-to-note-dialog modal mx-auto" tabindex="-1" role="
 const KEEP_LAST_SEARCH_FOR_X_SECONDS = 120;
 
 export default class JumpToNoteDialog extends BasicWidget {
+
+    private lastOpenedTs: number;
+    private modal!: bootstrap.Modal;
+    private $autoComplete!: JQuery<HTMLElement>;
+    private $results!: JQuery<HTMLElement>;
+    private $showInFullTextButton!: JQuery<HTMLElement>;
+
     constructor() {
         super();
 
@@ -36,7 +43,7 @@ export default class JumpToNoteDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.modal = Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget[0]);
 
         this.$autoComplete = this.$widget.find(".jump-to-note-autocomplete");
         this.$results = this.$widget.find(".jump-to-note-results");
@@ -54,17 +61,17 @@ export default class JumpToNoteDialog extends BasicWidget {
 
                 function reposition() {
                     const offset = 100;
-                    const modalHeight = window.visualViewport.height - offset;
+                    const modalHeight = (window.visualViewport?.height ?? 0) - offset;
-                    const safeAreaInsetBottom = window.visualViewport.height - window.innerHeight;
+                    const safeAreaInsetBottom = (window.visualViewport?.height ?? 0) - window.innerHeight;
                     el.style.height = `${modalHeight}px`;
-                    el.style.bottom = `${window.visualViewport.height - modalHeight - safeAreaInsetBottom - offset}px`;
+                    el.style.bottom = `${(window.visualViewport?.height ?? 0) - modalHeight - safeAreaInsetBottom - offset}px`;
                 }
 
                 this.$autoComplete.on("focus", () => {
                     reposition();
                 });
 
-                window.visualViewport.addEventListener("resize", () => {
+                window.visualViewport?.addEventListener("resize", () => {
                     reposition();
                 });
 
@@ -84,7 +91,7 @@ export default class JumpToNoteDialog extends BasicWidget {
                 allowCreatingNotes: true,
                 hideGoToSelectedNoteButton: true,
                 allowJumpToSearchNotes: true,
-                container: this.$results
+                container: this.$results[0]
             })
             // clear any event listener added in previous invocation of this function
             .off("autocomplete:noteselected")
@@ -93,7 +100,7 @@ export default class JumpToNoteDialog extends BasicWidget {
                     return false;
                 }
 
-                appContext.tabManager.getActiveContext().setNote(suggestion.notePath);
+                appContext.tabManager.getActiveContext()?.setNote(suggestion.notePath);
             });
 
         // if you open the Jump To dialog soon after using it previously, it can often mean that you
@@ -112,15 +119,14 @@ export default class JumpToNoteDialog extends BasicWidget {
         }
     }
 
-    showInFullText(e) {
+    showInFullText(e: JQuery.TriggeredEvent) {
         // stop from propagating upwards (dangerous, especially with ctrl+enter executable javascript notes)
         e.preventDefault();
         e.stopPropagation();
 
-        const searchString = this.$autoComplete.val();
+        const searchString = String(this.$autoComplete.val());
 
         this.triggerCommand("searchNotes", { searchString });
-
         this.modal.hide();
     }
 }

src/public/app/widgets/dialogs/markdown_import.ts

@@ -27,7 +27,17 @@ const TPL = `
     </div>
 </div>`;
 
+interface RenderMarkdownResponse {
+    htmlContent: string;
+}
+
 export default class MarkdownImportDialog extends BasicWidget {
+
+    private lastOpenedTs: number;
+    private modal!: bootstrap.Modal;
+    private $importTextarea!: JQuery<HTMLElement>;
+    private $importButton!: JQuery<HTMLElement>;
+
     constructor() {
         super();
 
@@ -36,7 +46,7 @@ export default class MarkdownImportDialog extends BasicWidget {
 
     doRender() {
         this.$widget = $(TPL);
-        this.modal = Modal.getOrCreateInstance(this.$widget);
+        this.modal = Modal.getOrCreateInstance(this.$widget[0]);
         this.$importTextarea = this.$widget.find(".markdown-import-textarea");
         this.$importButton = this.$widget.find(".markdown-import-button");
 
@@ -47,10 +57,13 @@ export default class MarkdownImportDialog extends BasicWidget {
         shortcutService.bindElShortcut(this.$widget, "ctrl+return", () => this.sendForm());
     }
 
-    async convertMarkdownToHtml(markdownContent) {
+    async convertMarkdownToHtml(markdownContent: string) {
-        const { htmlContent } = await server.post("other/render-markdown", { markdownContent });
+        const { htmlContent } = await server.post<RenderMarkdownResponse>("other/render-markdown", { markdownContent });
 
-        const textEditor = await appContext.tabManager.getActiveContext().getTextEditor();
+        const textEditor = await appContext.tabManager.getActiveContext()?.getTextEditor();
+        if (!textEditor) {
+            return;
+        }
 
         const viewFragment = textEditor.data.processor.toView(htmlContent);
         const modelFragment = textEditor.data.toModel(viewFragment);
@@ -80,7 +93,7 @@ export default class MarkdownImportDialog extends BasicWidget {
     }
 
     async sendForm() {
-        const text = this.$importTextarea.val();
+        const text = String(this.$importTextarea.val());
 
         this.modal.hide();
 

src/public/app/widgets/dialogs/move_to.ts

@@ -6,6 +6,7 @@ import branchService from "../../services/branches.js";
 import treeService from "../../services/tree.js";
 import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
+import type { EventData } from "../../components/app_context.js";
 
 const TPL = `
 <div class="move-to-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -39,6 +40,12 @@ const TPL = `
 </div>`;
 
 export default class MoveToDialog extends BasicWidget {
+
+    private movedBranchIds: string[] | null;
+    private $form!: JQuery<HTMLElement>;
+    private $noteAutoComplete!: JQuery<HTMLElement>;
+    private $noteList!: JQuery<HTMLElement>;
+
     constructor() {
         super();
 
@@ -58,7 +65,13 @@ export default class MoveToDialog extends BasicWidget {
                 this.$widget.modal("hide");
 
                 const { noteId, parentNoteId } = treeService.getNoteIdAndParentIdFromUrl(notePath);
-                froca.getBranchId(parentNoteId, noteId).then((branchId) => this.moveNotesTo(branchId));
+                if (parentNoteId) {
+                    froca.getBranchId(parentNoteId, noteId).then((branchId) => {
+                        if (branchId) {
+                            this.moveNotesTo(branchId);
+                        }
+                    });
+                }
             } else {
                 logError(t("move_to.error_no_path"));
             }
@@ -67,7 +80,7 @@ export default class MoveToDialog extends BasicWidget {
         });
     }
 
-    async moveBranchIdsToEvent({ branchIds }) {
+    async moveBranchIdsToEvent({ branchIds }: EventData<"moveBranchIdsTo">) {
         this.movedBranchIds = branchIds;
 
         utils.openDialog(this.$widget);
@@ -78,7 +91,14 @@ export default class MoveToDialog extends BasicWidget {
 
         for (const branchId of this.movedBranchIds) {
             const branch = froca.getBranch(branchId);
+            if (!branch) {
+                continue;
+            }
+
             const note = await froca.getNote(branch.noteId);
+            if (!note) {
+                continue;
+            }
 
             this.$noteList.append($("<li>").text(note.title));
         }
@@ -87,12 +107,14 @@ export default class MoveToDialog extends BasicWidget {
         noteAutocompleteService.showRecentNotes(this.$noteAutoComplete);
     }
 
-    async moveNotesTo(parentBranchId) {
+    async moveNotesTo(parentBranchId: string) {
+        if (this.movedBranchIds) {
             await branchService.moveToParentNote(this.movedBranchIds, parentBranchId);
+        }
 
         const parentBranch = froca.getBranch(parentBranchId);
-        const parentNote = await parentBranch.getNote();
+        const parentNote = await parentBranch?.getNote();
 
-        toastService.showMessage(`${t("move_to.move_success_message")} ${parentNote.title}`);
+        toastService.showMessage(`${t("move_to.move_success_message")} ${parentNote?.title}`);
     }
 }