diff --git a/src/app/tools/tankopedia/components/FilterControl.tsx b/src/app/tools/tankopedia/components/FilterControl.tsx
index d2be97bf1..0ab1e2e8e 100644
--- a/src/app/tools/tankopedia/components/FilterControl.tsx
+++ b/src/app/tools/tankopedia/components/FilterControl.tsx
@@ -1,7 +1,7 @@
'use client';
import { ReloadIcon } from '@radix-ui/react-icons';
-import { Box, Flex, IconButton, Text } from '@radix-ui/themes';
+import { Box, Flex, IconButton, Text, Tooltip } from '@radix-ui/themes';
import { times } from 'lodash';
import { use } from 'react';
import { classIcons } from '../../../../components/ClassIcon';
@@ -14,6 +14,7 @@ import { asset } from '../../../../core/blitzkit/asset';
import { gameDefinitions } from '../../../../core/blitzkit/gameDefinitions';
import { Tier } from '../../../../core/blitzkit/tankDefinitions';
import { TIER_ROMAN_NUMERALS } from '../../../../core/blitzkit/tankDefinitions/constants';
+import strings from '../../../../lang/en-US.json';
import * as TankFilters from '../../../../stores/tankFilters';
interface FilterControlProps {
@@ -39,24 +40,26 @@ export function FilterControl({ compact }: FilterControlProps) {
const selected = filters.tiers?.includes(tier);
return (
-
- mutateTankFilters((draft) => {
- if (draft.tiers?.includes(tier)) {
- draft.tiers = draft.tiers?.filter((t) => t !== tier);
- } else {
- draft.tiers = [...(draft.tiers ?? []), tier];
- }
- })
- }
- >
- {TIER_ROMAN_NUMERALS[tier]}
-
+
+
+ mutateTankFilters((draft) => {
+ if (draft.tiers?.includes(tier)) {
+ draft.tiers = draft.tiers?.filter((t) => t !== tier);
+ } else {
+ draft.tiers = [...(draft.tiers ?? []), tier];
+ }
+ })
+ }
+ >
+ {TIER_ROMAN_NUMERALS[tier]}
+
+
);
})}
@@ -66,24 +69,26 @@ export function FilterControl({ compact }: FilterControlProps) {
const selected = filters.tiers?.includes(tier);
return (
-
- mutateTankFilters((draft) => {
- if (draft.tiers?.includes(tier)) {
- draft.tiers = draft.tiers?.filter((t) => t !== tier);
- } else {
- draft.tiers = [...(draft.tiers ?? []), tier];
- }
- })
- }
- >
- {TIER_ROMAN_NUMERALS[tier]}
-
+
+
+ mutateTankFilters((draft) => {
+ if (draft.tiers?.includes(tier)) {
+ draft.tiers = draft.tiers?.filter((t) => t !== tier);
+ } else {
+ draft.tiers = [...(draft.tiers ?? []), tier];
+ }
+ })
+ }
+ >
+ {TIER_ROMAN_NUMERALS[tier]}
+
+
);
})}
@@ -101,29 +106,37 @@ export function FilterControl({ compact }: FilterControlProps) {
const selected = filters.nations?.includes(nation);
return (
-
- mutateTankFilters((draft) => {
- if (draft.nations?.includes(nation)) {
- draft.nations = draft.nations?.filter(
- (n) => n !== nation,
- );
- } else {
- draft.nations = [...(draft.nations ?? []), nation];
- }
- })
+
-
-
+
+ mutateTankFilters((draft) => {
+ if (draft.nations?.includes(nation)) {
+ draft.nations = draft.nations?.filter(
+ (n) => n !== nation,
+ );
+ } else {
+ draft.nations = [...(draft.nations ?? []), nation];
+ }
+ })
+ }
+ >
+
+
+
);
})}
@@ -134,30 +147,39 @@ export function FilterControl({ compact }: FilterControlProps) {
const selected = filters.nations?.includes(nation);
return (
-
- mutateTankFilters((draft) => {
- if (draft.nations?.includes(nation)) {
- draft.nations = draft.nations?.filter(
- (n) => n !== nation,
- );
- } else {
- draft.nations = [...(draft.nations ?? []), nation];
- }
- })
+
-
-
+
+ mutateTankFilters((draft) => {
+ if (draft.nations?.includes(nation)) {
+ draft.nations = draft.nations?.filter(
+ (n) => n !== nation,
+ );
+ } else {
+ draft.nations = [...(draft.nations ?? []), nation];
+ }
+ })
+ }
+ >
+
+
+
);
})}
@@ -173,26 +195,30 @@ export function FilterControl({ compact }: FilterControlProps) {
const selected = filters.classes?.includes(tankClass);
return (
-
- mutateTankFilters((draft) => {
- if (draft.classes?.includes(tankClass)) {
- draft.classes = draft.classes?.filter(
- (c) => c !== tankClass,
- );
- } else {
- draft.classes = [...(draft.classes ?? []), tankClass];
- }
- })
- }
>
-
-
+
+ mutateTankFilters((draft) => {
+ if (draft.classes?.includes(tankClass)) {
+ draft.classes = draft.classes?.filter(
+ (c) => c !== tankClass,
+ );
+ } else {
+ draft.classes = [...(draft.classes ?? []), tankClass];
+ }
+ })
+ }
+ >
+
+
+
);
})}
@@ -202,67 +228,75 @@ export function FilterControl({ compact }: FilterControlProps) {
style={{ borderRadius: 'var(--radius-full)' }}
direction={compact ? 'column' : { sm: 'row', initial: 'column' }}
>
-
- mutateTankFilters((draft) => {
- if (draft.types?.includes('researchable')) {
- draft.types = draft.types?.filter((t) => t !== 'researchable');
- } else {
- draft.types = [...(draft.types ?? []), 'researchable'];
- }
- })
- }
- >
-
-
-
- mutateTankFilters((draft) => {
- if (draft.types?.includes('premium')) {
- draft.types = draft.types?.filter((t) => t !== 'premium');
- } else {
- draft.types = [...(draft.types ?? []), 'premium'];
- }
- })
- }
- >
-
+
+ mutateTankFilters((draft) => {
+ if (draft.types?.includes('researchable')) {
+ draft.types = draft.types?.filter(
+ (t) => t !== 'researchable',
+ );
+ } else {
+ draft.types = [...(draft.types ?? []), 'researchable'];
+ }
+ })
+ }
>
-
-
-
- mutateTankFilters((draft) => {
- if (draft.types?.includes('collector')) {
- draft.types = draft.types?.filter((t) => t !== 'collector');
- } else {
- draft.types = [...(draft.types ?? []), 'collector'];
- }
- })
- }
- >
-
+
+
+
+ mutateTankFilters((draft) => {
+ if (draft.types?.includes('premium')) {
+ draft.types = draft.types?.filter((t) => t !== 'premium');
+ } else {
+ draft.types = [...(draft.types ?? []), 'premium'];
+ }
+ })
+ }
>
-
-
-
+
+
+
+
+
+
+
+ mutateTankFilters((draft) => {
+ if (draft.types?.includes('collector')) {
+ draft.types = draft.types?.filter((t) => t !== 'collector');
+ } else {
+ draft.types = [...(draft.types ?? []), 'collector'];
+ }
+ })
+ }
+ >
+
+
+
+
+
-
- mutateTankFilters((draft) => {
- draft.testing = 'include';
- })
- }
- >
-
-
-
- mutateTankFilters((draft) => {
- draft.testing = 'exclude';
- })
- }
- >
-
-
-
- mutateTankFilters((draft) => {
- draft.testing = 'only';
- })
- }
- >
-
-
+
+
+ mutateTankFilters((draft) => {
+ draft.testing = 'include';
+ })
+ }
+ >
+
+
+
+
+
+ mutateTankFilters((draft) => {
+ draft.testing = 'exclude';
+ })
+ }
+ >
+
+
+
+
+
+ mutateTankFilters((draft) => {
+ draft.testing = 'only';
+ })
+ }
+ >
+
+
+
diff --git a/src/lang/en-US.json b/src/lang/en-US.json
index a170b1a2f..63390b39b 100644
--- a/src/lang/en-US.json
+++ b/src/lang/en-US.json
@@ -58,6 +58,13 @@
"AT-SPG": "TD"
},
+ "tank_class_medium": {
+ "lightTank": "Light",
+ "mediumTank": "Medium",
+ "heavyTank": "Heavy",
+ "AT-SPG": "Tank destroyer"
+ },
+
"tree_type": {
"researchable": "Tech tree",
"premium": "Premium",