unselect all equipment button

packages/website-ue/src/components/TankopediaLoadout/index.tsx

@@ -5,9 +5,11 @@ import { StandardPrice } from "@protos/blitz_static_standard_price";
 import type { UpgradeLine } from "@protos/blitz_static_tank_upgrade_line";
 import type { StageParameters } from "@protos/blitz_static_tank_upgrade_single_stage";
 import {
+  ButtonIcon,
   CornerBottomLeftIcon,
   DoubleArrowLeftIcon,
   DoubleArrowRightIcon,
+  TrashIcon,
 } from "@radix-ui/react-icons";
 import { chunk } from "lodash-es";
 import { useMemo } from "react";
@@ -76,6 +78,19 @@ function Equipment() {
     <div className={styles.section}>
       <div className={styles.header}>
         <Heading size="4">{strings.tanks.loadout.equipment}</Heading>
+
+        <IconButton
+          color="red"
+          onClick={() => {
+            Tankopedia.mutate((draft) => {
+              for (const key in draft.protagonist.equipment) {
+                delete draft.protagonist.equipment[key];
+              }
+            });
+          }}
+        >
+          <TrashIcon />
+        </IconButton>
       </div>
 
       <div className={styles.equipment}>

packages/website-ue/src/pages/[...locale]/tanks/[slug]/index.astro

@@ -5,6 +5,7 @@ import { mixStaticPaths } from "../../../../astro/mixStaticPaths";
 import BaseLayout from "../../../../layouts/BaseLayout.astro";
 import { getStaticPaths as _getStaticPaths } from "../index.astro";
 import { Page } from "./_index";
+import ColorScale from "../../../../components/ColorScale.astro";
 
 export const getStaticPaths = mixStaticPaths(_getStaticPaths, async () => {
   const { list } = await api.tankList();
@@ -19,5 +20,7 @@ const { id, locale } = Astro.props;
 ---
 
 <BaseLayout {locale} accent="violet">
+    <ColorScale color="red" />
+
   <Page {locale} {id} client:load />
 </BaseLayout>