converted password not set dialog to new pattern

src/public/app/dialogs/password_not_set.js

@@ -1,13 +0,0 @@
-import utils from "../services/utils.js";
-import appContext from "../services/app_context.js";
-
-export function show() {
-    const $dialog = $("#password-not-set-dialog");
-    const $openPasswordOptionsButton = $("#open-password-options-button");
-
-    utils.openDialog($dialog);
-
-    $openPasswordOptionsButton.on("click", () => {
-        appContext.triggerCommand("showOptions", { openTab: 'password' });
-    });
-}

src/public/app/layouts/desktop_layout.js

@@ -58,6 +58,7 @@ import RecentChangesDialog from "../widgets/dialogs/recent_changes.js";
 import BackendLogDialog from "../widgets/dialogs/backend_log.js";
 import BranchPrefixDialog from "../widgets/dialogs/branch_prefix.js";
 import SortChildNotesDialog from "../widgets/dialogs/sort_child_notes.js";
+import PasswordNoteSetDialog from "../widgets/dialogs/password_not_set.js";
 
 export default class DesktopLayout {
     constructor(customWidgets) {
@@ -190,6 +191,7 @@ export default class DesktopLayout {
             .child(new RecentChangesDialog())
             .child(new BackendLogDialog())
             .child(new BranchPrefixDialog())
-            .child(new SortChildNotesDialog());
+            .child(new SortChildNotesDialog())
+            .child(new PasswordNoteSetDialog());
     }
 }

src/public/app/services/protected_session.js

@@ -20,7 +20,7 @@ function enterProtectedSession() {
     const dfd = $.Deferred();
 
     if (!options.is("isPasswordSet")) {
-        import("../dialogs/password_not_set.js").then(dialog => dialog.show());
+        appContext.triggerCommand("showPasswordNotSet");
         return dfd;
     }
 

src/public/app/widgets/dialogs/password_not_set.js

@@ -0,0 +1,38 @@
+import utils from "../../services/utils.js";
+import BasicWidget from "../basic_widget.js";
+
+const TPL = `
+<div class="password-not-set-dialog modal fade mx-auto" tabindex="-1" role="dialog">
+    <div class="modal-dialog modal-md" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title mr-auto">Password is not set</h5>
+
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="margin-left: 0;">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                Protected notes are encrypted using a user password, but password has not been set yet.
+
+                To be able to protect notes, <a class="open-password-options-button" href="javascript:">
+                    click here to open the Options dialog</a> and set your password.
+            </div>
+        </div>
+    </div>
+</div>
+`;
+
+export default class PasswordNoteSetDialog extends BasicWidget {
+    doRender() {
+        this.$widget = $(TPL);
+        this.$openPasswordOptionsButton = this.$widget.find(".open-password-options-button");
+        this.$openPasswordOptionsButton.on("click", () => {
+            this.triggerCommand("showOptions", { openTab: 'password' });
+        });
+    }
+
+    showPasswordNotSetEvent() {
+        utils.openDialog(this.$widget);
+    }
+}

src/views/desktop.ejs

@@ -32,7 +32,6 @@
 <%- include('dialogs/move_to.ejs') %>
 <%- include('dialogs/include_note.ejs') %>
 <%- include('dialogs/delete_notes.ejs') %>
-<%- include('dialogs/password_not_set.ejs') %>
 <%- include('dialogs/note_type_chooser.ejs') %>
 
 <script type="text/javascript">

src/views/dialogs/password_not_set.ejs

@@ -1,19 +0,0 @@
-<div id="password-not-set-dialog" class="modal fade mx-auto" tabindex="-1" role="dialog">
-    <div class="modal-dialog modal-md" role="document">
-        <div class="modal-content">
-            <div class="modal-header">
-                <h5 class="modal-title mr-auto">Password is not set</h5>
-
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="margin-left: 0;">
-                    <span aria-hidden="true">&times;</span>
-                </button>
-            </div>
-            <div class="modal-body">
-                Protected notes are encrypted using a user password, but password has not been set yet.
-
-                To be able to protect notes, <a id="open-password-options-button" href="javascript:">
-                    click here to open the Options dialog</a> and set your password.
-            </div>
-        </div>
-    </div>
-</div>