From 260bfea716c7e7c6ba05c524a0e1a27d8f04907d Mon Sep 17 00:00:00 2001
From: Tom Boullay <tom@famille-boullay.fr>
Date: Thu, 14 May 2026 00:15:52 +0200
Subject: [PATCH] fix: add disposal on unmount in SkyModel and SimpleModel

---
 src/components/three/models/SimpleModel.tsx |  9 ++++++++-
 src/components/three/world/SkyModel.tsx     | 11 +++++++++--
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/components/three/models/SimpleModel.tsx b/src/components/three/models/SimpleModel.tsx
index 9b8e570..754c3e4 100644
--- a/src/components/three/models/SimpleModel.tsx
+++ b/src/components/three/models/SimpleModel.tsx
@@ -1,6 +1,7 @@
-import { useMemo } from "react";
+import { useEffect, useMemo } from "react";
 import { useLoggedGLTF } from "@/hooks/three/useLoggedGLTF";
 import type { ModelTransformProps, Vector3Tuple } from "@/types/three/three";
+import { disposeObject3D } from "@/utils/three/dispose";
 
 export interface SimpleModelConfig extends ModelTransformProps {
   modelPath: string;
@@ -29,6 +30,12 @@ export function SimpleModel({
   });
   const model = useMemo(() => scene.clone(true), [scene]);
 
+  useEffect(() => {
+    return () => {
+      disposeObject3D(model);
+    };
+  }, [model]);
+
   const parsedScale =
     typeof scale === "number" ? ([scale, scale, scale] as Vector3Tuple) : scale;
 
diff --git a/src/components/three/world/SkyModel.tsx b/src/components/three/world/SkyModel.tsx
index a3e89cd..9e37722 100644
--- a/src/components/three/world/SkyModel.tsx
+++ b/src/components/three/world/SkyModel.tsx
@@ -1,8 +1,9 @@
 import { useFrame, useThree } from "@react-three/fiber";
 import { useGLTF } from "@react-three/drei";
-import { Component, useMemo, useRef, type ReactNode } from "react";
+import { Component, useEffect, useMemo, useRef, type ReactNode } from "react";
 import * as THREE from "three";
 import { useLoggedGLTF } from "@/hooks/three/useLoggedGLTF";
+import { disposeObject3D } from "@/utils/three/dispose";
 
 interface SkyModelProps {
   modelPath: string;
@@ -80,6 +81,12 @@ function SkyModelContent({
   });
   const model = useMemo(() => createSkyModel(scene), [scene]);
 
+  useEffect(() => {
+    return () => {
+      disposeObject3D(model);
+    };
+  }, [model]);
+
   useFrame(() => {
     groupRef.current?.position.copy(camera.position);
   });
@@ -122,5 +129,5 @@ function createSkyMaterial<T extends THREE.Material>(material: T): T {
   return skyMaterial as T;
 }
 
-useGLTF.preload("/models/skybox/skybox.gltf");
+useGLTF.preload("/models/skybox/model.gltf");
 useGLTF.preload(LEGACY_SKY_MODEL_PATH);