chore(react/note_title): add before unload listener

apps/client/src/widgets/note_title.bak

@@ -1,13 +1,8 @@
-import { t } from "../services/i18n.js";
 import NoteContextAwareWidget from "./note_context_aware_widget.js";
-import protectedSessionHolder from "../services/protected_session_holder.js";
-import server from "../services/server.js";
 import SpacedUpdate from "../services/spaced_update.js";
 import appContext, { type EventData } from "../components/app_context.js";
 import branchService from "../services/branches.js";
 import shortcutService from "../services/shortcuts.js";
-import utils from "../services/utils.js";
-import type FNote from "../entities/fnote.js";
 
 export default class NoteTitleWidget extends NoteContextAwareWidget {
 
@@ -19,16 +14,11 @@ export default class NoteTitleWidget extends NoteContextAwareWidget {
         super();
 
         this.deleteNoteOnEscape = false;
-
-        appContext.addBeforeUnloadListener(this);
     }
 
     doRender() {
         this.$widget = $(TPL);
         this.$noteTitle = this.$widget.find(".note-title");
-
-        this.$noteTitle.on("input", () => this.spacedUpdate.scheduleUpdate());
-
         this.$noteTitle.on("blur", () => {
             this.spacedUpdate.updateNowIfNecessary();
 
@@ -71,8 +61,4 @@ export default class NoteTitleWidget extends NoteContextAwareWidget {
             this.deleteNoteOnEscape = isNewNote;
         }
     }
-
-    beforeUnloadEvent() {
-        return this.spacedUpdate.isAllSavedAndTriggerUpdate();
-    }
 }

apps/client/src/widgets/note_title.tsx

@@ -1,11 +1,12 @@
 import { useEffect, useRef, useState } from "preact/hooks";
 import { t } from "../services/i18n";
 import FormTextBox from "./react/FormTextBox";
-import { useNoteContext, useNoteProperty, useSpacedUpdate } from "./react/hooks";
+import { useBeforeUnload, useNoteContext, useNoteProperty, useSpacedUpdate } from "./react/hooks";
 import protected_session_holder from "../services/protected_session_holder";
 import server from "../services/server";
 import "./note_title.css";
 import { isLaunchBarConfig } from "../services/utils";
+import appContext from "../components/app_context";
 
 export default function NoteTitleWidget() {
     const { note, noteId, componentId, viewScope, noteContext } = useNoteContext();    
@@ -39,6 +40,10 @@ export default function NoteTitleWidget() {
         await server.put<void>(`notes/${noteId}/title`, { title: newTitle.current }, componentId);
     });    
 
+    useEffect(() => {
+        appContext.addBeforeUnloadListener(() => spacedUpdate.isAllSavedAndTriggerUpdate());
+    }, []);
+
     return (
         <div className="note-title-widget">
             {note && <FormTextBox

apps/client/src/widgets/react/hooks.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useContext, useEffect, useMemo, useRef, useState } from "preact/hooks";
-import { EventData, EventNames } from "../../components/app_context";
+import appContext, { BeforeUploadListener, EventData, EventNames } from "../../components/app_context";
 import { ParentComponent } from "./react_utils";
 import SpacedUpdate from "../../services/spaced_update";
 import { OptionNames } from "@triliumnext/commons";
@@ -10,6 +10,7 @@ import NoteContext from "../../components/note_context";
 import { ReactWrappedWidget } from "../basic_widget";
 import FNote from "../../entities/fnote";
 import froca from "../../services/froca";
+import toast from "../../services/toast";
 
 type TriliumEventHandler<T extends EventNames> = (data: EventData<T>) => void;
 const registeredHandlers: Map<Component, Map<EventNames, TriliumEventHandler<any>[]>> = new Map();
@@ -302,4 +303,4 @@ export function useNoteProperty<T extends keyof FNote>(note: FNote | null | unde
     });
 
     return note[property];
-}
+}