refactor(client): circular dep in utils

apps/client/src/components/note_context.ts

@@ -12,6 +12,7 @@ import type FNote from "../entities/fnote.js";
 import type TypeWidget from "../widgets/type_widgets/type_widget.js";
 import type { CKTextEditor } from "@triliumnext/ckeditor5";
 import type CodeMirror from "@triliumnext/codemirror";
+import { closeActiveDialog } from "../services/dialog.js";
 
 export interface SetNoteOpts {
     triggerSwitchEvent?: unknown;
@@ -83,7 +84,7 @@ class NoteContext extends Component implements EventListener<"entitiesReloaded">
 
         await this.triggerEvent("beforeNoteSwitch", { noteContext: this });
 
-        utils.closeActiveDialog();
+        closeActiveDialog();
 
         this.notePath = resolvedNotePath;
         this.viewScope = opts.viewScope;

apps/client/src/services/dialog.ts

@@ -1,6 +1,41 @@
+import { Modal } from "bootstrap";
 import appContext from "../components/app_context.js";
 import type { ConfirmDialogOptions, ConfirmDialogResult, ConfirmWithMessageOptions } from "../widgets/dialogs/confirm.js";
 import type { PromptDialogOptions } from "../widgets/dialogs/prompt.js";
+import { focusSavedElement, saveFocusedElement } from "./focus.js";
+
+export async function openDialog($dialog: JQuery<HTMLElement>, closeActDialog = true) {
+    if (closeActDialog) {
+        closeActiveDialog();
+        glob.activeDialog = $dialog;
+    }
+
+    saveFocusedElement();
+    Modal.getOrCreateInstance($dialog[0]).show();
+
+    $dialog.on("hidden.bs.modal", () => {
+        const $autocompleteEl = $(".aa-input");
+        if ("autocomplete" in $autocompleteEl) {
+            $autocompleteEl.autocomplete("close");
+        }
+
+        if (!glob.activeDialog || glob.activeDialog === $dialog) {
+            focusSavedElement();
+        }
+    });
+
+    const keyboardActionsService = (await import("./keyboard_actions.js")).default;
+    keyboardActionsService.updateDisplayedShortcuts($dialog);
+
+    return $dialog;
+}
+
+export function closeActiveDialog() {
+    if (glob.activeDialog) {
+        Modal.getOrCreateInstance(glob.activeDialog[0]).hide();
+        glob.activeDialog = null;
+    }
+}
 
 async function info(message: string) {
     return new Promise((res) => appContext.triggerCommand("showInfoDialog", { message, callback: res }));

apps/client/src/services/focus.ts

@@ -0,0 +1,29 @@
+let $lastFocusedElement: JQuery<HTMLElement> | null;
+
+// perhaps there should be saved focused element per tab?
+export function saveFocusedElement() {
+    $lastFocusedElement = $(":focus");
+}
+
+export function focusSavedElement() {
+    if (!$lastFocusedElement) {
+        return;
+    }
+
+    if ($lastFocusedElement.hasClass("ck")) {
+        // must handle CKEditor separately because of this bug: https://github.com/ckeditor/ckeditor5/issues/607
+        // the bug manifests itself in resetting the cursor position to the first character - jumping above
+
+        const editor = $lastFocusedElement.closest(".ck-editor__editable").prop("ckeditorInstance");
+
+        if (editor) {
+            editor.editing.view.focus();
+        } else {
+            console.log("Could not find CKEditor instance to focus last element");
+        }
+    } else {
+        $lastFocusedElement.focus();
+    }
+
+    $lastFocusedElement = null;
+}

apps/client/src/services/utils.ts

@@ -1,5 +1,4 @@
 import dayjs from "dayjs";
-import { Modal } from "bootstrap";
 import type { ViewScope } from "./link.js";
 
 const SVG_MIME = "image/svg+xml";
@@ -275,69 +274,6 @@ function getMimeTypeClass(mime: string) {
     return `mime-${mime.toLowerCase().replace(/[\W_]+/g, "-")}`;
 }
 
-function closeActiveDialog() {
-    if (glob.activeDialog) {
-        Modal.getOrCreateInstance(glob.activeDialog[0]).hide();
-        glob.activeDialog = null;
-    }
-}
-
-let $lastFocusedElement: JQuery<HTMLElement> | null;
-
-// perhaps there should be saved focused element per tab?
-function saveFocusedElement() {
-    $lastFocusedElement = $(":focus");
-}
-
-function focusSavedElement() {
-    if (!$lastFocusedElement) {
-        return;
-    }
-
-    if ($lastFocusedElement.hasClass("ck")) {
-        // must handle CKEditor separately because of this bug: https://github.com/ckeditor/ckeditor5/issues/607
-        // the bug manifests itself in resetting the cursor position to the first character - jumping above
-
-        const editor = $lastFocusedElement.closest(".ck-editor__editable").prop("ckeditorInstance");
-
-        if (editor) {
-            editor.editing.view.focus();
-        } else {
-            console.log("Could not find CKEditor instance to focus last element");
-        }
-    } else {
-        $lastFocusedElement.focus();
-    }
-
-    $lastFocusedElement = null;
-}
-
-async function openDialog($dialog: JQuery<HTMLElement>, closeActDialog = true) {
-    if (closeActDialog) {
-        closeActiveDialog();
-        glob.activeDialog = $dialog;
-    }
-
-    saveFocusedElement();
-    Modal.getOrCreateInstance($dialog[0]).show();
-
-    $dialog.on("hidden.bs.modal", () => {
-        const $autocompleteEl = $(".aa-input");
-        if ("autocomplete" in $autocompleteEl) {
-            $autocompleteEl.autocomplete("close");
-        }
-
-        if (!glob.activeDialog || glob.activeDialog === $dialog) {
-            focusSavedElement();
-        }
-    });
-
-    const keyboardActionsService = (await import("./keyboard_actions.js")).default;
-    keyboardActionsService.updateDisplayedShortcuts($dialog);
-
-    return $dialog;
-}
-
 function isHtmlEmpty(html: string) {
     if (!html) {
         return true;
@@ -823,10 +759,6 @@ export default {
     setCookie,
     getNoteTypeClass,
     getMimeTypeClass,
-    closeActiveDialog,
-    openDialog,
-    saveFocusedElement,
-    focusSavedElement,
     isHtmlEmpty,
     clearBrowserCache,
     copySelectionToClipboard,

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

@@ -11,6 +11,7 @@ import utils from "../../services/utils.js";
 import shortcutService from "../../services/shortcuts.js";
 import appContext from "../../components/app_context.js";
 import type { Attribute } from "../../services/attribute_parser.js";
+import { focusSavedElement, saveFocusedElement } from "../../services/focus.js";
 
 const TPL = /*html*/`
 <div class="attr-detail tn-tool-dialog">
@@ -483,7 +484,7 @@ export default class AttributeDetailWidget extends NoteContextAwareWidget {
             return;
         }
 
-        utils.saveFocusedElement();
+        saveFocusedElement();
 
         this.attrType = this.getAttrType(attribute);
 
@@ -605,7 +606,7 @@ export default class AttributeDetailWidget extends NoteContextAwareWidget {
 
         this.hide();
 
-        utils.focusSavedElement();
+        focusSavedElement();
     }
 
     async cancelAndClose() {
@@ -613,7 +614,7 @@ export default class AttributeDetailWidget extends NoteContextAwareWidget {
 
         this.hide();
 
-        utils.focusSavedElement();
+        focusSavedElement();
     }
 
     userEditedAttribute() {

apps/client/src/widgets/dialogs/about.ts

@@ -4,6 +4,7 @@ import BasicWidget from "../basic_widget.js";
 import openService from "../../services/open.js";
 import server from "../../services/server.js";
 import utils from "../../services/utils.js";
+import { openDialog } from "../../services/dialog.js";
 
 interface AppInfo {
     appVersion: string;
@@ -111,6 +112,6 @@ export default class AboutDialog extends BasicWidget {
 
     async openAboutDialogEvent() {
         await this.refresh();
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 }

apps/client/src/widgets/dialogs/add_link.ts

@@ -1,11 +1,11 @@
 import { t } from "../../services/i18n.js";
 import treeService from "../../services/tree.js";
 import noteAutocompleteService from "../../services/note_autocomplete.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import type { Suggestion } from "../../services/note_autocomplete.js";
 import type { default as TextTypeWidget } from "../type_widgets/editable_text.js";
 import type { EventData } from "../../components/app_context.js";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="add-link-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -111,7 +111,7 @@ export default class AddLinkDialog extends BasicWidget {
 
         this.updateTitleSettingsVisibility();
 
-        await utils.openDialog(this.$widget);
+        await openDialog(this.$widget);
 
         this.$autoComplete.val("");
         this.$linkTitle.val("");

apps/client/src/widgets/dialogs/branch_prefix.ts

@@ -2,11 +2,11 @@ import treeService from "../../services/tree.js";
 import server from "../../services/server.js";
 import froca from "../../services/froca.js";
 import toastService from "../../services/toast.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import appContext from "../../components/app_context.js";
 import { t } from "../../services/i18n.js";
 import { Modal } from "bootstrap";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`<div class="branch-prefix-dialog modal fade mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
@@ -93,7 +93,7 @@ export default class BranchPrefixDialog extends BasicWidget {
         }
 
         await this.refresh(notePath);
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 
     async savePrefix() {

apps/client/src/widgets/dialogs/bulk_actions.ts

@@ -1,11 +1,11 @@
 import BasicWidget from "../basic_widget.js";
 import froca from "../../services/froca.js";
 import bulkActionService from "../../services/bulk_action.js";
-import utils from "../../services/utils.js";
 import server from "../../services/server.js";
 import toastService from "../../services/toast.js";
 import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
+import { closeActiveDialog, openDialog } from "../../services/dialog.js";
 
 
 const TPL = /*html*/`
@@ -104,7 +104,7 @@ export default class BulkActionsDialog extends BasicWidget {
             });
 
             toastService.showMessage(t("bulk_actions.bulk_actions_executed"), 3000);
-            utils.closeActiveDialog();
+            closeActiveDialog();
         });
     }
 
@@ -170,6 +170,6 @@ export default class BulkActionsDialog extends BasicWidget {
         this.$includeDescendants.prop("checked", false);
 
         await this.refresh();
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 }

apps/client/src/widgets/dialogs/clone_to.ts

@@ -1,5 +1,4 @@
 import noteAutocompleteService from "../../services/note_autocomplete.js";
-import utils from "../../services/utils.js";
 import treeService from "../../services/tree.js";
 import toastService from "../../services/toast.js";
 import froca from "../../services/froca.js";
@@ -8,6 +7,7 @@ import appContext from "../../components/app_context.js";
 import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
+import { openDialog } from "../../services/dialog.js";
 
 
 const TPL = /*html*/`
@@ -94,7 +94,7 @@ export default class CloneToDialog extends BasicWidget {
             }
         }
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
         this.$noteAutoComplete.val("").trigger("focus");
         this.$noteList.empty();
 

apps/client/src/widgets/dialogs/delete_notes.ts

@@ -1,10 +1,10 @@
 import server from "../../services/server.js";
 import froca from "../../services/froca.js";
 import linkService from "../../services/link.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
 import type { FAttributeRow } from "../../entities/fattribute.js";
+import { closeActiveDialog, openDialog } from "../../services/dialog.js";
 
 // TODO: Use common with server.
 interface Response {
@@ -119,13 +119,13 @@ export default class DeleteNotesDialog extends BasicWidget {
         this.$widget.on("shown.bs.modal", () => this.$okButton.trigger("focus"));
 
         this.$cancelButton.on("click", () => {
-            utils.closeActiveDialog();
+            closeActiveDialog();
 
             this.resolve({ proceed: false });
         });
 
         this.$okButton.on("click", () => {
-            utils.closeActiveDialog();
+            closeActiveDialog();
 
             this.resolve({
                 proceed: true,
@@ -179,7 +179,7 @@ export default class DeleteNotesDialog extends BasicWidget {
 
         await this.renderDeletePreview();
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         this.$deleteAllClones.prop("checked", !!forceDeleteAllClones).prop("disabled", !!forceDeleteAllClones);
 

apps/client/src/widgets/dialogs/export.ts

@@ -8,6 +8,7 @@ import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
 import type { EventData } from "../../components/app_context.js";
 import { Modal } from "bootstrap";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="export-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -214,7 +215,7 @@ export default class ExportDialog extends BasicWidget {
 
         this.$widget.find(".opml-v2").prop("checked", true); // setting default
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         const { noteId, parentNoteId } = treeService.getNoteIdAndParentIdFromUrl(notePath);
 

apps/client/src/widgets/dialogs/help.ts

@@ -1,6 +1,6 @@
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="help-dialog modal use-tn-links" tabindex="-1" role="dialog">
@@ -155,6 +155,6 @@ export default class HelpDialog extends BasicWidget {
     }
 
     showCheatsheetEvent() {
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 }

apps/client/src/widgets/dialogs/import.ts

@@ -1,4 +1,4 @@
-import utils, { escapeQuotes } from "../../services/utils.js";
+import { escapeQuotes } from "../../services/utils.js";
 import treeService from "../../services/tree.js";
 import importService, { type UploadFilesOptions } from "../../services/import.js";
 import options from "../../services/options.js";
@@ -6,6 +6,7 @@ import BasicWidget from "../basic_widget.js";
 import { t } from "../../services/i18n.js";
 import { Modal, Tooltip } from "bootstrap";
 import type { EventData } from "../../components/app_context.js";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="import-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -155,7 +156,7 @@ export default class ImportDialog extends BasicWidget {
 
         this.$noteTitle.text(await treeService.getNoteTitle(this.parentNoteId));
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 
     async importIntoNote(parentNoteId: string) {

apps/client/src/widgets/dialogs/include_note.ts

@@ -1,12 +1,12 @@
 import { t } from "../../services/i18n.js";
 import treeService from "../../services/tree.js";
 import noteAutocompleteService from "../../services/note_autocomplete.js";
-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";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="include-note-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -83,7 +83,7 @@ export default class IncludeNoteDialog extends BasicWidget {
     async showIncludeNoteDialogEvent({ textTypeWidget }: EventData<"showIncludeDialog">) {
         this.textTypeWidget = textTypeWidget;
         await this.refresh();
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         this.$autoComplete.trigger("focus").trigger("select"); // to be able to quickly remove entered text
     }

apps/client/src/widgets/dialogs/info.ts

@@ -1,9 +1,9 @@
 import type { EventData } from "../../components/app_context.js";
 import { t } from "../../services/i18n.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 import type { ConfirmDialogCallback } from "./confirm.js";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="info-dialog modal mx-auto" tabindex="-1" role="dialog" style="z-index: 2000;">
@@ -72,7 +72,7 @@ export default class InfoDialog extends BasicWidget {
         }
 
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         this.resolve = callback;
     }

apps/client/src/widgets/dialogs/jump_to_note.ts

@@ -5,6 +5,7 @@ import appContext from "../../components/app_context.js";
 import BasicWidget from "../basic_widget.js";
 import shortcutService from "../../services/shortcuts.js";
 import { Modal } from "bootstrap";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`<div class="jump-to-note-dialog modal mx-auto" tabindex="-1" role="dialog">
     <div class="modal-dialog modal-lg" role="document">
@@ -54,7 +55,7 @@ export default class JumpToNoteDialog extends BasicWidget {
     }
 
     async jumpToNoteEvent() {
-        const dialogPromise = utils.openDialog(this.$widget);
+        const dialogPromise = openDialog(this.$widget);
         if (utils.isMobile()) {
             dialogPromise.then(($dialog) => {
                 const el = $dialog.find(">.modal-dialog")[0];

apps/client/src/widgets/dialogs/markdown_import.ts

@@ -6,6 +6,7 @@ import BasicWidget from "../basic_widget.js";
 import shortcutService from "../../services/shortcuts.js";
 import server from "../../services/server.js";
 import { Modal } from "bootstrap";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="markdown-import-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -89,7 +90,7 @@ export default class MarkdownImportDialog extends BasicWidget {
 
             this.convertMarkdownToHtml(text);
         } else {
-            utils.openDialog(this.$widget);
+            openDialog(this.$widget);
         }
     }
 

apps/client/src/widgets/dialogs/move_to.ts

@@ -1,5 +1,4 @@
 import noteAutocompleteService from "../../services/note_autocomplete.js";
-import utils from "../../services/utils.js";
 import toastService from "../../services/toast.js";
 import froca from "../../services/froca.js";
 import branchService from "../../services/branches.js";
@@ -7,6 +6,7 @@ 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";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="move-to-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -83,7 +83,7 @@ export default class MoveToDialog extends BasicWidget {
     async moveBranchIdsToEvent({ branchIds }: EventData<"moveBranchIdsTo">) {
         this.movedBranchIds = branchIds;
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         this.$noteAutoComplete.val("").trigger("focus");
 

apps/client/src/widgets/dialogs/password_not_set.ts

@@ -1,5 +1,5 @@
+import { openDialog } from "../../services/dialog.js";
 import { t } from "../../services/i18n.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 
@@ -37,6 +37,6 @@ export default class PasswordNoteSetDialog extends BasicWidget {
     }
 
     showPasswordNotSetEvent() {
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 }

apps/client/src/widgets/dialogs/prompt.ts

@@ -1,5 +1,5 @@
+import { openDialog } from "../../services/dialog.js";
 import { t } from "../../services/i18n.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 
@@ -110,6 +110,6 @@ export default class PromptDialog extends BasicWidget {
 
         this.$dialogBody.empty().append($("<div>").addClass("form-group").append(this.$question).append(this.$answer));
 
-        utils.openDialog(this.$widget, false);
+        openDialog(this.$widget, false);
     }
 }

apps/client/src/widgets/dialogs/protected_session_password.ts

@@ -1,6 +1,6 @@
+import { openDialog } from "../../services/dialog.js";
 import { t } from "../../services/i18n.js";
 import protectedSessionService from "../../services/protected_session.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal } from "bootstrap";
 
@@ -49,7 +49,7 @@ export default class ProtectedSessionPasswordDialog extends BasicWidget {
     }
 
     showProtectedSessionPasswordDialogEvent() {
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         this.$passwordInput.trigger("focus");
     }

apps/client/src/widgets/dialogs/recent_changes.ts

@@ -2,13 +2,12 @@ import { formatDateTime } from "../../utils/formatters.js";
 import { t } from "../../services/i18n.js";
 import appContext, { type EventData } from "../../components/app_context.js";
 import BasicWidget from "../basic_widget.js";
-import dialogService from "../../services/dialog.js";
+import dialogService, { openDialog } from "../../services/dialog.js";
 import froca from "../../services/froca.js";
 import hoistedNoteService from "../../services/hoisted_note.js";
 import linkService from "../../services/link.js";
 import server from "../../services/server.js";
 import toastService from "../../services/toast.js";
-import utils from "../../services/utils.js";
 import ws from "../../services/ws.js";
 import { Modal } from "bootstrap";
 
@@ -62,7 +61,7 @@ export default class RecentChangesDialog extends BasicWidget {
 
         await this.refresh();
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 
     async refresh() {

apps/client/src/widgets/dialogs/revisions.ts

@@ -6,7 +6,7 @@ import appContext from "../../components/app_context.js";
 import openService from "../../services/open.js";
 import protectedSessionHolder from "../../services/protected_session_holder.js";
 import BasicWidget from "../basic_widget.js";
-import dialogService from "../../services/dialog.js";
+import dialogService, { openDialog } from "../../services/dialog.js";
 import options from "../../services/options.js";
 import type FNote from "../../entities/fnote.js";
 import type { NoteType } from "../../entities/fnote.js";
@@ -182,7 +182,7 @@ export default class RevisionsDialog extends BasicWidget {
             return;
         }
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         await this.loadRevisions(noteId);
     }

apps/client/src/widgets/dialogs/sort_child_notes.ts

@@ -1,7 +1,7 @@
 import type { EventData } from "../../components/app_context.js";
+import { closeActiveDialog, openDialog } from "../../services/dialog.js";
 import { t } from "../../services/i18n.js";
 import server from "../../services/server.js";
-import utils from "../../services/utils.js";
 import BasicWidget from "../basic_widget.js";
 
 const TPL = /*html*/`<div class="sort-child-notes-dialog modal mx-auto" tabindex="-1" role="dialog">
@@ -97,14 +97,14 @@ export default class SortChildNotesDialog extends BasicWidget {
 
             await server.put(`notes/${this.parentNoteId}/sort-children`, { sortBy, sortDirection, foldersFirst, sortNatural, sortLocale });
 
-            utils.closeActiveDialog();
+            closeActiveDialog();
         });
     }
 
     async sortChildNotesEvent({ node }: EventData<"sortChildNotes">) {
         this.parentNoteId = node.data.noteId;
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
 
         this.$form.find("input:first").focus();
     }

apps/client/src/widgets/dialogs/upload_attachments.ts

@@ -1,11 +1,12 @@
 import { t } from "../../services/i18n.js";
-import utils, { escapeQuotes } from "../../services/utils.js";
+import { escapeQuotes } from "../../services/utils.js";
 import treeService from "../../services/tree.js";
 import importService from "../../services/import.js";
 import options from "../../services/options.js";
 import BasicWidget from "../basic_widget.js";
 import { Modal, Tooltip } from "bootstrap";
 import type { EventData } from "../../components/app_context.js";
+import { openDialog } from "../../services/dialog.js";
 
 const TPL = /*html*/`
 <div class="upload-attachments-dialog modal fade mx-auto" tabindex="-1" role="dialog">
@@ -98,7 +99,7 @@ export default class UploadAttachmentsDialog extends BasicWidget {
 
         this.$noteTitle.text(await treeService.getNoteTitle(this.parentNoteId));
 
-        utils.openDialog(this.$widget);
+        openDialog(this.$widget);
     }
 
     async uploadAttachments(parentNoteId: string) {