From 655b87d876c6aa69977a5e2e68bce1122d2cd010 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Fri, 3 Apr 2026 15:02:50 -0500
Subject: [PATCH] feat: compare equalize

---
 packages/i18n/strings/en.json                 |  3 +-
 .../src/components/Compare/CompareTable.tsx   | 28 ++++++++++++++++++-
 .../src/pages/[...locale]/compare/_index.tsx  |  2 +-
 3 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/packages/i18n/strings/en.json b/packages/i18n/strings/en.json
index dafb840dd..8e5746268 100644
--- a/packages/i18n/strings/en.json
+++ b/packages/i18n/strings/en.json
@@ -1291,7 +1291,8 @@
           },
           "skills": {
             "clear": "Clear",
-            "maximize": "Maximize"
+            "maximize": "Maximize",
+            "equalize": "Equalize"
           },
           "modules": {
             "stock": "Stock",
diff --git a/packages/website/src/components/Compare/CompareTable.tsx b/packages/website/src/components/Compare/CompareTable.tsx
index 6155b7a64..d3ca23c23 100644
--- a/packages/website/src/components/Compare/CompareTable.tsx
+++ b/packages/website/src/components/Compare/CompareTable.tsx
@@ -1,7 +1,15 @@
 import { asset, availableProvisions, permanentSkills } from "@blitzkit/core";
 import { checkConsumableProvisionInclusivity } from "@blitzkit/core/src/blitzkit/checkConsumableProvisionInclusivity";
 import { ComponentPlaceholderIcon } from "@radix-ui/react-icons";
-import { Button, Flex, IconButton, Popover, Table } from "@radix-ui/themes";
+import {
+  Button,
+  Flex,
+  IconButton,
+  Popover,
+  Switch,
+  Table,
+  Text,
+} from "@radix-ui/themes";
 import { times } from "lodash-es";
 import { awaitableConsumableDefinitions } from "../../core/awaitables/consumableDefinitions";
 import { awaitableEquipmentDefinitions } from "../../core/awaitables/equipmentDefinitions";
@@ -44,6 +52,7 @@ export function CompareTable({ stats }: CompareTableProps) {
   const crewSkills = CompareEphemeral.use((state) => state.crewSkills);
   const members = CompareEphemeral.use((state) => state.members);
   const { unwrap, strings } = useLocale();
+  const equalize = CompareEphemeral.use((state) => state.equalize);
 
   return (
     <StickyTableRoot
@@ -80,10 +89,12 @@ export function CompareTable({ stats }: CompareTableProps) {
         <Table.Row>
           <Table.Cell style={{ height: "100%" }}>
             <Flex
+              gap="2"
               style={{
                 width: "100%",
                 height: "100%",
               }}
+              direction="column"
               align="center"
               justify="center"
             >
@@ -155,6 +166,21 @@ export function CompareTable({ stats }: CompareTableProps) {
                   </Flex>
                 </Popover.Content>
               </Popover.Root>
+
+              <Flex align="center" gap="1">
+                <Text>
+                  {strings.website.tools.compare.table.skills.equalize}
+                </Text>
+                <Switch
+                  size="1"
+                  checked={equalize}
+                  onCheckedChange={(checked) => {
+                    CompareEphemeral.mutate((draft) => {
+                      draft.equalize = checked;
+                    });
+                  }}
+                />
+              </Flex>
             </Flex>
           </Table.Cell>
 
diff --git a/packages/website/src/pages/[...locale]/compare/_index.tsx b/packages/website/src/pages/[...locale]/compare/_index.tsx
index 08615f201..b658aa085 100644
--- a/packages/website/src/pages/[...locale]/compare/_index.tsx
+++ b/packages/website/src/pages/[...locale]/compare/_index.tsx
@@ -85,7 +85,7 @@ function Content() {
           },
         ),
       ),
-    [members, crewSkills],
+    [members, crewSkills, equalize],
   );
 
   useEffect(() => {