From 80811724b6b58b09c7b65e3c72585e4a4dcab78a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Sat, 13 Jul 2024 13:52:13 -0500
Subject: [PATCH] fix: client side armor mode

---
 .../[id]/components/Model/components/Options.tsx          | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/app/tools/tankopedia/[id]/components/Model/components/Options.tsx b/src/app/tools/tankopedia/[id]/components/Model/components/Options.tsx
index 1a54382bd..8bae84ec1 100644
--- a/src/app/tools/tankopedia/[id]/components/Model/components/Options.tsx
+++ b/src/app/tools/tankopedia/[id]/components/Model/components/Options.tsx
@@ -18,7 +18,7 @@ import {
   Tabs,
   Text,
 } from '@radix-ui/themes';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { ModuleButton } from '../../../../../../../components/ModuleButtons/ModuleButton';
 import { SmallTankIcon } from '../../../../../../../components/SmallTankIcon';
 import { resolveNearPenetration } from '../../../../../../../core/blitz/resolveNearPenetration';
@@ -43,7 +43,9 @@ import { RotationInputs } from '../../QuickInputs';
 export function Options() {
   const mutateTankopediaEphemeral = TankopediaEphemeral.useMutation();
   const mutateTankopediaPersistent = TankopediaPersistent.useMutation();
-  const mode = TankopediaPersistent.use((state) => state.mode);
+  const modeRaw = TankopediaPersistent.use((state) => state.mode);
+  const [mode, setMode] =
+    useState<TankopediaPersistent.TankopediaMode>('model');
   const isFullScreen = useFullScreen();
   const showGrid = TankopediaPersistent.use(
     (state) => state.model.visual.showGrid,
@@ -76,6 +78,8 @@ export function Options() {
   const mutateDuel = Duel.useMutation();
   const hasEnhancedArmor = useEquipment(110);
 
+  useEffect(() => setMode(modeRaw), [modeRaw]);
+
   return (
     <>
       {isFullScreen && (