From e234b29e166cd71d411614c1f5056e1252e0cd49 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com> Date: Mon, 7 Oct 2024 17:39:20 -0500 Subject: [PATCH] feat: migrate session --- .vscode/settings.json | 1 - packages/website-legacy/tsconfig.json | 3 +- .../src/pages/tools/session/index.astro | 8 ++ .../src/pages/tools/session/index.tsx} | 119 ++++++------------ packages/website/src/stores/session.ts | 23 ++-- 5 files changed, 58 insertions(+), 96 deletions(-) create mode 100644 packages/website/src/pages/tools/session/index.astro rename packages/{website-legacy/src/app/tools/session/page.tsx => website/src/pages/tools/session/index.tsx} (81%) diff --git a/.vscode/settings.json b/.vscode/settings.json index af00b7dc4..3a710c698 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -13,7 +13,6 @@ "artefacts", "astrojs", "atgm", - "Avearges", "AYUV", "battleresults", "bbox", diff --git a/packages/website-legacy/tsconfig.json b/packages/website-legacy/tsconfig.json index 38178c913..b8f98fdb5 100644 --- a/packages/website-legacy/tsconfig.json +++ b/packages/website-legacy/tsconfig.json @@ -10,6 +10,7 @@ "include": [ "src/**/*", ".next/types/**/*.ts", - "../website/src/components/Performance/PerformanceInfo.tsx" + "../website/src/components/Performance/PerformanceInfo.tsx", + "../website/src/pages/tools/session/index.tsx" ] } diff --git a/packages/website/src/pages/tools/session/index.astro b/packages/website/src/pages/tools/session/index.astro new file mode 100644 index 000000000..4255c07ef --- /dev/null +++ b/packages/website/src/pages/tools/session/index.astro @@ -0,0 +1,8 @@ +--- +import { Page } from '.'; +import ToolLayout from '../../../layouts/ToolLayout.astro'; +--- + + + + diff --git a/packages/website-legacy/src/app/tools/session/page.tsx b/packages/website/src/pages/tools/session/index.tsx similarity index 81% rename from packages/website-legacy/src/app/tools/session/page.tsx rename to packages/website/src/pages/tools/session/index.tsx index 9d3852f0b..db4e7b393 100644 --- a/packages/website-legacy/src/app/tools/session/page.tsx +++ b/packages/website/src/pages/tools/session/index.tsx @@ -1,12 +1,9 @@ import { - AccountListWithServer, - IndividualAccountInfo, - IndividualTankStats, STAT_KEYS, STAT_NAMES, - Stat, UNLOCALIZED_REGION_NAMES_SHORT, deltaTankStats, + fetchAverageDefinitions, fetchTankDefinitions, generateStats, getAccountInfo, @@ -15,6 +12,10 @@ import { prettifyStats, searchPlayersAcrossRegions, sumBlitzStarsStats, + type AccountListWithServer, + type IndividualAccountInfo, + type IndividualTankStats, + type Stat, } from '@blitzkit/core'; import { ArrowDownIcon, @@ -29,22 +30,29 @@ import { Heading, IconButton, Select, - Spinner, Table, Text, TextField, } from '@radix-ui/themes'; import { debounce } from 'lodash-es'; -import { use, useEffect, useMemo, useRef, useState } from 'react'; +import { useEffect, useMemo, useRef, useState } from 'react'; +import usePromise from 'react-promise-suspense'; +import { PageWrapper } from '../../../components/PageWrapper'; +import { TankRowHeaderCell } from '../../../components/TankRowHeaderCell'; +import { Session, type SessionTracking } from '../../../stores/session'; -const awaitedTankDefinitions = await fetchTankDefinitions(); +const tankDefinitions = await fetchTankDefinitions(); +const tankAverages = await fetchAverageDefinitions(); -export default function Page({ - searchParams, -}: { - searchParams: { id?: string }; -}) { - const [loaded, setLoaded] = useState(false); +export function Page() { + return ( + + + + ); +} + +function Content() { const [showSearch, setShowSearch] = useState(false); const [searching, setSearching] = useState(false); const [searchResults, setSearchResults] = useState([]); @@ -56,27 +64,26 @@ export default function Page({ const [tankStatsB, setTankStatsB] = useState( null, ); - const accountInfoPromise = useMemo( - () => + const accountInfo = usePromise( + (id?: number) => new Promise(async (resolve) => { + if (!id) return resolve(null); + resolve( - session.tracking - ? await getAccountInfo(session.player.region, session.player.id) - : null, + session.tracking ? await getAccountInfo(idToRegion(id), id) : null, ); }), - [session.tracking && session.player.id], + [session.tracking ? session.player.id : undefined], ); - const accountInfo = use(accountInfoPromise); const delta = useMemo( () => session.tracking && tankStatsB ? deltaTankStats(session.player.stats, tankStatsB) .sort((a, b) => b.last_battle_time - a.last_battle_time) .map((entry) => { - const tank = awaitedTankDefinitions[entry.tank_id]; - const average = awaitedTankAvearges[tank.id]; - const stats = generateStats(entry.all, average?.all); + const tank = tankDefinitions.tanks[entry.tank_id]; + const average = tankAverages.averages[tank.id]; + const stats = generateStats(entry.all, average.mu); const statsPretty = prettifyStats(stats); return { @@ -119,7 +126,7 @@ export default function Page({ if (!input.current) return; draft.tracking = true; - (draft as Session.SessionTracking).player = { + (draft as SessionTracking).player = { id, region, since: Date.now(), @@ -147,22 +154,6 @@ export default function Page({ return () => clearInterval(interval); }, [session.tracking && session.player.id]); - useEffect(() => { - setLoaded(true); - - if (searchParams.id && !session.tracking) { - track(Number(searchParams.id)); - } - }, []); - - if (!loaded) { - return ( - - - - ); - } - return ( - {searchParams.id && - session.tracking && - Number(searchParams.id) !== session.player.id && ( - - - - You are currently tracking {accountInfo?.nickname} - - - Would you like to stop tracking {accountInfo?.nickname} and - start tracking a new player? - - - - - - - - - - )} - {!session.tracking && ( { - (draft as Session.SessionTracking).player.stats = stats; + (draft as SessionTracking).player.stats = stats; }); }} > @@ -383,9 +341,9 @@ export default function Page({ key={key} onClick={() => { mutateSession((draft) => { - ( - draft as Session.SessionTracking - ).columns.unshift(key as Stat); + (draft as SessionTracking).columns.unshift( + key as Stat, + ); }); }} > @@ -401,12 +359,9 @@ export default function Page({ onValueChange={(value) => { mutateSession((draft) => { if (value === 'remove') { - (draft as Session.SessionTracking).columns.splice( - index, - 1, - ); + (draft as SessionTracking).columns.splice(index, 1); } else { - (draft as Session.SessionTracking).columns[index] = + (draft as SessionTracking).columns[index] = value as Stat; } }); diff --git a/packages/website/src/stores/session.ts b/packages/website/src/stores/session.ts index c33ff72a3..118127da3 100644 --- a/packages/website/src/stores/session.ts +++ b/packages/website/src/stores/session.ts @@ -1,5 +1,5 @@ -import { IndividualTankStats, Region, Stat } from '@blitzkit/core'; -import lodash from 'lodash-es'; +import type { IndividualTankStats, Region, Stat } from '@blitzkit/core'; +import { merge } from 'lodash-es'; import { create } from 'zustand'; import { persist } from 'zustand/middleware'; import { createContextualStore } from '../core/zustand/createContextualStore'; @@ -24,15 +24,14 @@ interface SessionNotTracking extends SessionBase { type Session = SessionTracking | SessionNotTracking; -export const { Provider, use, useMutation, useStore } = createContextualStore( - () => - create()( - persist( - (set) => ({ - columns: ['battles', 'winrate', 'wn8', 'averageDamage'], - tracking: false, - }), - { name: 'session-2', merge: (a, b) => lodash.merge(b, a) }, - ), +export const Session = createContextualStore(() => + create()( + persist( + (set) => ({ + columns: ['battles', 'winrate', 'wn8', 'averageDamage'], + tracking: false, + }), + { name: 'session-2', merge: (a, b) => merge(b, a) }, ), + ), );