chore(right_pane_widget): basic support for custom widgets
Some checks are pending
Checks / main (push) Waiting to run

This commit is contained in:
Elian Doran 2025-12-20 00:01:21 +02:00
parent a5f322617d
commit 8f1614f603
No known key found for this signature in database
2 changed files with 11 additions and 4 deletions

View File

@ -184,7 +184,7 @@ export default class DesktopLayout {
.child(new HighlightsListWidget())
.child(...this.customWidgets.get("right-pane"))
)
.optChild(isNewLayout, <RightPanelContainer />)
.optChild(isNewLayout, <RightPanelContainer customWidgets={this.customWidgets.get("right-pane")} />)
)
.optChild(!launcherPaneIsHorizontal && isNewLayout, <StatusBar />)
)

View File

@ -7,15 +7,16 @@ import { useEffect } from "preact/hooks";
import { t } from "../../services/i18n";
import options from "../../services/options";
import { DEFAULT_GUTTER_SIZE } from "../../services/resizer";
import BasicWidget from "../basic_widget";
import Button from "../react/Button";
import { useActiveNoteContext, useNoteProperty, useTriliumOptionBool, useTriliumOptionJson } from "../react/hooks";
import { useActiveNoteContext, useLegacyWidget, useNoteProperty, useTriliumOptionBool, useTriliumOptionJson } from "../react/hooks";
import Icon from "../react/Icon";
import HighlightsList from "./HighlightsList";
import TableOfContents from "./TableOfContents";
const MIN_WIDTH_PERCENT = 5;
export default function RightPanelContainer() {
export default function RightPanelContainer({ customWidgets }: { customWidgets: BasicWidget[] }) {
const [ rightPaneVisible, setRightPaneVisible ] = useTriliumOptionBool("rightPaneVisible");
const [ highlightsList ] = useTriliumOptionJson<string[]>("highlightsList");
useSplit(rightPaneVisible);
@ -24,7 +25,8 @@ export default function RightPanelContainer() {
const noteType = useNoteProperty(note, "type");
const items = (rightPaneVisible ? [
(noteType === "text" || noteType === "doc") && <TableOfContents />,
noteType === "text" && highlightsList.length > 0 && <HighlightsList />
noteType === "text" && highlightsList.length > 0 && <HighlightsList />,
...customWidgets.map((w) => <CustomWidget originalWidget={w} />)
] : []).filter(Boolean);
return (
@ -64,3 +66,8 @@ function useSplit(visible: boolean) {
return () => splitInstance.destroy();
}, [ visible ]);
}
function CustomWidget({ originalWidget }: { originalWidget: BasicWidget }) {
const [ el ] = useLegacyWidget(() => originalWidget);
return <>{el}</>;
}