chore(react):start porting note map

apps/client/src/widgets/ribbon/NoteMapTab.tsx

@@ -1,9 +1,9 @@
 import { TabContext } from "./ribbon-interface";
-import NoteMapWidget from "../note_map";
 import { useElementSize, useLegacyWidget, useWindowSize } from "../react/hooks";
 import ActionButton from "../react/ActionButton";
 import { t } from "../../services/i18n";
 import { useEffect, useRef, useState } from "preact/hooks";
+import NoteMap from "../note_map/NoteMap";
 
 const SMALL_SIZE_HEIGHT = "300px";
 
@@ -14,11 +14,6 @@ export default function NoteMapTab({ noteContext }: TabContext) {
     const { windowHeight } = useWindowSize();
     const containerSize = useElementSize(containerRef);
 
-    const [ noteMapContainer, noteMapWidget ] = useLegacyWidget(() => new NoteMapWidget("ribbon"), {
-        noteContext,
-        containerClassName: "note-map-container"
-    });
-    
     useEffect(() => {
         if (isExpanded && containerRef.current && containerSize) {
             const height = windowHeight - containerSize.top;
@@ -27,11 +22,11 @@ export default function NoteMapTab({ noteContext }: TabContext) {
             setHeight(SMALL_SIZE_HEIGHT);
         }
     }, [ isExpanded, containerRef, windowHeight, containerSize?.top ]);
-    useEffect(() => noteMapWidget.setDimensions(), [ containerSize?.width, height ]);    
+    // useEffect(() => noteMapWidget.setDimensions(), [ containerSize?.width, height ]);
 
     return (
         <div className="note-map-ribbon-widget" style={{ height }} ref={containerRef}>
-            {noteMapContainer}
+            <NoteMap />
 
             {!isExpanded ? (
                 <ActionButton
@@ -50,4 +45,4 @@ export default function NoteMapTab({ noteContext }: TabContext) {
             )}
         </div>
     );
-}
+}