From 6f6f280bdd7140405c0c6ca0c1275f45942d2af7 Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Sun, 24 Aug 2025 23:56:05 +0300 Subject: [PATCH] chore(react/ribbon): add part of the note actions menu --- .../src/widgets/buttons/note_actions.ts | 52 +------------------ .../client/src/widgets/ribbon/NoteActions.tsx | 43 ++++++++++++++- apps/client/src/widgets/ribbon/Ribbon.tsx | 2 +- 3 files changed, 43 insertions(+), 54 deletions(-) diff --git a/apps/client/src/widgets/buttons/note_actions.ts b/apps/client/src/widgets/buttons/note_actions.ts index 0ddd31b30..0c5e2e34f 100644 --- a/apps/client/src/widgets/buttons/note_actions.ts +++ b/apps/client/src/widgets/buttons/note_actions.ts @@ -38,31 +38,6 @@ const TPL = /*html*/`
-
  • - ${t("note_actions.re_render_note")} -
    • - -
  • - ${t("note_actions.search_in_note")} -
    • - -
  • - ${t("note_actions.print_note")} -
    • - -
  • - ${t("note_actions.print_pdf")} -
    • - -
    - - -
  • ${t("note_actions.import_files")}
    • - -
  • ${t("note_actions.export_note")}
    • - - -
    @@ -135,25 +110,6 @@ export default class NoteActionsWidget extends NoteContextAwareWidget { this.$renderNoteButton = this.$widget.find(".render-note-button"); this.$saveRevisionButton = this.$widget.find(".save-revision-button"); - this.$exportNoteButton = this.$widget.find(".export-note-button"); - this.$exportNoteButton.on("click", () => { - if (this.$exportNoteButton.hasClass("disabled") || !this.noteContext?.notePath) { - return; - } - - this.triggerCommand("showExportDialog", { - notePath: this.noteContext.notePath, - defaultType: "single" - }); - }); - - this.$importNoteButton = this.$widget.find(".import-files-button"); - this.$importNoteButton.on("click", () => { - if (this.noteId) { - this.triggerCommand("showImportDialog", { noteId: this.noteId }); - } - }); - this.$widget.on("click", ".dropdown-item", () => this.$widget.find("[data-bs-toggle='dropdown']").dropdown("toggle")); this.$openNoteExternallyButton = this.$widget.find(".open-note-externally-button"); @@ -170,22 +126,16 @@ export default class NoteActionsWidget extends NoteContextAwareWidget { } async refreshVisibility(note: FNote) { - const isInOptions = note.noteId.startsWith("_options"); - this.$convertNoteIntoAttachmentButton.toggle(note.isEligibleForConversionToAttachment()); - this.toggleDisabled(this.$findInTextButton, ["text", "code", "book", "mindMap", "doc"].includes(note.type)); - this.toggleDisabled(this.$showAttachmentsButton, !isInOptions); this.toggleDisabled(this.$showSourceButton, ["text", "code", "relationMap", "mermaid", "canvas", "mindMap"].includes(note.type)); - const canPrint = ["text", "code"].includes(note.type); + this.toggleDisabled(this.$printActiveNoteButton, canPrint); this.toggleDisabled(this.$exportAsPdfButton, canPrint); this.$exportAsPdfButton.toggleClass("hidden-ext", !utils.isElectron()); - this.$renderNoteButton.toggle(note.type === "render"); - this.toggleDisabled(this.$openNoteExternallyButton, utils.isElectron() && !["search", "book"].includes(note.type)); this.toggleDisabled( this.$openNoteCustomButton, diff --git a/apps/client/src/widgets/ribbon/NoteActions.tsx b/apps/client/src/widgets/ribbon/NoteActions.tsx index cf3f0b2db..5393e1618 100644 --- a/apps/client/src/widgets/ribbon/NoteActions.tsx +++ b/apps/client/src/widgets/ribbon/NoteActions.tsx @@ -1,5 +1,5 @@ import { ConvertToAttachmentResponse } from "@triliumnext/commons"; -import appContext from "../../components/app_context"; +import appContext, { CommandNames } from "../../components/app_context"; import FNote from "../../entities/fnote" import dialog from "../../services/dialog"; import { t } from "../../services/i18n" @@ -8,10 +8,15 @@ import toast from "../../services/toast"; import ws from "../../services/ws"; import ActionButton from "../react/ActionButton" import Dropdown from "../react/Dropdown"; -import { FormListItem } from "../react/FormList"; +import { FormDropdownDivider, FormListItem } from "../react/FormList"; +import { isElectron as getIsElectron } from "../../services/utils"; +import { ParentComponent } from "../react/react_utils"; +import { useContext } from "preact/hooks"; +import NoteContext from "../../components/note_context"; interface NoteActionsProps { note?: FNote; + noteContext?: NoteContext; } export default function NoteActions(props: NoteActionsProps) { @@ -37,6 +42,17 @@ function RevisionsButton({ note }: NoteActionsProps) { } function NoteContextMenu(props: NoteActionsProps) { + const { note, noteContext } = props; + if (!note) { + return <>; + } + + const parentComponent = useContext(ParentComponent); + const isSearchable = ["text", "code", "book", "mindMap", "doc"].includes(note.type); + const isInOptions = note.noteId.startsWith("_options"); + const isPrintable = ["text", "code"].includes(note.type); + const isElectron = getIsElectron(); + return ( + {note.type === "render" && } + + + {isElectron && } + + + parentComponent?.triggerCommand("showImportDialog", { noteId: note.noteId })} /> + noteContext?.notePath && parentComponent?.triggerCommand("showExportDialog", { + notePath: noteContext.notePath, + defaultType: "single" + })} /> + ); } +function CommandItem({ icon, text, command, disabled }: { icon: string, text: string, command: CommandNames | (() => void), disabled?: boolean }) { + return {text} +} + function ConvertToAttachment({ note }: NoteActionsProps) { return (note?.isEligibleForConversionToAttachment() &&
    - + { note && }