feat: start of tankopedia translation

This commit is contained in:
tresabhi committed 2025-01-07 13:59:33 -06:00
1 parent 5a65fee1d1
commit 91b367cd70
6 files changed
+39 -92

No files matched your search

@@ -1,6 +1,6 @@
import { TIER_ROMAN_NUMERALS } from '@blitzkit/core';
import strings from '@blitzkit/core/lang/en-US.json';
import { Flex, Heading, SegmentedControl, Text } from '@radix-ui/themes';
import { useLocale } from '../../../../../../hooks/useLocale';
import { Duel } from '../../../../../../stores/duel';
import {
TankopediaEphemeral,
@@ -13,6 +13,7 @@ export function CharacteristicsHeading() {
);
const tank = Duel.use((state) => state.protagonist.tank);
const mutateTankopediaEphemeral = TankopediaEphemeral.useMutation();
const { strings } = useLocale();
return (
<Flex
@@ -5,7 +5,6 @@ import {
TankType,
TIER_ROMAN_NUMERALS,
} from '@blitzkit/core';
import strings from '@blitzkit/core/lang/en-US.json';
import { ChevronLeftIcon, MixIcon, UpdateIcon } from '@radix-ui/react-icons';
import { Button, Code, Dialog, Flex, Link } from '@radix-ui/themes';
import { useState } from 'react';
@@ -39,7 +38,7 @@ export function MetaSection() {
const mutateDuel = Duel.useMutation();
const mutateTankopediaEphemeral = TankopediaEphemeral.useMutation();
const [showSwapDialog, setShowSwapDialog] = useState(false);
const { locale } = useLocale();
const { locale, strings } = useLocale();
return (
<Flex justify="center" align="center">
@@ -1,63 +0,0 @@
import { asset, AverageDefinitions } from '@blitzkit/core';
import { Box, Flex, Heading, Text } from '@radix-ui/themes';
import { range } from 'lodash-es';
import { useAveragesExclusionRatio } from '../../hooks/useAveragesExclusionRatio';
import { Duel } from '../../stores/duel';
import { FIRST_AVERAGES_ENTRY } from '../Charts/constants';
import { ThemedLine } from '../Nivo/ThemedLine';
const currentEntry = Math.floor(Date.now() / 1000 / 60 / 60 / 24);
const days = await Promise.all(
range(FIRST_AVERAGES_ENTRY, currentEntry).map(async (day) => {
const url = asset(`averages/${day}.pb`);
const response = await fetch(url);
if (response.status !== 200) return null;
const buffer = await response.arrayBuffer();
const averageDefinitions = AverageDefinitions.decode(
new Uint8Array(buffer),
);
return { day, definitions: averageDefinitions };
}),
).then((days) => days.filter((day) => day !== null));
export function TankopediaCharts() {
const id = Duel.use((state) => state.protagonist.tank.id);
const ratio = useAveragesExclusionRatio();
const data = days.map(({ day, definitions }) => {
const entry = definitions.averages[id];
const x = new Date(day * 24 * 60 * 60 * 1000);
const y = entry ? Math.round((entry.samples.d_7 / 7) * ratio) : 0;
return { x, y };
});
return (
<Flex direction="column" align="center">
<Flex direction="column" width="50rem">
<Heading>Players</Heading>
<Text color="gray" mb="5">
7-day rolling average
</Text>
<Box height="25rem">
<ThemedLine
enablePoints={false}
enableGridX={false}
data={[{ id: 'value', data }]}
xFormat={(date) => {
return (date as Date).toLocaleDateString(undefined, {
day: 'numeric',
month: 'short',
year: 'numeric',
});
}}
xScale={{ type: 'time' }}
/>
</Box>
</Flex>
</Flex>
);
}