From d110dcb32c673b21694d25c27b3d6202062d8040 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sun, 24 May 2026 20:30:42 +0000
Subject: [PATCH 1/3] Changes

Co-authored-by: Reifonas <211114984+Reifonas@users.noreply.github.com>
---
 src/components/ViewCube.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/ViewCube.tsx b/src/components/ViewCube.tsx
index ab44476..ca292b7 100644
--- a/src/components/ViewCube.tsx
+++ b/src/components/ViewCube.tsx
@@ -12,6 +12,7 @@ import {
   subscribeCalibration,
 } from './three/viewCubeBus';
 import { useModelStore } from '@/stores/useModelStore';
+import { getModelLocalGroup } from '@/lib/modelTransforms';
 import { Check, RotateCcw } from 'lucide-react';
 import { toast } from 'sonner';
 

From e444a3a20fb36f658f9e93b9fed2fe8ed823977d Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sun, 24 May 2026 20:31:04 +0000
Subject: [PATCH 2/3] Changes

Co-authored-by: Reifonas <211114984+Reifonas@users.noreply.github.com>
---
 src/components/ViewCube.tsx | 61 ++++++++++++++++++++++++++-----------
 1 file changed, 44 insertions(+), 17 deletions(-)

diff --git a/src/components/ViewCube.tsx b/src/components/ViewCube.tsx
index ca292b7..34e7c67 100644
--- a/src/components/ViewCube.tsx
+++ b/src/components/ViewCube.tsx
@@ -53,8 +53,9 @@ const FACE_DEFS: { label: string; dir: [number, number, number] }[] = [
   { label: 'ATRÁS',  dir: [ 0, 0,-1] },
 ];
 
-function CubeMesh({ calibrating }: { calibrating: boolean }) {
+function CubeMesh({ calibrating, activeModelId }: { calibrating: boolean; activeModelId: string | null }) {
   const meshRef = useRef<THREE.Mesh>(null);
+  const groupRef = useRef<THREE.Group>(null);
   const { camera: localCam } = useThree();
   const [hover, setHover] = useState<number | null>(null);
 
@@ -86,6 +87,21 @@ function CubeMesh({ calibrating }: { calibrating: boolean }) {
     });
   }, [hover, materials]);
 
+  // Reusable temp objects for the per-frame model-quaternion sync.
+  const modelQuat = useMemo(() => new THREE.Quaternion(), []);
+  /** Returns the active model's current world quaternion (fineTuning rotation
+   *  + calibration). Used to keep the cube glued to the piece's pose. */
+  const getModelWorldQuat = (): THREE.Quaternion => {
+    const g = getModelLocalGroup(activeModelId);
+    if (g) {
+      g.updateWorldMatrix(true, false);
+      g.getWorldQuaternion(modelQuat);
+      return modelQuat;
+    }
+    modelQuat.identity();
+    return modelQuat;
+  };
+
   useFrame(() => {
     const main = mainCameraRef.current;
     const controls = mainControlsRef.current;
@@ -95,6 +111,11 @@ function CubeMesh({ calibrating }: { calibrating: boolean }) {
     localCam.position.copy(dir.multiplyScalar(3));
     localCam.up.copy(main.up);
     localCam.lookAt(0, 0, 0);
+    // Sync the cube group orientation with the active model so it always
+    // mirrors the piece's pose (rotation from Posicionar, calibration, etc).
+    if (groupRef.current) {
+      groupRef.current.quaternion.copy(getModelWorldQuat());
+    }
   });
 
   const onClick = (e: ThreeEvent<MouseEvent>) => {
@@ -103,30 +124,36 @@ function CubeMesh({ calibrating }: { calibrating: boolean }) {
     if (idx == null) return;
     const def = FACE_DEFS[idx];
     if (!def) return;
-    const dirVec = new THREE.Vector3(...def.dir);
+    // Convert the local cube-face direction to world space using the model's
+    // current world quaternion — this keeps cube ↔ model coherent after any
+    // rotation/translation/reset of the piece.
+    const dirWorld = new THREE.Vector3(...def.dir).applyQuaternion(getModelWorldQuat()).normalize();
     if (calibrating) {
-      pushCubeFace(dirVec);
+      pushCubeFace(dirWorld);
     } else {
-      requestView(dirVec);
+      requestView(dirWorld);
     }
   };
 
   // 70% of previous 1.4 → ~0.98
   const SIZE = 0.98;
   return (
-    <mesh
-      ref={meshRef}
-      material={materials}
-      onClick={onClick}
-      onPointerMove={(e) => {
-        e.stopPropagation();
-        const idx = e.face?.materialIndex ?? null;
-        setHover(idx);
-      }}
-      onPointerOut={() => setHover(null)}
-    >
-      <boxGeometry args={[SIZE, SIZE, SIZE]} />
-    </mesh>
+    <group ref={groupRef}>
+      <mesh
+        ref={meshRef}
+        material={materials}
+        onClick={onClick}
+        onPointerMove={(e) => {
+          e.stopPropagation();
+          const idx = e.face?.materialIndex ?? null;
+          setHover(idx);
+        }}
+        onPointerOut={() => setHover(null)}
+      >
+        <boxGeometry args={[SIZE, SIZE, SIZE]} />
+      </mesh>
+      <AxisTripod />
+    </group>
   );
 }
 

From 885ea304bf873ffb58811444bc3436c610d66bd7 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sun, 24 May 2026 20:31:11 +0000
Subject: [PATCH 3/3] Changes

Co-authored-by: Reifonas <211114984+Reifonas@users.noreply.github.com>
---
 src/components/ViewCube.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/ViewCube.tsx b/src/components/ViewCube.tsx
index 34e7c67..e34d6ed 100644
--- a/src/components/ViewCube.tsx
+++ b/src/components/ViewCube.tsx
@@ -241,8 +241,7 @@ export function ViewCube() {
           dpr={[1, 2]}
         >
           <ambientLight intensity={1} />
-          <CubeMesh calibrating={isCalibrating} />
-          <AxisTripod />
+          <CubeMesh calibrating={isCalibrating} activeModelId={activeModelId} />
         </Canvas>
       </div>