feat: added option to hide tank under dynamic armor

packages/website/src/components/Tankopedia/HeroSection/components/Options/index.tsx

@@ -65,6 +65,9 @@ export function Options({ thicknessRange, canvas }: OptionsProps) {
   const greenPenetration = TankopediaPersistent.use(
     (state) => state.greenPenetration,
   );
+  const hideTankModelUnderArmor = TankopediaPersistent.use(
+    (state) => state.hideTankModelUnderArmor,
+  );
   const advancedHighlighting = TankopediaPersistent.use(
     (state) => state.advancedHighlighting,
   );
@@ -474,6 +477,17 @@ export function Options({ thicknessRange, canvas }: OptionsProps) {
                     Green penetration
                   </DropdownMenu.CheckboxItem>
 
+                  <DropdownMenu.CheckboxItem
+                    checked={hideTankModelUnderArmor}
+                    onCheckedChange={(checked) => {
+                      mutateTankopediaPersistent((draft) => {
+                        draft.hideTankModelUnderArmor = checked;
+                      });
+                    }}
+                  >
+                    Hide tank model under armor
+                  </DropdownMenu.CheckboxItem>
+
                   <DropdownMenu.CheckboxItem
                     checked={opaque}
                     onCheckedChange={(checked) => {

packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/index.tsx

@@ -15,6 +15,7 @@ import { useOnScreen } from '../../../../../hooks/useOnScreen';
 import { useTankModelDefinition } from '../../../../../hooks/useTankModelDefinition';
 import { Duel } from '../../../../../stores/duel';
 import { TankopediaEphemeral } from '../../../../../stores/tankopediaEphemeral';
+import { TankopediaPersistent } from '../../../../../stores/tankopediaPersistent';
 import { TankopediaDisplay } from '../../../../../stores/tankopediaPersistent/constants';
 import { Armor } from '../../../../Armor';
 import { ArmorPlateDisplay } from '../../../../Armor/components/ArmorPlateDisplay';
@@ -49,6 +50,9 @@ export const TankSandbox = forwardRef<HTMLCanvasElement, TankSandboxProps>(
     const gunModelDefinition =
       turretModelDefinition.guns[protagonistGun.gun_type!.value.base.id];
     const display = TankopediaEphemeral.use((state) => state.display);
+    const hideTankModelUnderArmor = TankopediaPersistent.use(
+      (state) => state.hideTankModelUnderArmor,
+    );
     const onScreen = useOnScreen(canvas);
 
     useImperativeHandle(ref, () => canvas.current!, []);
@@ -190,7 +194,9 @@ export const TankSandbox = forwardRef<HTMLCanvasElement, TankSandboxProps>(
       >
         <Controls naked={naked} />
         {!naked && <SceneProps />}
-        {display !== TankopediaDisplay.StaticArmor && <TankModel />}
+        {(display === TankopediaDisplay.Model ||
+          (display === TankopediaDisplay.DynamicArmor &&
+            !hideTankModelUnderArmor)) && <TankModel />}
         <ShotDisplay />
         <ArmorPlateDisplay />
         <AutoClear />

packages/website/src/stores/tankopediaPersistent/index.ts

@@ -18,6 +18,7 @@ export interface TankopediaPersistentStore {
   showExternalModules: boolean;
   showPrimaryArmor: boolean;
   recentlyViewed: number[];
+  hideTankModelUnderArmor: boolean;
 
   sort: {
     by: TankopediaSortBy;
@@ -29,6 +30,7 @@ export const TankopediaPersistent = createContextualStore(() =>
   create<TankopediaPersistentStore>()(
     persist(
       subscribeWithSelector<TankopediaPersistentStore>(() => ({
+        hideTankModelUnderArmor: false,
         wireframe: false,
         opaque: false,
         advancedHighlighting: false,