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

chore(right_pane_widget): respect highlight settings

Browse Source
This commit is contained in:
Elian Doran 2025-12-19 23:18:28 +02:00
parent 7a5d24f968
commit e94704ce64
No known key found for this signature in database
1 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
apps/client/src/widgets/sidebar/HighlightsList.tsx
View File

@ -4,7 +4,7 @@ import { useCallback, useEffect, useState } from "preact/hooks";
import { t } from "../../services/i18n"; import { t } from "../../services/i18n";
import ActionButton from "../react/ActionButton"; import ActionButton from "../react/ActionButton";
import { useActiveNoteContext, useContentElement, useIsNoteReadOnly, useNoteProperty, useTextEditor } from "../react/hooks"; import { useActiveNoteContext, useContentElement, useIsNoteReadOnly, useNoteProperty, useTextEditor, useTriliumOptionJson } from "../react/hooks";
import Modal from "../react/Modal"; import Modal from "../react/Modal";
import { HighlightsListOptions } from "../type_widgets/options/text_notes"; import { HighlightsListOptions } from "../type_widgets/options/text_notes";
import RightPanelWidget from "./RightPanelWidget"; import RightPanelWidget from "./RightPanelWidget";
@ -69,25 +69,39 @@ function AbstractHighlightsList<T extends RawHighlight>({ highlights, scrollToHi
highlights: T[], highlights: T[],
scrollToHighlight(highlight: T): void; scrollToHighlight(highlight: T): void;
}) { }) {
const [ highlightsList ] = useTriliumOptionJson<["bold" | "italic" | "underline" | "color" | "bgColor"]>("highlightsList");
const highlightsListSet = new Set(highlightsList || []);
return ( return (
<span className="highlights-list"> <span className="highlights-list">
<ol> <ol>
{highlights.map(highlight => ( {highlights
<li .filter(highlight => {
key={highlight.id} const { attrs } = highlight;
onClick={() => scrollToHighlight(highlight)} return (
> (highlightsListSet.has("bold") && attrs.bold) ||
<span (highlightsListSet.has("italic") && attrs.italic) ||
style={{ (highlightsListSet.has("underline") && attrs.underline) ||
fontWeight: highlight.attrs.bold ? "700" : undefined, (highlightsListSet.has("color") && !!attrs.color) ||
fontStyle: highlight.attrs.italic ? "italic" : undefined, (highlightsListSet.has("bgColor") && !!attrs.background)
textDecoration: highlight.attrs.underline ? "underline" : undefined, );
color: highlight.attrs.color, })
backgroundColor: highlight.attrs.background .map(highlight => (
}} <li
>{highlight.text}</span> key={highlight.id}
</li> onClick={() => scrollToHighlight(highlight)}
))} >
<span
style={{
fontWeight: highlight.attrs.bold ? "700" : undefined,
fontStyle: highlight.attrs.italic ? "italic" : undefined,
textDecoration: highlight.attrs.underline ? "underline" : undefined,
color: highlight.attrs.color,
backgroundColor: highlight.attrs.background
}}
>{highlight.text}</span>
</li>
))}
</ol> </ol>
</span> </span>
); );