${attr.name}`,
- source: (await linkService.createLink(attr.noteId)).html()
- })
- )
- );
- }
- }
-
- async showDeleteNotesDialogEvent({ branchIdsToDelete, callback, forceDeleteAllClones }: ShowDeleteNotesDialogOpts) {
- this.branchIds = branchIdsToDelete;
- this.forceDeleteAllClones = forceDeleteAllClones;
-
- await this.renderDeletePreview();
-
- openDialog(this.$widget);
-
- this.$deleteAllClones.prop("checked", !!forceDeleteAllClones).prop("disabled", !!forceDeleteAllClones);
-
- this.$eraseNotes.prop("checked", false);
-
- this.resolve = callback;
- }
-
- isDeleteAllClonesChecked() {
- return this.$deleteAllClones.is(":checked");
- }
-
- isEraseNotesChecked() {
- return this.$eraseNotes.is(":checked");
- }
-}
diff --git a/apps/client/src/widgets/dialogs/delete_notes.tsx b/apps/client/src/widgets/dialogs/delete_notes.tsx
new file mode 100644
index 000000000..4a09f5b90
--- /dev/null
+++ b/apps/client/src/widgets/dialogs/delete_notes.tsx
@@ -0,0 +1,182 @@
+import { useRef, useState } from "preact/hooks";
+import { closeActiveDialog, openDialog } from "../../services/dialog.js";
+import { t } from "../../services/i18n.js";
+import FormCheckbox from "../react/FormCheckbox.js";
+import Modal from "../react/Modal.js";
+import ReactBasicWidget from "../react/ReactBasicWidget.js";
+import { useEffect } from "react";
+import type { DeleteNotesPreview } from "@triliumnext/commons";
+import server from "../../services/server.js";
+import froca from "../../services/froca.js";
+import FNote from "../../entities/fnote.js";
+import link from "../../services/link.js";
+import Button from "../react/Button.jsx";
+
+export interface ResolveOptions {
+ proceed: boolean;
+ deleteAllClones?: boolean;
+ eraseNotes?: boolean;
+}
+
+interface ShowDeleteNotesDialogOpts {
+ branchIdsToDelete?: string[];
+ callback?: (opts: ResolveOptions) => void;
+ forceDeleteAllClones?: boolean;
+}
+
+interface ShowDeleteNotesDialogProps extends ShowDeleteNotesDialogOpts { }
+
+interface BrokenRelationData {
+ note: string;
+ relation: string;
+ source: string;
+}
+
+function DeleteNotesDialogComponent({ forceDeleteAllClones, branchIdsToDelete, callback }: ShowDeleteNotesDialogProps) {
+ const [ deleteAllClones, setDeleteAllClones ] = useState(false);
+ const [ eraseNotes, setEraseNotes ] = useState(!!forceDeleteAllClones);
+ const [ brokenRelations, setBrokenRelations ] = useState${attr.name}`,
+ source: (await link.createLink(attr.noteId)).html()
+ });
+ }
+ setNotesWithBrokenRelations(notesWithBrokenRelations);
+ });
+ }, [brokenRelations]);
+
+ if (brokenRelations.length) {
+ return (
+