gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-12 18:34:24 +01:00
Code Issues Actions 7 Packages Projects Releases Wiki Activity

feat(note_actions): integrate bookmark into new layout

Browse Source
This commit is contained in:
Elian Doran 2025-12-10 18:20:23 +02:00
parent b39a6bcc97
commit f18ac3a923
No known key found for this signature in database
2 changed files with 45 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx
View File

@ -21,6 +21,9 @@ import Modal from "../react/Modal";
import { CodeMimeTypesList } from "../type_widgets/options/code_notes";
import { ContentLanguagesList } from "../type_widgets/options/i18n";
import { LocaleSelector } from "../type_widgets/options/components/LocaleSelector";
import { isExperimentalFeatureEnabled } from "../../services/experimental_features";
const isNewLayout = isExperimentalFeatureEnabled("new-layout");
export default function BasicPropertiesTab({ note }: TabContext) {
return (
@ -28,7 +31,7 @@ export default function BasicPropertiesTab({ note }: TabContext) {
<NoteTypeWidget note={note} />
<ProtectedNoteSwitch note={note} />
<EditabilitySelect note={note} />
<BookmarkSwitch note={note} />
{!isNewLayout && <BookmarkSwitch note={note} />}
<SharedSwitch note={note} />
<TemplateSwitch note={note} />
<NoteLanguageSwitch note={note} />
@ -191,18 +194,7 @@ function EditabilitySelect({ note }: { note?: FNote | null }) {
}
function BookmarkSwitch({ note }: { note?: FNote | null }) {
const [ isBookmarked, setIsBookmarked ] = useState<boolean>(false);
const refreshState = useCallback(() => {
const isBookmarked = note && !!note.getParentBranches().find((b) => b.parentNoteId === "_lbBookmarks");
setIsBookmarked(!!isBookmarked);
}, [ note ]);
useEffect(() => refreshState(), [ note ]);
useTriliumEvent("entitiesReloaded", ({ loadResults }) => {
if (note && loadResults.getBranchRows().find((b) => b.noteId === note.noteId)) {
refreshState();
}
});
const [ isBookmarked, setIsBookmarked ] = useNoteBookmarkState(note);
return (
<div className="bookmark-switch-container">
@ -210,18 +202,36 @@ function BookmarkSwitch({ note }: { note?: FNote | null }) {
switchOnName={t("bookmark_switch.bookmark")} switchOnTooltip={t("bookmark_switch.bookmark_this_note")}
switchOffName={t("bookmark_switch.bookmark")} switchOffTooltip={t("bookmark_switch.remove_bookmark")}
currentValue={isBookmarked}
onChange={async (shouldBookmark) => {
onChange={setIsBookmarked}
disabled={["root", "_hidden"].includes(note?.noteId ?? "")}
/>
</div>
);
}
export function useNoteBookmarkState(note: FNote | null | undefined) {
const [ isBookmarked, setIsBookmarked ] = useState<boolean>(false);
const refreshState = useCallback(() => {
const isBookmarked = note && !!note.getParentBranches().find((b) => b.parentNoteId === "_lbBookmarks");
setIsBookmarked(!!isBookmarked);
}, [ note ]);
const changeHandler = useCallback(async (shouldBookmark: boolean) => {
if (!note) return;
const resp = await server.put<ToggleInParentResponse>(`notes/${note.noteId}/toggle-in-parent/_lbBookmarks/${shouldBookmark}`);
if (!resp.success && "message" in resp) {
toast.showError(resp.message);
}
}}
disabled={["root", "_hidden"].includes(note?.noteId ?? "")}
/>
</div>
)
}, [ note ]);
useEffect(() => refreshState(), [ refreshState ]);
useTriliumEvent("entitiesReloaded", ({ loadResults }) => {
if (note && loadResults.getBranchRows().find((b) => b.noteId === note.noteId)) {
refreshState();
}
});
return [ isBookmarked, changeHandler ] as const;
}
function TemplateSwitch({ note }: { note?: FNote | null }) {

14
apps/client/src/widgets/ribbon/NoteActions.tsx
View File

@ -13,10 +13,11 @@ import { isElectron as getIsElectron, isMac as getIsMac } from "../../services/u
import ws from "../../services/ws";
import ActionButton from "../react/ActionButton";
import Dropdown from "../react/Dropdown";
import { FormDropdownDivider, FormDropdownSubmenu, FormListItem } from "../react/FormList";
import { FormDropdownDivider, FormDropdownSubmenu, FormListItem, FormListToggleableItem } from "../react/FormList";
import { useIsNoteReadOnly, useNoteContext, useNoteLabel, useNoteProperty, useTriliumOption } from "../react/hooks";
import { ParentComponent } from "../react/react_utils";
import { isExperimentalFeatureEnabled } from "../../services/experimental_features";
import { useNoteBookmarkState } from "./BasicPropertiesTab";
const isNewLayout = isExperimentalFeatureEnabled("new-layout");
@ -79,6 +80,9 @@ function NoteContextMenu({ note, noteContext }: { note: FNote, noteContext?: Not
{isElectron && <CommandItem command="exportAsPdf" icon="bx bxs-file-pdf" disabled={!isPrintable} text={t("note_actions.print_pdf")} />}
<FormDropdownDivider />
{isNewLayout && <NoteBasicProperties note={note} />}
<FormDropdownDivider />
<CommandItem icon="bx bx-import" text={t("note_actions.import_files")}
disabled={isInOptionsOrHelp || note.type === "search"}
command={() => parentComponent?.triggerCommand("showImportDialog", { noteId: note.noteId })} />
@ -112,6 +116,14 @@ function NoteContextMenu({ note, noteContext }: { note: FNote, noteContext?: Not
);
}
function NoteBasicProperties({ note }: { note: FNote }) {
const [ isBookmarked, setIsBookmarked ] = useNoteBookmarkState(note);
return <>
<FormListToggleableItem icon="bx bx-bookmark" title={t("bookmark_switch.bookmark")} currentValue={isBookmarked} onChange={setIsBookmarked} />
</>;
}
function DevelopmentActions({ note, noteContext }: { note: FNote, noteContext?: NoteContext }) {
return (
<FormDropdownSubmenu title="Development Actions" icon="bx bx-wrench" dropStart>