diff --git a/apps/client/src/components/app_context.ts b/apps/client/src/components/app_context.ts
index 319988aa4..34b3df21a 100644
--- a/apps/client/src/components/app_context.ts
+++ b/apps/client/src/components/app_context.ts
@@ -322,6 +322,7 @@ export type CommandMappings = {
     printActiveNote: CommandData;
     exportAsPdf: CommandData;
     openNoteExternally: CommandData;
+    openNoteCustom: CommandData;
     renderActiveNote: CommandData;
     unhoist: CommandData;
     reloadFrontendApp: CommandData;
diff --git a/apps/client/src/widgets/buttons/note_actions.ts b/apps/client/src/widgets/buttons/note_actions.ts
index 0c5e2e34f..05b60230a 100644
--- a/apps/client/src/widgets/buttons/note_actions.ts
+++ b/apps/client/src/widgets/buttons/note_actions.ts
@@ -36,41 +36,6 @@ const TPL = /*html*/`
         }
 
     </style>
-
-    <div class="dropdown-menu dropdown-menu-right">
-
-
-
-        <li data-trigger-command="openNoteExternally" class="dropdown-item open-note-externally-button" title="${t("note_actions.open_note_externally_title")}">
-            <span class="bx bx-file-find"></span> ${t("note_actions.open_note_externally")}<kbd data-command="openNoteExternally"></kbd>
-        </li>
-
-        <li data-trigger-command="openNoteCustom" class="dropdown-item open-note-custom-button">
-            <span class="bx bx-customize"></span> ${t("note_actions.open_note_custom")}<kbd data-command="openNoteCustom"></kbd>
-        </li>
-
-        <li data-trigger-command="showNoteSource" class="dropdown-item show-source-button">
-            <span class="bx bx-code"></span> ${t("note_actions.note_source")}<kbd data-command="showNoteSource"></kbd>
-        </li>
-
-
-        <div class="dropdown-divider"></div>
-
-
-        <li data-trigger-command="forceSaveRevision" class="dropdown-item save-revision-button">
-            <span class="bx bx-save"></span> ${t("note_actions.save_revision")}<kbd data-command="forceSaveRevision"></kbd>
-        </li>
-
-        <li class="dropdown-item delete-note-button"><span class="bx bx-trash destructive-action-icon"></span> ${t("note_actions.delete_note")}</li>
-
-
-        <div class="dropdown-divider"></div>
-
-
-        <li data-trigger-command="showAttachments" class="dropdown-item show-attachments-button">
-            <span class="bx bx-paperclip"></span> ${t("note_actions.note_attachments")}<kbd data-command="showAttachments"></kbd>
-        </li>
-    </div>
 </div>`;
 
 export default class NoteActionsWidget extends NoteContextAwareWidget {
@@ -114,15 +79,6 @@ export default class NoteActionsWidget extends NoteContextAwareWidget {
 
         this.$openNoteExternallyButton = this.$widget.find(".open-note-externally-button");
         this.$openNoteCustomButton = this.$widget.find(".open-note-custom-button");
-
-        this.$deleteNoteButton = this.$widget.find(".delete-note-button");
-        this.$deleteNoteButton.on("click", () => {
-            if (!this.note || this.note.noteId === "root") {
-                return;
-            }
-
-            branchService.deleteNotes([this.note.getParentBranches()[0].branchId], true);
-        });
     }
 
     async refreshVisibility(note: FNote) {
diff --git a/apps/client/src/widgets/ribbon/NoteActions.tsx b/apps/client/src/widgets/ribbon/NoteActions.tsx
index 5393e1618..f5587dbbf 100644
--- a/apps/client/src/widgets/ribbon/NoteActions.tsx
+++ b/apps/client/src/widgets/ribbon/NoteActions.tsx
@@ -13,6 +13,7 @@ import { isElectron as getIsElectron } from "../../services/utils";
 import { ParentComponent } from "../react/react_utils";
 import { useContext } from "preact/hooks";
 import NoteContext from "../../components/note_context";
+import branches from "../../services/branches";
 
 interface NoteActionsProps {
   note?: FNote;
@@ -74,13 +75,27 @@ function NoteContextMenu(props: NoteActionsProps) {
           defaultType: "single"
         })} />
       <FormDropdownDivider />
+
+      <CommandItem command="openNoteExternally" icon="bx bx-file-find" text={t("note_actions.open_note_externally")} title={t("note_actions.open_note_externally_title")} />
+      <CommandItem command="openNoteCustom" icon="bx bx-customize" text={t("note_actions.open_note_custom")} />
+      <CommandItem command="showNoteSource" icon="bx bx-code" text={t("note_actions.note_source")} />
+      <FormDropdownDivider />
+
+      <CommandItem command="forceSaveRevision" icon="bx bx-save" text={t("note_actions.save_revision")} />
+      <CommandItem icon="bx bx-trash destructive-action-icon" text={t("note_actions.delete_note")} destructive
+        command={() => branches.deleteNotes([note.getParentBranches()[0].branchId])}
+      />
+      <FormDropdownDivider />
+
+      <CommandItem command="showAttachments" icon="bx bx-paperclip" text={t("note_actions.note_attachments")} />
     </Dropdown>
   );
 }
 
-function CommandItem({ icon, text, command, disabled }: { icon: string, text: string, command: CommandNames | (() => void), disabled?: boolean }) {
+function CommandItem({ icon, text, title, command, disabled }: { icon: string, text: string, title?: string, command: CommandNames | (() => void), disabled?: boolean, destructive?: boolean }) {
   return <FormListItem
     icon={icon}
+    title={title}
     triggerCommand={typeof command === "string" ? command : undefined}
     onClick={typeof command === "function" ? command : undefined}
     disabled={disabled}