mirror of
https://github.com/zadam/trilium.git
synced 2025-12-19 13:54:23 +01:00
feat(right_pane): store expansion state
This commit is contained in:
parent
a4024d17ba
commit
ddb6b3ea8a
@ -24,7 +24,7 @@ export default function HighlightsList() {
|
||||
const { isReadOnly } = useIsNoteReadOnly(note, noteContext);
|
||||
|
||||
return (
|
||||
<RightPanelWidget title={t("highlights_list_2.title")}>
|
||||
<RightPanelWidget id="highlights" title={t("highlights_list_2.title")}>
|
||||
{((noteType === "text" && isReadOnly) || (noteType === "doc")) && <ReadOnlyTextHighlightsList />}
|
||||
{noteType === "text" && !isReadOnly && <EditableTextHighlightsList />}
|
||||
</RightPanelWidget>
|
||||
|
||||
@ -28,16 +28,10 @@ export default function RightPanelContainer() {
|
||||
return () => splitInstance.destroy();
|
||||
}, []);
|
||||
|
||||
const items = [
|
||||
<TableOfContents />,
|
||||
<HighlightsList />
|
||||
];
|
||||
|
||||
const sizesBeforeCollapse = useRef(new WeakMap<HTMLElement, number>());
|
||||
|
||||
return (
|
||||
<div id="right-pane">
|
||||
{items}
|
||||
<TableOfContents />
|
||||
<HighlightsList />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -2,17 +2,20 @@ import clsx from "clsx";
|
||||
import { ComponentChildren } from "preact";
|
||||
import { useContext, useRef, useState } from "preact/hooks";
|
||||
|
||||
import { useTriliumOptionJson } from "../react/hooks";
|
||||
import Icon from "../react/Icon";
|
||||
import { ParentComponent } from "../react/react_utils";
|
||||
|
||||
interface RightPanelWidgetProps {
|
||||
id: string;
|
||||
title: string;
|
||||
children: ComponentChildren;
|
||||
buttons?: ComponentChildren;
|
||||
}
|
||||
|
||||
export default function RightPanelWidget({ title, buttons, children }: RightPanelWidgetProps) {
|
||||
const [ expanded, setExpanded ] = useState(true);
|
||||
export default function RightPanelWidget({ id, title, buttons, children }: RightPanelWidgetProps) {
|
||||
const [ rightPaneCollapsedItems, setRightPaneCollapsedItems ] = useTriliumOptionJson<string[]>("rightPaneCollapsedItems");
|
||||
const [ expanded, setExpanded ] = useState(!rightPaneCollapsedItems.includes(id));
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const parentComponent = useContext(ParentComponent);
|
||||
|
||||
@ -27,7 +30,19 @@ export default function RightPanelWidget({ title, buttons, children }: RightPane
|
||||
>
|
||||
<div
|
||||
class="card-header"
|
||||
onClick={() => setExpanded(!expanded)}
|
||||
onClick={() => {
|
||||
const newExpanded = !expanded;
|
||||
setExpanded(newExpanded);
|
||||
const rightPaneCollapsedItemsSet = new Set(rightPaneCollapsedItems);
|
||||
if (newExpanded) {
|
||||
rightPaneCollapsedItemsSet.delete(id);
|
||||
} else {
|
||||
rightPaneCollapsedItemsSet.add(id);
|
||||
}
|
||||
if (rightPaneCollapsedItemsSet.size !== rightPaneCollapsedItems.length) {
|
||||
setRightPaneCollapsedItems(Array.from(rightPaneCollapsedItemsSet));
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Icon
|
||||
icon="bx bx-chevron-down"
|
||||
|
||||
@ -26,7 +26,7 @@ export default function TableOfContents() {
|
||||
const { isReadOnly } = useIsNoteReadOnly(note, noteContext);
|
||||
|
||||
return (
|
||||
<RightPanelWidget title={t("toc.table_of_contents")}>
|
||||
<RightPanelWidget id="toc" title={t("toc.table_of_contents")}>
|
||||
{((noteType === "text" && isReadOnly) || (noteType === "doc")) && <ReadOnlyTextTableOfContents />}
|
||||
{noteType === "text" && !isReadOnly && <EditableTextTableOfContents />}
|
||||
</RightPanelWidget>
|
||||
|
||||
@ -51,8 +51,9 @@ const ALLOWED_OPTIONS = new Set<OptionNames>([
|
||||
"imageMaxWidthHeight",
|
||||
"imageJpegQuality",
|
||||
"leftPaneWidth",
|
||||
"rightPaneWidth",
|
||||
"leftPaneVisible",
|
||||
"rightPaneWidth",
|
||||
"rightPaneCollapsedItems",
|
||||
"rightPaneVisible",
|
||||
"nativeTitleBarVisible",
|
||||
"headingStyle",
|
||||
|
||||
@ -105,6 +105,7 @@ const defaultOptions: DefaultOption[] = [
|
||||
{ name: "leftPaneVisible", value: "true", isSynced: false },
|
||||
{ name: "rightPaneWidth", value: "25", isSynced: false },
|
||||
{ name: "rightPaneVisible", value: "true", isSynced: false },
|
||||
{ name: "rightPaneCollapsedItems", value: "[]", isSynced: false },
|
||||
{ name: "nativeTitleBarVisible", value: "false", isSynced: false },
|
||||
{ name: "eraseEntitiesAfterTimeInSeconds", value: "604800", isSynced: true }, // default is 7 days
|
||||
{ name: "eraseEntitiesAfterTimeScale", value: "86400", isSynced: true }, // default 86400 seconds = Day
|
||||
|
||||
@ -77,6 +77,7 @@ export interface OptionDefinitions extends KeyboardShortcutsOptions<KeyboardActi
|
||||
imageJpegQuality: number;
|
||||
leftPaneWidth: number;
|
||||
rightPaneWidth: number;
|
||||
rightPaneCollapsedItems: string;
|
||||
eraseEntitiesAfterTimeInSeconds: number;
|
||||
eraseEntitiesAfterTimeScale: number;
|
||||
autoReadonlySizeText: number;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user