models shit

packages/website/src/components/TankModel.tsx

@@ -1,38 +1,36 @@
 import { invalidate, useThree, type ThreeEvent } from "@react-three/fiber";
 import { useRef } from "react";
 import { Group, Mesh, MeshStandardMaterial, Vector2 } from "three";
-import { useTankModelDefinition } from "../../../../../../hooks/useTankModelDefinition";
-import { Duel } from "../../../../../../stores/duel";
 import { applyPitchYawLimits } from "../core/blitz/applyPitchYawLimits";
-import { hasEquipment } from "../core/blitzkit/hasEquipment";
 import { jsxTree } from "../core/blitzkit/jsxTree";
 import { modelTransformEvent } from "../core/blitzkit/modelTransform";
 import { controlsEnabledEvent } from "../core/controlsEnabled";
+import { DuelModule, useDuel } from "../hooks/useDuel";
+import { useDuelModel } from "../hooks/useDuelModel";
+import { hasEquipment } from "../hooks/useEquipment";
 import { useModel } from "../hooks/useModel";
 import { useTankTransform } from "../hooks/useTankTransform";
 import { Tankopedia } from "../stores/tankopedia";
 import { TankopediaDisplay } from "../stores/tankopediaPersistent/constants";
-import { ModelTankWrapper } from "./ModelTankWrapper";
 
 export function TankModel() {
-  const protagonist = Duel.use((draft) => draft.protagonist);
-  const track = Duel.use((state) => state.protagonist.track);
-  const turret = Duel.use((state) => state.protagonist.turret);
+  const protagonist = Tankopedia.use((state) => state.protagonist);
+  const track = useDuel("protagonist", DuelModule.Track);
+  const turret = useDuel("protagonist", DuelModule.Turret);
+
   const canvas = useThree((state) => state.gl.domElement);
-  const hullContainer = useRef<Group>(null);
   const turretContainer = useRef<Group>(null!);
   const gunContainer = useRef<Group>(null!);
-  const tankModelDefinition = useTankModelDefinition();
-  const turretModelDefinition =
-    tankModelDefinition.turrets[protagonist.turret.id];
-  const gunModelDefinition = turretModelDefinition.guns[protagonist.gun.id];
-  const { gltf } = useModel(protagonist.tank.id);
+  const tankModelDefinition = useDuelModel("protagonist");
+  const turretModelDefinition = tankModelDefinition.turrets[protagonist.turret];
+  const gunModelDefinition = turretModelDefinition.guns[protagonist.gun];
+  const { gltf } = useModel(protagonist.tank);
   const nodes = Object.values(gltf.nodes);
 
   useTankTransform(track, turret, turretContainer, gunContainer);
 
   return (
-    <ModelTankWrapper ref={hullContainer}>
+    <>
       {nodes.map((node) => {
         const isHull = node.name === "hull";
         const isWheel = node.name.startsWith("chassis_wheel_");
@@ -131,15 +129,17 @@ export function TankModel() {
             window.addEventListener("pointerup", handlePointerUp);
           }
           function handlePointerMove(event: PointerEvent) {
+            const protagonist = useDuel("protagonist", DuelModule.Tank);
+
             const hasImprovedVerticalStabilizer = hasEquipment(
               122,
-              Duel.state.protagonist.tank.equipment_preset,
-              Duel.state.protagonist.equipmentMatrix,
+              protagonist.equipment_preset,
+              Tankopedia.state.protagonist.equipment,
             );
             const hasDownImprovedVerticalStabilizer = hasEquipment(
               124,
-              Duel.state.protagonist.tank.equipment_preset,
-              Duel.state.protagonist.equipmentMatrix,
+              protagonist.equipment_preset,
+              Tankopedia.state.protagonist.equipment,
             );
             const boundingRect = canvas.getBoundingClientRect();
 
@@ -214,15 +214,17 @@ export function TankModel() {
               window.addEventListener("pointerup", handlePointerUp);
             }
             function handlePointerMove(event: PointerEvent) {
+              const protagonist = useDuel("protagonist", DuelModule.Tank);
+
               const hasImprovedVerticalStabilizer = hasEquipment(
                 122,
-                Duel.state.protagonist.tank.equipment_preset,
-                Duel.state.protagonist.equipmentMatrix,
+                protagonist.equipment_preset,
+                Tankopedia.state.protagonist.equipment,
               );
               const hasDownImprovedVerticalStabilizer = hasEquipment(
                 124,
-                Duel.state.protagonist.tank.equipment_preset,
-                Duel.state.protagonist.equipmentMatrix,
+                protagonist.equipment_preset,
+                Tankopedia.state.protagonist.equipment,
               );
               const boundingRect = canvas.getBoundingClientRect();
               delta.set(event.clientX, event.clientY).sub(position);
@@ -260,6 +262,6 @@ export function TankModel() {
           })}
         </group>
       </group>
-    </ModelTankWrapper>
+    </>
   );
 }