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

feat(right_pane): add count to highlights list

Browse Source
This commit is contained in:
Elian Doran 2025-12-20 12:25:43 +02:00
parent 35afd60d00
commit b248805905
No known key found for this signature in database
2 changed files with 47 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/src/translations/en/translation.json
View File

@ -1723,6 +1723,8 @@
},
"highlights_list_2": {
"title": "Highlights List",
"title_with_count_one": "{{count}} highlight",
"title_with_count_other": "{{count}} highlights",
"options": "Options",
"modal_title": "Configure Highlights List",
"menu_configure": "Configure highlights list...",

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

@ -3,7 +3,6 @@ import { createPortal } from "preact/compat";
import { useCallback, useEffect, useState } from "preact/hooks";
import { t } from "../../services/i18n";
import ActionButton from "../react/ActionButton";
import { useActiveNoteContext, useContentElement, useIsNoteReadOnly, useNoteProperty, useTextEditor, useTriliumOptionJson } from "../react/hooks";
import Modal from "../react/Modal";
import { HighlightsListOptions } from "../type_widgets/options/text_notes";
@ -25,26 +24,11 @@ export default function HighlightsList() {
const { note, noteContext } = useActiveNoteContext();
const noteType = useNoteProperty(note, "type");
const { isReadOnly } = useIsNoteReadOnly(note, noteContext);
const [ shown, setShown ] = useState(false);
return (
<>
<RightPanelWidget
id="highlights"
title={t("highlights_list_2.title")}
contextMenuItems={[
{
title: t("highlights_list_2.menu_configure"),
uiIcon: "bx bx-cog",
handler: () => setShown(true)
}
]}
grow
>
{noteType === "text" && isReadOnly && <ReadOnlyTextHighlightsList />}
{noteType === "text" && !isReadOnly && <EditableTextHighlightsList />}
</RightPanelWidget>
{createPortal(<HighlightListOptionsModal shown={shown} setShown={setShown} />, document.body)}
</>
);
}
@ -80,7 +64,21 @@ function AbstractHighlightsList<T extends RawHighlight>({ highlights, scrollToHi
);
});
const [ shown, setShown ] = useState(false);
return (
<>
<RightPanelWidget
id="highlights"
title={t("highlights_list_2.title_with_count", { count: filteredHighlights.length })}
contextMenuItems={[
{
title: t("highlights_list_2.menu_configure"),
uiIcon: "bx bx-cog",
handler: () => setShown(true)
}
]}
grow
>
<span className="highlights-list">
{filteredHighlights.length > 0 ? (
<ol>
@ -107,6 +105,9 @@ function AbstractHighlightsList<T extends RawHighlight>({ highlights, scrollToHi
</div>
)}
</span>
</RightPanelWidget>
{createPortal(<HighlightListOptionsModal shown={shown} setShown={setShown} />, document.body)}
</>
);
}