delete notes skeleton dialog

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "trilium",
-  "version": "0.46.3-beta",
+  "version": "0.46.4-beta",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

src/public/app/dialogs/delete_notes.js

@@ -0,0 +1,54 @@
+const $dialog = $("#delete-notes-dialog");
+const $confirmContent = $("#delete-notes-dialog-content");
+const $okButton = $("#delete-notes-dialog-ok-button");
+const $cancelButton = $("#delete-notes-dialog-cancel-button");
+const $custom = $("#delete-notes-dialog-custom");
+
+const DELETE_NOTE_BUTTON_ID = "delete-notes-dialog-delete-note";
+
+let $originallyFocused; // element focused before the dialog was opened so we can return to it afterwards
+
+export function showDialog(message) {
+    $originallyFocused = $(':focus');
+
+    $custom.hide();
+
+    glob.activeDialog = $dialog;
+
+    if (typeof message === 'string') {
+        message = $("<div>").text(message);
+    }
+
+    $confirmContent.empty().append(message);
+
+    $dialog.modal();
+
+    return new Promise((res, rej) => { resolve = res; });
+}
+
+export function isDeleteNoteChecked() {
+    return $("#" + DELETE_NOTE_BUTTON_ID + ":checked").length > 0;
+}
+
+$dialog.on('shown.bs.modal', () => $okButton.trigger("focus"));
+
+$dialog.on("hidden.bs.modal", () => {
+    if (resolve) {
+        resolve(false);
+    }
+
+    if ($originallyFocused) {
+        $originallyFocused.trigger('focus');
+        $originallyFocused = null;
+    }
+});
+
+function doResolve(ret) {
+    resolve(ret);
+    resolve = null;
+
+    $dialog.modal("hide");
+}
+
+$cancelButton.on('click', () => doResolve(false));
+$okButton.on('click', () => doResolve(true));

src/public/app/services/branches.js

@@ -74,6 +74,9 @@ async function deleteNotes(branchIdsToDelete) {
         return false;
     }
 
+    const deleteNotesDialog = await import("../dialogs/delete_notes.js");
+    deleteNotesDialog.showDialog();
+
     const $deleteClonesCheckbox = $('<div class="form-check">')
         .append($('<input type="checkbox" class="form-check-input" id="delete-clones-checkbox">'))
         .append($('<label for="delete-clones-checkbox">')
@@ -93,11 +96,7 @@ async function deleteNotes(branchIdsToDelete) {
         .append($nodeTitles)
         .append($deleteClonesCheckbox);
 
-    const confirmDialog = await import('../dialogs/confirm.js');
-
-    if (!await confirmDialog.confirm($confirmText)) {
-        return false;
-    }
+    return false;
 
     const deleteClones = $deleteClonesCheckbox.find("input").is(":checked");
 

src/views/desktop.ejs

@@ -40,6 +40,7 @@
 <%- include('dialogs/backend_log.ejs') %>
 <%- include('dialogs/include_note.ejs') %>
 <%- include('dialogs/sort_child_notes.ejs') %>
+<%- include('dialogs/delete_notes.ejs') %>
 
 <script type="text/javascript">
     window.baseApiUrl = 'api/';

src/views/dialogs/delete_notes.ejs

@@ -0,0 +1,23 @@
+<div id="delete-notes-dialog" class="modal mx-auto" tabindex="-1" role="dialog">
+    <div class="modal-dialog modal-dialog-scrollable" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title mr-auto">Delete notes</h5>
+
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                ... delete
+            </div>
+            <div class="modal-footer">
+                <button class="btn btn-sm" id="delete-notes-dialog-cancel-button">Cancel</button>
+
+                &nbsp;
+
+                <button class="btn btn-primary btn-sm" id="delete-notes-dialog-ok-button">OK</button>
+            </div>
+        </div>
+    </div>
+</div>