Start working on UI

app/components/Map.tsx

@@ -1,17 +1,31 @@
 "use client";
 
-import { useEffect, useRef } from "react";
-import { init } from "../three/utils/init";
+import { useContext, useEffect, useRef } from "react";
+import { MapScene } from "../three/MapScene";
+import {
+  MapSceneContext,
+  MapSceneContextType,
+} from "../providers/map-scene-provider";
 
 export function Map() {
   const divRef = useRef<HTMLDivElement>(null);
+  const { setMapScene } = useContext(MapSceneContext) as MapSceneContextType;
 
   useEffect(() => {
     let ignore = false;
     if (!divRef.current) return;
 
+    async function loadScene() {
+      if (divRef.current) {
+        const _mapScene = await MapScene.create(divRef.current, "20");
+        if (_mapScene) {
+          setMapScene(_mapScene);
+        }
+      }
+    }
+
     if (!ignore) {
-      init(divRef.current);
+      loadScene();
     }
 
     return () => {