fix repair game interaction coordinate spaces

src/components/three/gameplay/RepairCaseModel.tsx

@@ -81,6 +81,7 @@ export function RepairCaseModel({
   const initialOpen = useRef(open);
   const openedRotationZ = useRef(0);
   const parsedScale = toVector3Scale(scale);
+  const placeholderNodes = useRef<THREE.Object3D[]>([]);
   const placeholderSignature = useRef("__initial__");
   const placeholderPosition = useRef(new THREE.Vector3());
   const placeholderLocalPosition = useRef(new THREE.Vector3());
@@ -138,6 +139,15 @@ export function RepairCaseModel({
     const lid = model.getObjectByName(REPAIR_CASE_LID_NODE_NAME);
     lidRef.current = lid ?? null;
     openedRotationZ.current = lid?.rotation.z ?? 0;
+    placeholderNodes.current = [];
+
+    model.traverse((child) => {
+      if (
+        child.name.toLowerCase().startsWith(REPAIR_CASE_PLACEHOLDER_NAME_PREFIX)
+      ) {
+        placeholderNodes.current.push(child);
+      }
+    });
 
     if (lid) {
       lid.rotation.z =
@@ -195,41 +205,35 @@ export function RepairCaseModel({
       parsedScale[2] * pop.current.scale,
     );
 
-    const placeholders: RepairCasePlaceholder[] = [];
-    model.traverse((child) => {
-      if (
-        !child.name
-          .toLowerCase()
-          .startsWith(REPAIR_CASE_PLACEHOLDER_NAME_PREFIX)
-      ) {
-        return;
-      }
-
-      child.getWorldPosition(placeholderPosition.current);
-      placeholderLocalPosition.current.copy(placeholderPosition.current);
-      group.parent?.worldToLocal(placeholderLocalPosition.current);
-      placeholders.push({
-        name: child.name,
-        position: [
-          placeholderLocalPosition.current.x,
-          placeholderLocalPosition.current.y,
-          placeholderLocalPosition.current.z,
-        ],
+    if (placeholderNodes.current.length > 0) {
+      const placeholders: RepairCasePlaceholder[] = [];
+      placeholderNodes.current.forEach((child) => {
+        child.getWorldPosition(placeholderPosition.current);
+        placeholderLocalPosition.current.copy(placeholderPosition.current);
+        group.parent?.worldToLocal(placeholderLocalPosition.current);
+        placeholders.push({
+          name: child.name,
+          position: [
+            placeholderLocalPosition.current.x,
+            placeholderLocalPosition.current.y,
+            placeholderLocalPosition.current.z,
+          ],
+        });
       });
-    });
-    placeholders.sort((a, b) => a.name.localeCompare(b.name));
+      placeholders.sort((a, b) => a.name.localeCompare(b.name));
 
-    const nextSignature = placeholders
-      .map(
-        (placeholder) =>
-          `${placeholder.name}:${placeholder.position
-            .map((value) => value.toFixed(3))
-            .join(",")}`,
-      )
-      .join("|");
-    if (nextSignature !== placeholderSignature.current) {
-      placeholderSignature.current = nextSignature;
-      onPlaceholdersChangeRef.current?.(placeholders);
+      const nextSignature = placeholders
+        .map(
+          (placeholder) =>
+            `${placeholder.name}:${placeholder.position
+              .map((value) => value.toFixed(3))
+              .join(",")}`,
+        )
+        .join("|");
+      if (nextSignature !== placeholderSignature.current) {
+        placeholderSignature.current = nextSignature;
+        onPlaceholdersChangeRef.current?.(placeholders);
+      }
     }
 
     animationActiveRef.current = isNear;

src/components/three/gameplay/RepairRepairingStep.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useRef, useState } from "react";
 import * as THREE from "three";
 import type { RepairCasePlaceholder } from "@/components/three/gameplay/RepairCaseModel";
 import { RepairObjectModel } from "@/components/three/gameplay/RepairObjectModel";
@@ -56,6 +56,8 @@ export function RepairRepairingStep({
   placeholders,
   onRepair,
 }: RepairRepairingStepProps): React.JSX.Element {
+  const groupRef = useRef<THREE.Group>(null);
+  const localPosition = useRef(new THREE.Vector3());
   const [placedPartIds, setPlacedPartIds] = useState<Record<string, boolean>>(
     {},
   );
@@ -97,16 +99,19 @@ export function RepairRepairingStep({
   const installLabel = isReadyToInstall
     ? `Installer ${requiredReplacementLabel}`
     : hasWrongPartPlaced
-      ? `Mauvaise piece`
+      ? `Mauvaise pièce`
       : hasCorrectPartPlaced
-        ? `Ranger piece cassee`
+        ? `Ranger pièce cassée`
         : `Approcher ${requiredReplacementLabel}`;
 
   function handleReplacementPosition(
     partId: string,
     position: THREE.Vector3,
   ): void {
-    const isPlaced = isNearPlaceholder(position, placeholderPositions);
+    const isPlaced = isNearPlaceholder(
+      getStepLocalPosition(position, groupRef.current, localPosition.current),
+      placeholderPositions,
+    );
     setPlacedPartIds((current) => {
       if (!current[partId] || isPlaced) return current;
 
@@ -127,7 +132,10 @@ export function RepairRepairingStep({
     position: THREE.Vector3,
     targets: readonly Vector3Tuple[],
   ): void {
-    const isDeposited = isNearPlaceholder(position, targets);
+    const isDeposited = isNearPlaceholder(
+      getStepLocalPosition(position, groupRef.current, localPosition.current),
+      targets,
+    );
     setDepositedBrokenPartIds((current) => {
       if (!current[partId] || isDeposited) return current;
 
@@ -144,7 +152,7 @@ export function RepairRepairingStep({
   }
 
   return (
-    <group>
+    <group ref={groupRef}>
       <RepairInstallTarget
         fillColor={installFillColor}
         isReadyToInstall={isReadyToInstall}
@@ -333,6 +341,17 @@ function isNearPlaceholder(
   );
 }
 
+function getStepLocalPosition(
+  worldPosition: THREE.Vector3,
+  group: THREE.Group | null,
+  target: THREE.Vector3,
+): THREE.Vector3 {
+  target.copy(worldPosition);
+  group?.worldToLocal(target);
+
+  return target;
+}
+
 function getReplacementParts(
   config: RepairMissionConfig,
 ): readonly RepairMissionPartConfig[] {