From 1e91065033a1121b0f260ffb8037a0c86d2eff1c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Thu, 31 Jul 2025 14:42:12 -0500
Subject: [PATCH] feat: assault graph

---
 .../AssaultRangesVisualizer/index.tsx         | 71 ++++++++++++++++++-
 .../src/core/blitzkit/tankCharacteristics.ts  |  3 +-
 2 files changed, 72 insertions(+), 2 deletions(-)

diff --git a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/AssaultRangesVisualizer/index.tsx b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/AssaultRangesVisualizer/index.tsx
index bdc3249d0..c3989b860 100644
--- a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/AssaultRangesVisualizer/index.tsx
+++ b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/AssaultRangesVisualizer/index.tsx
@@ -1,9 +1,78 @@
 import type { AssaultRanges } from '@blitzkit/core';
+import { Box, Card, Flex, Inset, Text } from '@radix-ui/themes';
+import { clamp } from 'three/src/math/MathUtils.js';
+import { Var } from '../../../../../../../core/radix/var';
 
 interface Props {
   ranges: AssaultRanges;
 }
 
+const ASSAULT_RANGE_BAR_HEIGHT = '8rem';
+
 export function AssaultRangesVisualizer({ ranges }: Props) {
-  return null;
+  return (
+    <Card variant="classic">
+      <Inset>
+        <Flex pl="3" pt="4" direction="column" gap="5">
+          <Text size="2" color="gray">
+            Assault shell damage
+          </Text>
+
+          <Flex>
+            <Box position="relative" width={Var('space-7')}>
+              {ranges.ranges.map((range) => (
+                <Text
+                  style={{
+                    position: 'absolute',
+                    left: 0,
+                    top: `${(1 - range.factor) * 100}%`,
+                    transform: 'translateY(-50%)',
+                  }}
+                  color="gray"
+                  size="1"
+                  wrap="nowrap"
+                >
+                  {Math.round(range.factor * 100)}%
+                </Text>
+              ))}
+            </Box>
+
+            <Flex flexGrow="1" align="end" position="relative">
+              {ranges.ranges.map((range, index) => (
+                <>
+                  <Box
+                    style={{
+                      height: `calc(${ASSAULT_RANGE_BAR_HEIGHT} * ${range.factor})`,
+                      backgroundColor: `color-mix(in hsl, ${Var('tomato-9')}, ${Var('jade-9')} ${
+                        clamp(
+                          1.5 * (range.factor - 1) + 1,
+
+                          0,
+                          1,
+                        ) * 100
+                      }%)`,
+                    }}
+                    flexGrow={`${range.distance}`}
+                    key={index}
+                  />
+
+                  <Box
+                    position="absolute"
+                    left="0"
+                    bottom={`${range.factor * 100}%`}
+                    width="100%"
+                    height="0.5px"
+                    style={{
+                      transform: 'translateY(-50%)',
+                      backgroundColor: Var('gray-12'),
+                    }}
+                  />
+                </>
+              ))}
+            </Flex>
+          </Flex>
+        </Flex>
+      </Inset>
+    </Card>
+  );
 }
diff --git a/packages/website/src/core/blitzkit/tankCharacteristics.ts b/packages/website/src/core/blitzkit/tankCharacteristics.ts
index c332211ac..954baae7f 100644
--- a/packages/website/src/core/blitzkit/tankCharacteristics.ts
+++ b/packages/website/src/core/blitzkit/tankCharacteristics.ts
@@ -166,7 +166,8 @@ export function tankCharacteristics(
           ({ distance }) => distance >= assaultDistance,
         )?.factor ?? 0)
       : 1;
-  const moduleDamageCoefficient = coefficient([hasTungsten, 0.15]);
+  const moduleDamageCoefficient =
+    coefficient([hasTungsten, 0.15]) * assaultDamageCoefficient;
   const reloadCoefficient =
     (coefficient([hasGunRammer, -0.05]) *
       coefficient([true, degressiveStat(loaderMastery)])) /