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

fix(right_pane): custom widgets not rendering after being expanded

Browse Source
This commit is contained in:
Elian Doran 2025-12-20 11:09:59 +02:00
parent aac4316fb8
commit e1df65adce
No known key found for this signature in database
2 changed files with 21 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/client/src/widgets/react/hooks.tsx
View File

@ -605,11 +605,10 @@ export function useNoteBlob(note: FNote | null | undefined, componentId?: string
return blob;
}
export function useLegacyWidget<T extends BasicWidget>(widgetFactory: () => T, { noteContext, containerClassName, containerStyle, noAttach }: {
export function useLegacyWidget<T extends BasicWidget>(widgetFactory: () => T, { noteContext, containerClassName, containerStyle }: {
noteContext?: NoteContext;
containerClassName?: string;
containerStyle?: CSSProperties;
noAttach?: boolean;
} = {}): [VNode, T] {
const ref = useRef<HTMLDivElement>(null);
const parentComponent = useContext(ParentComponent);
@ -632,13 +631,12 @@ export function useLegacyWidget<T extends BasicWidget>(widgetFactory: () => T, {
// Attach the widget to the parent.
useEffect(() => {
if (noAttach) return;
const parentContainer = ref.current;
if (parentContainer) {
parentContainer.replaceChildren();
renderedWidget.appendTo(parentContainer);
}
}, [ renderedWidget, noAttach ]);
});
// Inject the note context.
useEffect(() => {

34
apps/client/src/widgets/sidebar/RightPanelContainer.tsx
View File

@ -71,15 +71,26 @@ function useSplit(visible: boolean) {
function CustomWidget({ originalWidget }: { originalWidget: LegacyRightPanelWidget }) {
const containerRef = useRef<HTMLDivElement>(null);
return (
<RightPanelWidget
id={originalWidget._noteId}
title={originalWidget.widgetTitle}
containerRef={containerRef}
>
<CustomWidgetContent originalWidget={originalWidget} />
</RightPanelWidget>
);
}
function CustomWidgetContent({ originalWidget }: { originalWidget: LegacyRightPanelWidget }) {
const [ el ] = useLegacyWidget(() => {
originalWidget.contentSized();
// Monkey-patch the original widget by replacing the default initialization logic.
originalWidget.doRender = function doRender(this: LegacyRightPanelWidget) {
if (!containerRef.current) {
this.$widget = $("<div>");
return;
};
this.$widget = $(containerRef.current);
this.$body = this.$widget.find(".card-body");
this.$widget = $("<div>");
this.$body = this.$widget;
const renderResult = this.doRenderBody();
if (typeof renderResult === "object" && "catch" in renderResult) {
this.initialized = renderResult.catch((e) => {
@ -91,14 +102,7 @@ function CustomWidget({ originalWidget }: { originalWidget: LegacyRightPanelWidg
};
return originalWidget;
}, {
noAttach: true
});
return (
<RightPanelWidget
id={originalWidget._noteId}
title={originalWidget.widgetTitle}
containerRef={containerRef}
>{el}</RightPanelWidget>
);
return el;
}