refactor(react/note_title): use hook for listening to note property

This commit is contained in:
Elian Doran 2025-08-21 10:44:58 +03:00
parent 9a4fdcaef2
commit db2bf537ea
No known key found for this signature in database
2 changed files with 19 additions and 7 deletions

View File

@ -1,7 +1,7 @@
import { useEffect, useRef, useState } from "preact/hooks";
import { t } from "../services/i18n";
import FormTextBox from "./react/FormTextBox";
import { useNoteContext, useSpacedUpdate, useTriliumEventBeta } from "./react/hooks";
import { useNoteContext, useNoteProperty, useSpacedUpdate, useTriliumEventBeta } from "./react/hooks";
import protected_session_holder from "../services/protected_session_holder";
import server from "../services/server";
import "./note_title.css";
@ -9,9 +9,8 @@ import "./note_title.css";
export default function NoteTitleWidget() {
const { note, noteId, componentId } = useNoteContext();
const [ title, setTitle ] = useState(note?.title);
const [ isProtected, setProtected ] = useState(note?.isProtected);
const isProtected = useNoteProperty(note, "isProtected");
useEffect(() => setTitle(note?.title), [ note?.noteId ]);
useEffect(() => setProtected(note?.isProtected), [ note?.isProtected ]);
const spacedUpdate = useSpacedUpdate(async () => {
if (!note) {
@ -21,10 +20,7 @@ export default function NoteTitleWidget() {
await server.put<void>(`notes/${noteId}/title`, { title: title }, componentId);
});
useTriliumEventBeta("entitiesReloaded", ({ loadResults }) => {
if (loadResults.isNoteReloaded(noteId) && note) {
setProtected(note.isProtected);
}
useTriliumEventBeta("entitiesReloaded", ({ loadResults }) => {
if (loadResults.isNoteReloaded(noteId, componentId)) {
setTitle(note?.title);
}

View File

@ -8,6 +8,7 @@ import utils, { reloadFrontendApp } from "../../services/utils";
import Component from "../../components/component";
import NoteContext from "../../components/note_context";
import { ReactWrappedWidget } from "../basic_widget";
import FNote from "../../entities/fnote";
type TriliumEventHandler<T extends EventNames> = (data: EventData<T>) => void;
const registeredHandlers: Map<Component, Map<EventNames, TriliumEventHandler<any>[]>> = new Map();
@ -261,4 +262,19 @@ export function useNoteContext() {
componentId: parentComponent.componentId
};
}
export function useNoteProperty<T extends keyof FNote>(note: FNote | null | undefined, property: T) {
if (!note) {
return null;
}
const [ value, setValue ] = useState<FNote[T]>(note[property]);
useEffect(() => setValue(value), [ note[property] ]);
useTriliumEventBeta("entitiesReloaded", ({ loadResults }) => {
if (loadResults.isNoteReloaded(note.noteId)) {
setValue(note[property]);
}
});
return value;
}