feat: reset button

docs/changelogs/1.25.0.md

@@ -0,0 +1,6 @@
+# BlitzKit 1.25.0
+
+## Features
+
+- Added embeds
+  - This tool is intended

package.json

@@ -1,7 +1,7 @@
 {
   "name": "blitzkit",
   "private": true,
-  "version": "1.24.0",
+  "version": "1.25.0",
   "description": "🎉 Tools for everything World of Tanks Blitz",
   "type": "module",
   "types": "./types.d.ts",

packages/website/src/components/Embeds/breakdown.tsx

@@ -7,6 +7,8 @@ import {
   type IndividualTankStats,
 } from '@blitzkit/core';
 import strings from '@blitzkit/core/lang/en-US.json';
+import { ReloadIcon } from '@radix-ui/react-icons';
+import { ContextMenu } from '@radix-ui/themes';
 import { useEffect, useMemo, useState } from 'react';
 import { breakdownConfig } from '../../constants/embeds';
 import { EmbedBreakdownPersistent } from '../../stores/embedBreakdownPersistent';
@@ -46,6 +48,7 @@ export function BreakdownRenderer() {
 function BreakdownRendererContent() {
   const { useEmbedState } = useEmbedStateCurry<typeof breakdownConfig>();
   const params = new URLSearchParams(window.location.search);
+  const mutateEmbedBreakdownPersistent = EmbedBreakdownPersistent.useMutation();
   const id = Number(params.get('id'));
   const tankStatsA = EmbedBreakdownPersistent.use((state) => state[id] ?? []);
   const [tankStatsB, setTankStatsB] = useState<IndividualTankStats[]>([]);
@@ -70,14 +73,35 @@ function BreakdownRendererContent() {
   }, []);
 
   return (
-    <BreakdownEmbedWrapper>
-      {useEmbedState('showTotal') && <BreakdownEmbedCard tank={null} />}
+    <ContextMenu.Root>
+      <ContextMenu.Trigger>
+        <BreakdownEmbedWrapper>
+          {useEmbedState('showTotal') && <BreakdownEmbedCard tank={null} />}
 
-      {diff.slice(0, useEmbedState('listMaxTanks')).map((diff) => {
-        const tank = tankDefinitions.tanks[diff.tank_id];
+          {diff.slice(0, useEmbedState('listMaxTanks')).map((diff) => {
+            const tank = tankDefinitions.tanks[diff.tank_id];
 
-        return <BreakdownEmbedCard key={tank.id} tank={tank} />;
-      })}
-    </BreakdownEmbedWrapper>
+            return <BreakdownEmbedCard key={tank.id} tank={tank} />;
+          })}
+        </BreakdownEmbedWrapper>
+      </ContextMenu.Trigger>
+
+      <ContextMenu.Content>
+        <ContextMenu.Item
+          color="red"
+          onClick={async () => {
+            const newA = await getTankStats(idToRegion(id), id);
+
+            if (newA === null) return;
+
+            mutateEmbedBreakdownPersistent((draft) => {
+              draft[id] = newA;
+            });
+          }}
+        >
+          <ReloadIcon /> Reset
+        </ContextMenu.Item>
+      </ContextMenu.Content>
+    </ContextMenu.Root>
   );
 }

packages/website/src/components/TanksEmbed.tsx

@@ -7,7 +7,7 @@ import {
 } from '@blitzkit/core';
 import strings from '@blitzkit/core/lang/en-US.json';
 import { amberDark, blueDark } from '@radix-ui/colors';
-import { Flex, Text } from '@radix-ui/themes';
+import { Flex, Text, type FlexProps } from '@radix-ui/themes';
 import { times } from 'lodash-es';
 import type { ReactNode } from 'react';
 import { breakdownConfig } from '../constants/embeds';
@@ -18,17 +18,23 @@ import { ClassLight } from './ClassIcon/components/ClassLight';
 import { ClassMedium } from './ClassIcon/components/ClassMedium';
 import { ClassTankDestroyer } from './ClassIcon/components/ClassTankDestroyer';
 
-interface BreakdownEmbedWrapperProps {
+type BreakdownEmbedWrapperProps = FlexProps & {
   children: ReactNode;
-}
+};
 
 export function BreakdownEmbedWrapper({
   children,
+  ...props
 }: BreakdownEmbedWrapperProps) {
   const { useEmbedState } = useEmbedStateCurry<typeof breakdownConfig>();
 
   return (
-    <Flex direction="column" gap={useEmbedState('listGap')} height="100%">
+    <Flex
+      direction="column"
+      gap={useEmbedState('listGap')}
+      height="100%"
+      {...props}
+    >
       {children}
     </Flex>
   );