feat(popup_editor): create an empty modal with auto-trigger

apps/client/src/layouts/desktop_layout.ts

@@ -94,6 +94,7 @@ import ToggleReadOnlyButton from "../widgets/floating_buttons/toggle_read_only_b
 import PngExportButton from "../widgets/floating_buttons/png_export_button.js";
 import RefreshButton from "../widgets/floating_buttons/refresh_button.js";
 import { applyModals } from "./layout_commons.js";
+import PopupEditorDialog from "../widgets/dialogs/popup_editor.js";
 
 export default class DesktopLayout {
 
@@ -257,7 +258,8 @@ export default class DesktopLayout {
 
             // Desktop-specific dialogs.
             .child(new PasswordNoteSetDialog())
-            .child(new UploadAttachmentsDialog());
+            .child(new UploadAttachmentsDialog())
+            .child(new PopupEditorDialog());
 
         applyModals(rootContainer);
         return rootContainer;

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

@@ -0,0 +1,42 @@
+import { openDialog } from "../../services/dialog.js";
+import BasicWidget from "../basic_widget.js";
+
+const TPL = /*html*/`\
+<div class="popup-editor-dialog modal fade mx-auto" tabindex="-1" role="dialog">
+    <div class="modal-dialog modal-lg" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">Popup editor</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+
+            <div class="modal-body">
+                Hi
+            </div>
+        </div>
+    </div>
+</div>
+`;
+
+export default class PopupEditorDialog extends BasicWidget {
+
+    constructor() {
+        super();
+        setTimeout(() => {
+            this.openPopupEditorEvent("7mLWh47uEPEp");
+        }, 750);
+    }
+
+    doRender() {
+        this.$widget = $(TPL);
+    }
+
+    async refresh() {
+
+    }
+
+    async openPopupEditorEvent(noteId: string) {
+        await this.refresh();
+        openDialog(this.$widget);
+    }
+}