From 185133686230f9b42e42b2210c1d91cabb948a17 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Wed, 27 Aug 2025 16:16:25 +0300 Subject: [PATCH] fix(react/ribbon): solve some type errors --- .../widgets/containers/ribbon_container.ts | 78 ------------------- apps/client/src/widgets/note_title.tsx | 6 +- .../client/src/widgets/react/FormCheckbox.tsx | 2 +- .../src/widgets/ribbon/BasicPropertiesTab.tsx | 2 +- 4 files changed, 5 insertions(+), 83 deletions(-) delete mode 100644 apps/client/src/widgets/containers/ribbon_container.ts diff --git a/apps/client/src/widgets/containers/ribbon_container.ts b/apps/client/src/widgets/containers/ribbon_container.ts deleted file mode 100644 index a2a8c0f84..000000000 --- a/apps/client/src/widgets/containers/ribbon_container.ts +++ /dev/null @@ -1,78 +0,0 @@ -import NoteContextAwareWidget from "../note_context_aware_widget.js"; -import keyboardActionsService from "../../services/keyboard_actions.js"; -import attributeService from "../../services/attributes.js"; -import type CommandButtonWidget from "../buttons/command_button.js"; -import type FNote from "../../entities/fnote.js"; -import type { NoteType } from "../../entities/fnote.js"; -import type { EventData, EventNames } from "../../components/app_context.js"; -import type NoteActionsWidget from "../buttons/note_actions.js"; - -type ButtonWidget = (CommandButtonWidget | NoteActionsWidget); - -export default class RibbonContainer extends NoteContextAwareWidget { - - private lastActiveComponentId?: string | null; - private lastNoteType?: NoteType; - - private ribbonWidgets: NoteContextAwareWidget[]; - private buttonWidgets: ButtonWidget[]; - private $tabContainer!: JQuery; - private $buttonContainer!: JQuery; - private $bodyContainer!: JQuery; - - constructor() { - super(); - - this.contentSized(); - this.ribbonWidgets = []; - this.buttonWidgets = []; - } - - - async handleEventInChildren(name: T, data: EventData) { - if (["activeContextChanged", "setNoteContext"].includes(name)) { - // won't trigger .refresh(); - await super.handleEventInChildren("setNoteContext", data as EventData<"activeContextChanged" | "setNoteContext">); - } else if (this.isEnabled() || name === "initialRenderComplete") { - const activeRibbonWidget = this.getActiveRibbonWidget(); - - // forward events only to active ribbon tab, inactive ones don't need to be updated - if (activeRibbonWidget) { - await activeRibbonWidget.handleEvent(name, data); - } - - for (const buttonWidget of this.buttonWidgets) { - await buttonWidget.handleEvent(name, data); - } - } - } - - entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) { - if (!this.note) { - return; - } - - if (this.noteId && loadResults.isNoteReloaded(this.noteId) && this.lastNoteType !== this.note.type) { - // note type influences the list of available ribbon tabs the most - // check for the type is so that we don't update on each title rename - this.lastNoteType = this.note.type; - - this.refresh(); - } else if (loadResults.getAttributeRows(this.componentId).find((attr) => attributeService.isAffecting(attr, this.note))) { - this.refreshWithNote(this.note, true); - } - } - /** - * Executed as soon as the user presses the "Edit" floating button in a read-only text note. - * - *

- * We need to refresh the ribbon for cases such as the classic editor which relies on the read-only state. - */ - readOnlyTemporarilyDisabledEvent() { - this.refresh(); - } - - getActiveRibbonWidget() { - return this.ribbonWidgets.find((ch) => ch.componentId === this.lastActiveComponentId); - } -} diff --git a/apps/client/src/widgets/note_title.tsx b/apps/client/src/widgets/note_title.tsx index e6b43051b..5b27f0ab0 100644 --- a/apps/client/src/widgets/note_title.tsx +++ b/apps/client/src/widgets/note_title.tsx @@ -1,7 +1,7 @@ import { useEffect, useRef, useState } from "preact/hooks"; import { t } from "../services/i18n"; import FormTextBox from "./react/FormTextBox"; -import { useNoteContext, useNoteProperty, useSpacedUpdate, useTriliumEvent } from "./react/hooks"; +import { useNoteContext, useNoteProperty, useSpacedUpdate, useTriliumEvent, useTriliumEvents } from "./react/hooks"; import protected_session_holder from "../services/protected_session_holder"; import server from "../services/server"; import "./note_title.css"; @@ -48,12 +48,12 @@ export default function NoteTitleWidget() { useEffect(() => { appContext.addBeforeUnloadListener(() => spacedUpdate.isAllSavedAndTriggerUpdate()); }, []); - useTriliumEvent([ "beforeNoteSwitch", "beforeNoteContextRemove" ], () => spacedUpdate.updateNowIfNecessary()); + useTriliumEvents([ "beforeNoteSwitch", "beforeNoteContextRemove" ], () => spacedUpdate.updateNowIfNecessary()); // Manage focus. const textBoxRef = useRef(null); const isNewNote = useRef(); - useTriliumEvent([ "focusOnTitle", "focusAndSelectTitle" ], (e) => { + useTriliumEvents([ "focusOnTitle", "focusAndSelectTitle" ], (e) => { if (noteContext?.isActive() && textBoxRef.current) { textBoxRef.current.focus(); isNewNote.current = ("isNewNote" in e ? e.isNewNote : false); diff --git a/apps/client/src/widgets/react/FormCheckbox.tsx b/apps/client/src/widgets/react/FormCheckbox.tsx index 873c6a8fc..55e0797b3 100644 --- a/apps/client/src/widgets/react/FormCheckbox.tsx +++ b/apps/client/src/widgets/react/FormCheckbox.tsx @@ -6,7 +6,7 @@ import { CSSProperties, memo } from "preact/compat"; import { useUniqueName } from "./hooks"; interface FormCheckboxProps { - name: string; + name?: string; label: string | ComponentChildren; /** * If set, the checkbox label will be underlined and dotted, indicating a hint. When hovered, it will show the hint text. diff --git a/apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx b/apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx index f78379b77..372a778c8 100644 --- a/apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx +++ b/apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx @@ -124,7 +124,7 @@ function ProtectedNoteSwitch({ note }: { note?: FNote | null }) { note && protected_session.protectNote(note.noteId, shouldProtect, false)} />