From 291395718f4ecbb6c3c0a17daab2244f03d328bc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Fri, 8 Aug 2025 12:09:16 -0500
Subject: [PATCH] feat: yaw

---
 .../GunFlexibilityVisualizer/index.tsx        | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx
index 2b52173b0..3f526d15d 100644
--- a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx
+++ b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx
@@ -25,36 +25,44 @@ export function GunFlexibilityVisualizer() {
   const gunModel = turretModel.guns[gun.gun_type!.value.base.id];
 
   const p = gunModel.pitch;
+  const y = turretModel.yaw;
   const f = p.front;
   const b = p.back;
 
   let d = '';
 
+  // right
   d += `M 0 0`;
   const ms = mag(p.max);
-  if (b) {
+  if (y) {
+    d += `L ${c(90 - y.max, ms)}`;
+  } else if (b) {
     d += `L ${c(-90 + b.range / 2, ms)}`;
   } else {
     d += `L ${c(-90 / 2, ms)}`;
   }
   if (f) {
-    d += `A ${ms} ${ms} 0 0 0 ${c(90 + f.range / 2, ms)}`;
+    d += `A ${ms} ${ms} 0 0 0 ${c(90 - f.range / 2, ms)}`;
   } else {
     d += `A ${ms} ${ms} 0 0 0 ${c(90 / 2, ms)}`;
   }
 
+  // left
   d += `M 0 0`;
   if (f) {
     d += `L ${c(90 + f.range / 2, ms)}`;
   } else {
     d += `L ${c(90 / 2, ms)}`;
   }
-  if (b) {
+  if (y) {
+    d += `A ${ms} ${ms} 0 0 0 ${c(90 - y.min, ms)}`;
+  } else if (b) {
     d += `A ${ms} ${ms} 0 0 0 ${c(-90 - b.range / 2, ms)}`;
   } else {
     d += `A ${ms} ${ms} 0 0 0 ${c(-90 / 2, ms)}`;
   }
 
+  // front
   if (f) {
     const m = mag(f.max);
     d += `M 0 0`;
@@ -63,7 +71,8 @@ export function GunFlexibilityVisualizer() {
     d += `Z`;
   }
 
-  if (b) {
+  // back
+  if (!y && b) {
     const m = mag(b.max);
     d += `M 0 0`;
     d += `L ${c(-90 - b.range / 2, m)}`;
@@ -87,7 +96,7 @@ export function GunFlexibilityVisualizer() {
           fill="var(--gray-1)"
           d="M 0.5 0 A 0.5 0.5 0 1 1 -0.5 0 A 0.5 0.5 0 1 1 0.5 0 Z"
         />
-        <path fill="var(--gray-11)" d={d} />
+        <path fill="var(--gray-a9)" d={d} />
       </svg>
     </Card>
   );