Fix invisible model on load by populating meshCache synchronously with useMemo

src/components/ModelViewer.tsx

@@ -203,8 +203,22 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
   const internalRef = useRef<THREE.Group>(null);
   const groupRef = (ref as any) || internalRef;
   const textureCache = useRef<Map<string, THREE.Texture>>(new Map());
-  const meshCache = useRef<Map<string, THREE.Mesh>>(new Map());
   
+  const meshCache = useMemo(() => {
+    const cache = new Map<string, THREE.Mesh>();
+    if (object) {
+      let mIdx = 0;
+      object.traverse((child) => {
+        if (child instanceof THREE.Mesh) {
+          const stableId = `mesh-${mIdx}`;
+          cache.set(stableId, child);
+          mIdx++;
+        }
+      });
+    }
+    return cache;
+  }, [object]);
+
   useTexturePipeline(object);
 
   // Cleanup textures on unmount
@@ -212,25 +226,9 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
     return () => {
       textureCache.current.forEach(tex => tex.dispose());
       textureCache.current.clear();
-      meshCache.current.clear();
     };
   }, []);
 
-  // Build mesh cache when object changes
-  useEffect(() => {
-    meshCache.current.clear();
-    if (object) {
-      let mIdx = 0;
-      object.traverse((child) => {
-        if (child instanceof THREE.Mesh) {
-          const stableId = `mesh-${mIdx}`;
-          meshCache.current.set(stableId, child);
-          mIdx++;
-        }
-      });
-    }
-  }, [object]);
-
   // Main transform update for the core model
   useEffect(() => {
     if (object && sceneObjects) {
@@ -254,13 +252,13 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
   useEffect(() => {
     if (object && sceneObjects) {
       const activeIds = new Set(sceneObjects.map(obj => obj.id));
-      meshCache.current.forEach((mesh, id) => {
+      meshCache.forEach((mesh, id) => {
         if (!activeIds.has(id)) {
           mesh.visible = false;
         }
       });
     }
-  }, [object, sceneObjects]);
+  }, [object, sceneObjects, meshCache]);
 
   if (!object) return null;
 
@@ -270,7 +268,7 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
     <group ref={groupRef}>
       <primitive object={object} />
       {meshObjects.map(obj => {
-        const mesh = meshCache.current.get(obj.id);
+        const mesh = meshCache.get(obj.id);
         if (!mesh) return null;
         return (
           <group key={obj.id}>