fix: some linting

packages/website/src/components/Charts/ChartsControl.tsx

@@ -1,32 +0,0 @@
-import { Flex, Select, Text } from '@radix-ui/themes';
-import { Charts, type ChartsPeriod } from '../../stores/charts';
-
-export function ChartsControl() {
-  const period = Charts.use((state) => state.period);
-  const mutateCharts = Charts.useMutation();
-
-  return (
-    <Flex justify="center" align="center" gap="2">
-      <Text>Player count</Text>
-      <Select.Root
-        value={period}
-        onValueChange={(period) => {
-          mutateCharts((draft) => {
-            draft.period = period as ChartsPeriod;
-          });
-        }}
-      >
-        <Select.Trigger />
-        <Select.Content>
-          <Select.Item value="total">Total</Select.Item>
-          <Select.Item value="d_120">Past 120 days</Select.Item>
-          <Select.Item value="d_90">Past 90 days</Select.Item>
-          <Select.Item value="d_60">Past 60 days</Select.Item>
-          <Select.Item value="d_30">This month</Select.Item>
-          <Select.Item value="d_7">This week</Select.Item>
-          <Select.Item value="d_1">Yesterday</Select.Item>
-        </Select.Content>
-      </Select.Root>
-    </Flex>
-  );
-}

packages/website/src/components/Charts/PlayersInPeriod.tsx

@@ -1,99 +0,0 @@
-import {
-  TANK_CLASSES,
-  TIERS,
-  TIER_ROMAN_NUMERALS,
-  TankClass,
-  formatCompact,
-} from '@blitzkit/core';
-import strings from '@blitzkit/core/lang/en-US.json';
-import { useStore } from '@nanostores/react';
-import { Box, Flex, Heading } from '@radix-ui/themes';
-import { awaitableAverageDefinitions } from '../../core/awaitables/averageDefinitions';
-import { awaitableTankDefinitions } from '../../core/awaitables/tankDefinitions';
-import { filterTank } from '../../core/blitzkit/filterTank';
-import { useAveragesExclusionRatio } from '../../hooks/useAveragesExclusionRatio';
-import { Charts } from '../../stores/charts';
-import { $tankFilters } from '../../stores/tankFilters';
-import { ThemedBar } from '../Nivo/ThemedBar';
-
-const [tankDefinitions, averageDefinitions] = await Promise.all([
-  awaitableTankDefinitions,
-  awaitableAverageDefinitions,
-]);
-
-const averageDefinitionsArray = Object.entries(averageDefinitions.averages);
-
-export function PlayersInPeriod() {
-  const period = Charts.use((state) => state.period);
-  const ratio = useAveragesExclusionRatio();
-  const filters = useStore($tankFilters);
-  const data = TIERS.map((tier) => {
-    const players: Record<TankClass, number> = {
-      0: 0,
-      1: 0,
-      2: 0,
-      3: 0,
-    };
-
-    averageDefinitionsArray.forEach(([idString, entry]) => {
-      const id = Number(idString);
-      const tank = tankDefinitions.tanks[id];
-
-      if (
-        tank === undefined ||
-        tank.tier !== tier ||
-        !filterTank(filters, tank)
-      ) {
-        return;
-      }
-
-      players[tank.class] += entry.samples[period] * ratio;
-    });
-
-    const bar: Record<string, number | string> = {
-      tier: TIER_ROMAN_NUMERALS[tier],
-    };
-
-    TANK_CLASSES.forEach((c) => {
-      bar[strings.common.tank_class_short[c]] = players[c];
-    });
-
-    return bar;
-  });
-
-  return (
-    <Flex direction="column" gap="4">
-      <Heading align="center">Players by tier & class</Heading>
-      <Box height="25rem">
-        <ThemedBar
-          data={data}
-          keys={TANK_CLASSES.map((c) => strings.common.tank_class_short[c])}
-          indexBy="tier"
-          margin={{ right: 90, bottom: 50, left: 90 }}
-          axisBottom={{
-            legend: 'Tier',
-            legendPosition: 'middle',
-            legendOffset: 32,
-          }}
-          axisLeft={{
-            legend: 'Players',
-            legendPosition: 'middle',
-            legendOffset: -60,
-            format: formatCompact,
-          }}
-          legends={[
-            {
-              dataFrom: 'keys',
-              anchor: 'bottom-right',
-              direction: 'column',
-              translateX: 120,
-              itemWidth: 100,
-              itemHeight: 20,
-            },
-          ]}
-          valueFormat={formatCompact}
-        />
-      </Box>
-    </Flex>
-  );
-}

packages/website/src/components/Charts/constants.ts

@@ -1 +0,0 @@
-export const FIRST_AVERAGES_ENTRY = 19925;

packages/website/src/components/HomeHero.astro

@@ -1,7 +1,6 @@
 ---
 import { Code, Flex, Heading, Text } from '@radix-ui/themes';
 import { resolveBranchName } from '../core/blitzkit/branches';
-import { DEFAULT_LOCALE } from '@blitzkit/core';
 import { getStrings } from '../core/i18n/getStrings';
 import { literals } from '../core/i18n/literals';
 

packages/website/src/components/Performance/PerformanceInfo.tsx

@@ -6,6 +6,7 @@ import { awaitableDiscoveredIdsDefinitions } from '../../core/awaitables/discove
 import { literals } from '../../core/i18n/literals';
 import { useLocale } from '../../hooks/useLocale';
 import type { MaybeSkeletonComponentProps } from '../../types/maybeSkeletonComponentProps';
+import { InlineSkeleton } from '../InlineSkeleton';
 
 const [discoveredIdsDefinitions, averageDefinitions] = await Promise.all([
   awaitableDiscoveredIdsDefinitions,
@@ -36,14 +37,13 @@ export function PerformanceInfo({ skeleton }: MaybeSkeletonComponentProps) {
           <InfoCircledIcon />
         </Callout.Icon>
         <Callout.Text>
-          {/* Estimated stats based on{' '}
-          {skeleton ? <InlineSkeleton width="2rem" /> : samples} players.
-          Updated {skeleton ? <InlineSkeleton width="3rem" /> : timeAgo} ago. */}
+          {skeleton && <InlineSkeleton width="9rem" />}
 
-          {literals(strings.website.tools.performance.estimation.body, [
-            samples,
-            timeAgo,
-          ])}
+          {!skeleton &&
+            literals(strings.website.tools.performance.estimation.body, [
+              samples,
+              timeAgo,
+            ])}
         </Callout.Text>
       </Callout.Root>
     </Flex>

packages/website/src/components/Performance/Tanks.tsx

@@ -51,7 +51,7 @@ export function Tanks({ skeleton }: MaybeSkeletonComponentProps) {
           (a, b) =>
             sort.direction * (a.mu.hits / a.mu.shots - b.mu.hits / b.mu.shots),
         );
-      case 'capturePoints':
+      case 'capture_points':
         return averageDefinitionsArray.sort(
           (a, b) =>
             sort.direction *
@@ -65,14 +65,14 @@ export function Tanks({ skeleton }: MaybeSkeletonComponentProps) {
             (a.mu.damage_dealt / a.mu.battles -
               b.mu.damage_dealt / b.mu.battles),
         );
-      case 'damageRatio':
+      case 'damage_ratio':
         return averageDefinitionsArray.sort(
           (a, b) =>
             sort.direction *
             (a.mu.damage_dealt / a.mu.damage_received -
               b.mu.damage_dealt / b.mu.damage_received),
         );
-      case 'damageTaken':
+      case 'damage_taken':
         return averageDefinitionsArray.sort(
           (a, b) =>
             sort.direction *

packages/website/src/components/ToolOpenGraph.astro

@@ -1,22 +1,20 @@
 ---
 import { imgur } from '@blitzkit/core';
 import { type Tool } from '../constants/tools';
+import { getStrings } from '../core/i18n/getStrings';
 
 interface Props {
   tool: Tool;
 }
 
 const { tool } = Astro.props;
+const { locale } = Astro.params;
+const strings = getStrings(locale);
+const toolStrings =
+  strings.website.tools[tool.id as keyof typeof strings.website.tools];
 ---
 
-<title>{tool.title}</title>
+<title>{toolStrings.name}</title>
 <meta property="og:image" content={imgur(tool.image)} />
-
-{
-  tool.pageDescription !== undefined && (
-    <>
-      <meta name="description" content={tool.pageDescription} />
-      <meta property="og:description" content={tool.pageDescription} />
-    </>
-  )
-}
+<meta name="description" content={toolStrings.seo_description} />
+<meta property="og:description" content={toolStrings.seo_description} />

packages/website/src/components/WargamingLoginButton.tsx

@@ -1,9 +1,11 @@
 import { assertSecret, REGIONS } from '@blitzkit/core';
-import strings from '@blitzkit/core/lang/en-US.json';
 import { Button, type ButtonProps, Dialog, Flex, Link } from '@radix-ui/themes';
+import { useLocale } from '../hooks/useLocale';
 import { WargamingIcon } from './WargamingIcon';
 
 export function WargamingLoginButton({ children, ...props }: ButtonProps) {
+  const { strings } = useLocale();
+
   return (
     <Dialog.Root>
       <Dialog.Trigger>