feat: test tank filters

src/app/tools/tankopedia/components/Options.tsx

@@ -19,6 +19,7 @@ import {
 import mutateTankopedia, {
   TankopediaSortBy,
   TankopediaSortDirection,
+  TankopediaTestTankDisplay,
   useTankopedia,
 } from '../../../../stores/tankopedia';
 
@@ -27,8 +28,8 @@ export function Options() {
   const tankopediaState = useTankopedia();
 
   return (
-    <Flex justify="center" wrap="wrap" gap="4">
-      <Flex gap="2">
+    <Flex justify="center" wrap="wrap" gap="2">
+      <Flex gap="1">
         <DropdownMenu.Root>
           <DropdownMenu.Trigger>
             <Button variant="soft">
@@ -78,6 +79,33 @@ export function Options() {
         </DropdownMenu.Root>
       </Flex>
 
+      <DropdownMenu.Root>
+        <DropdownMenu.Trigger>
+          <Button variant="soft">
+            Test tanks
+            <CaretDownIcon />
+          </Button>
+        </DropdownMenu.Trigger>
+        <DropdownMenu.Content>
+          <DropdownMenu.RadioGroup
+            value={tankopediaState.filters.test}
+            onValueChange={(value) =>
+              mutateTankopedia((draft) => {
+                draft.filters.test = value as TankopediaTestTankDisplay;
+              })
+            }
+          >
+            <DropdownMenu.RadioItem value="include">
+              Include
+            </DropdownMenu.RadioItem>
+            <DropdownMenu.RadioItem value="exclude">
+              Exclude
+            </DropdownMenu.RadioItem>
+            <DropdownMenu.RadioItem value="only">Only</DropdownMenu.RadioItem>
+          </DropdownMenu.RadioGroup>
+        </DropdownMenu.Content>
+      </DropdownMenu.Root>
+
       <Flex>
         {[...TIERS].reverse().map((tier, index) => (
           <Button
@@ -236,6 +264,7 @@ export function Options() {
               tiers: [],
               treeTypes: [],
               types: [],
+              test: 'include',
             },
           })
         }

src/app/tools/tankopedia/page.tsx

@@ -44,7 +44,12 @@ export default function Page() {
               : tankopediaState.filters.treeTypes.includes(tank.tree_type)) &&
             (tankopediaState.filters.nations.length === 0
               ? true
-              : tankopediaState.filters.nations.includes(tank.nation)),
+              : tankopediaState.filters.nations.includes(tank.nation)) &&
+            (tankopediaState.filters.test === 'include'
+              ? true
+              : tankopediaState.filters.test === 'exclude'
+                ? !tank.testing
+                : tank.testing),
         )
         .sort((a, b) => {
           let diff = 0;

src/core/blitzkrieg/definitions/tanks.ts

@@ -3,6 +3,7 @@ import { TankType, TreeTypeString } from '../../../components/Tanks';
 import { asset } from '../asset';
 
 export interface TankDefinition {
+  id: number;
   nation: string;
   name: string;
   name_short?: string;
@@ -15,7 +16,7 @@ export interface TankDefinition {
 export type TankDefinitions = Record<number, TankDefinition>;
 
 export const tankDefinitions = fetch(asset('definitions/tanks.json'), {
-  cache: 'no-store',
+  cache: 'no-cache',
 }).then(async (response) => response.json() as Promise<TankDefinitions>);
 
 const entries = new Promise<TankDefinition[]>(async (resolve) => {

src/stores/tankopedia.ts

@@ -6,6 +6,7 @@ import { Tier } from '../core/blitzkrieg/definitions/tanks';
 
 export type TankopediaSortBy = 'tier' | 'name';
 export type TankopediaSortDirection = 'ascending' | 'descending';
+export type TankopediaTestTankDisplay = 'include' | 'exclude' | 'only';
 
 type Tankopedia = {
   sort: {
@@ -17,6 +18,7 @@ type Tankopedia = {
     types: TankType[];
     treeTypes: TreeTypeString[];
     nations: string[];
+    test: TankopediaTestTankDisplay;
   };
 };
 
@@ -33,6 +35,7 @@ export const useTankopedia = create<Tankopedia>()(
           types: [],
           treeTypes: [],
           nations: [],
+          test: 'include',
         },
       }),
       { name: 'tankopedia' },