diff --git a/apps/client/src/widgets/note_map/NoteMap.tsx b/apps/client/src/widgets/note_map/NoteMap.tsx
index b54411159..b4dc6fef3 100644
--- a/apps/client/src/widgets/note_map/NoteMap.tsx
+++ b/apps/client/src/widgets/note_map/NoteMap.tsx
@@ -23,27 +23,6 @@ export default function NoteMap({ note, widgetMode, parentRef }: NoteMapProps) {
const [ mapTypeRaw ] = useNoteLabel(note, "mapType");
const mapType: MapType = mapTypeRaw === "tree" ? "tree" : "link";
- useEffect(() => {
- if (!containerRef.current || !styleResolverRef.current) return;
- setCssData(getCssData(containerRef.current, styleResolverRef.current));
- }, []);
-
- return (
-
- )
-}
-
-function NoteGraph({ containerRef, parentRef, note, widgetMode, mapType, cssData }: {
- containerRef: RefObject;
- parentRef: RefObject;
- note: FNote;
- widgetMode: NoteMapWidgetMode;
- mapType: MapType;
- cssData: CssData;
-}) {
const graphRef = useRef>>();
const containerSize = useElementSize(parentRef);
@@ -63,6 +42,8 @@ function NoteGraph({ containerRef, parentRef, note, widgetMode, mapType, cssData
const excludeRelations = labelValues("mapExcludeRelation");
const includeRelations = labelValues("mapIncludeRelation");
loadNotesAndRelations(mapRootId, excludeRelations, includeRelations, mapType).then((notesAndRelations) => {
+ if (!containerRef.current || !styleResolverRef.current) return;
+ const cssData = getCssData(containerRef.current, styleResolverRef.current);
setupRendering(graph, {
cssData,
noteId: note.noteId,
@@ -83,7 +64,12 @@ function NoteGraph({ containerRef, parentRef, note, widgetMode, mapType, cssData
graphRef.current.width(containerSize.width).height(containerSize.height);
}, [ containerSize?.width, containerSize?.height ]);
- return ;
+ return (
+
+ )
}
function getCssData(container: HTMLElement, styleResolver: HTMLElement): CssData {