Merge pull request #13 from tresabhi/1.9.0

.github/workflows/host.yml

@@ -35,4 +35,4 @@ jobs:
           unzip dist.zip
 
       - name: Run index.cjs
-        run: NODE_ENV=production DISCORD_TOKEN=${{ secrets.DISCORD_TOKEN }} WARGAMING_APPLICATION_ID=${{ secrets.WARGAMING_APPLICATION_ID }} node --enable-source-maps dist/index.cjs
+        run: NODE_ENV=production DISCORD_TOKEN=${{ secrets.DISCORD_TOKEN }} WARGAMING_APPLICATION_ID=${{ secrets.WARGAMING_APPLICATION_ID }} node --enable-source-maps --trace-warnings bot.cjs

.gitignore

@@ -6,4 +6,6 @@ package-lock.json
 /playwright/.cache/
 dist/
 yarn-error.log
-dist.zip
+dist.zip
+commands.txt
+/test.*

.vscode/settings.json

@@ -3,7 +3,9 @@
     "Abhi",
     "accountinfo",
     "bepaint",
+    "blitzstars",
     "cleandist",
+    "customperiod",
     "fuzzysort",
     "kranvagn",
     "outfile",
@@ -11,13 +13,16 @@
     "playerachievements",
     "playerinfo",
     "Resvg",
+    "roboto",
     "searchclans",
     "searchplayers",
     "searchtanks",
     "SKLLD",
     "Smri",
     "startcase",
+    "statsfull",
     "strvk",
+    "tankaverages",
     "tankopedia",
     "tankstats",
     "Unicum",

package.dist.json

@@ -1,6 +1,6 @@
 {
-  "main": "server.js",
+  "main": "server.cjs",
   "scripts": {
-    "start": "node --enable-source-maps server.cjs"
+    "start": "node --enable-source-maps --trace-warnings server.cjs"
   }
 }

package.json

@@ -1,14 +1,18 @@
 {
   "name": "blitzkrieg",
-  "version": "1.7.4",
+  "version": "1.9.0",
   "description": "",
   "main": "src/index.ts",
   "type": "module",
   "scripts": {
-    "dev": "yarn build --dev && yarn start",
-    "start": "node --enable-source-maps --trace-warnings dist/index.cjs",
+    "build:bot": "node scripts/build --build=bot",
+    "build:server": "node scripts/build --build=server",
+    "build": "yarn lint && node scripts/build --build=all",
+    "dev:bot": "yarn build:bot --dev && yarn start:bot",
+    "dev:server": "yarn build:server --dev && yarn start:server",
+    "start:bot": "node --enable-source-maps --trace-warnings dist/bot.cjs",
+    "start:server": "node --enable-source-maps --trace-warnings dist/server.cjs",
     "zip": "zip -r dist.zip dist",
-    "build": "node scripts/build",
     "lint": "tsc"
   },
   "license": "MIT",
@@ -18,8 +22,9 @@
     "bepaint": "^0.1.0-beta.3",
     "discord.js": "^14.9.0",
     "escape-html": "^1.0.3",
+    "express": "^4.18.2",
     "fuzzysort": "^2.0.4",
-    "lodash.startcase": "^4.4.0",
+    "lodash": "^4.17.21",
     "markdown-escape": "^2.0.0",
     "react": "^18.2.0",
     "satori": "^0.9.1"
@@ -27,7 +32,8 @@
   "devDependencies": {
     "@total-typescript/ts-reset": "^0.4.2",
     "@types/escape-html": "^1.0.2",
-    "@types/lodash.startcase": "^4.4.7",
+    "@types/express": "^4.17.17",
+    "@types/lodash": "^4.14.195",
     "@types/markdown-escape": "^1.1.0",
     "@types/node": "^20.2.1",
     "@types/react": "^18.2.7",

scripts/build.js

@@ -1,27 +1,87 @@
 import { build } from 'esbuild';
-import { rmSync } from 'fs';
+import { copyFile, mkdir, rm, writeFile } from 'fs/promises';
 import { argv } from 'process';
 
-const isDev = argv.includes('--dev');
-const isProd = !isDev;
+const isProd = !argv.includes('--dev');
+const buildAll = argv.includes('--build=all');
+const buildBot = argv.includes('--build=bot') | buildAll;
+const buildServer = argv.includes('--build=server') | buildAll;
 
-console.log('Removing dist...');
-rmSync('dist', { recursive: true, force: true });
+if (isProd) {
+  // only remove in production to ensure no time is wasted in dev
+  console.log('🟡 Removing dist...');
+  await rm('dist', { recursive: true, force: true });
+  console.log('✅ Dist removed');
 
-console.log('Building...');
-build({
-  entryPoints: ['src/index.ts'],
-  outfile: 'dist/index.cjs',
+  console.log('🟡 Creating dist...');
+  await mkdir('dist');
+  console.log('✅ Dist created');
 
+  console.log('🟡 Caching tankopedia...');
+  fetch('https://www.blitzstars.com/bs-tankopedia.json')
+    .then((response) => response.text())
+    .then((tankopedia) => writeFile('./dist/tankopedia.json', tankopedia))
+    .then(() => console.log('✅ Tankopedia cached'));
+
+  console.log('🟡 Caching tank averages...');
+  fetch('https://www.blitzstars.com/api/tankaverages.json')
+    .then((response) => response.json())
+    .then((individualTankAverages) => {
+      const tankAverages = {};
+
+      individualTankAverages.forEach((individualTankAverage) => {
+        tankAverages[individualTankAverage.tank_id] = individualTankAverage;
+      });
+
+      return writeFile(
+        './dist/tankaverages.json',
+        JSON.stringify(tankAverages),
+      );
+    })
+    .then(() => console.log('✅ Tank averages cached'));
+
+  console.log('🟡 Copying package.json...');
+  copyFile('package.dist.json', 'dist/package.json').then(() =>
+    console.log('✅ package.json copied'),
+  );
+}
+
+const commonOptions = {
   platform: 'node',
   loader: {
     '.node': 'copy',
     '.ttf': 'file',
   },
 
-  bundle: isProd,
-  sourcemap: isProd,
+  bundle: true,
+  sourcemap: true,
   minifyIdentifiers: false, // causes errors
   minifySyntax: isProd,
   minifyWhitespace: isProd,
-});
+
+  logLevel: isProd ? 'info' : 'silent',
+};
+
+if (buildBot) {
+  console.log('🟡 Building bot...');
+  build({
+    ...commonOptions,
+
+    entryPoints: ['src/bot.ts'],
+    outfile: 'dist/bot.cjs',
+  }).then(() => {
+    console.log('✅ Bot built');
+  });
+}
+
+if (buildServer) {
+  console.log('🟡 Building server...');
+  build({
+    ...commonOptions,
+
+    entryPoints: ['src/server.ts'],
+    outfile: 'dist/server.cjs',
+  }).then(() => {
+    console.log('✅ Server built');
+  });
+}

src/bot.ts

@@ -1,8 +1,8 @@
 import { Client, GatewayIntentBits } from 'discord.js';
-import { DISCORD_TOKEN } from './core/process/args.js';
+import { DISCORD_TOKEN } from './core/node/arguments.js';
 import { registerErrorHandlers } from './events/error.js';
 import guildMemberAdd from './events/guildMemberAdd.js';
-import interactionCreate from './events/interactionCreate.js';
+import interactionCreate from './events/interactionCreate/index.js';
 import ready from './events/ready.js';
 
 export const client = new Client({

src/commands/debug.ts

@@ -1,13 +1,12 @@
 import { SlashCommandBuilder } from 'discord.js';
 import packageJSON from '../../package.json' assert { type: 'json' };
+import { client } from '../bot.js';
 import { tankopedia } from '../core/blitz/tankopedia.js';
 import { tankAverages } from '../core/blitzstars/tankAverages.js';
-import cleanTable from '../core/interaction/cleanTable.js';
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
-import getClientId from '../core/process/getClientId.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
-import { client } from '../index.js';
+import embedInfo from '../core/discord/embedInfo.js';
+import markdownTable from '../core/discord/markdownTable.js';
+import getClientId from '../core/node/getClientId.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 
 const executionStart = new Date().getTime();
 
@@ -17,16 +16,16 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('debug'))
+    .setName('debug')
     .setDescription('Debug information about the bot'),
 
-  execute(interaction) {
+  handler(interaction) {
     const currentTime = new Date().getTime();
     const uptime = currentTime - executionStart;
 
-    return infoEmbed(
+    return embedInfo(
       `${client.user?.username} debug information`,
-      cleanTable([
+      markdownTable([
         ['Version', packageJSON.version],
         ['Client ID', getClientId()],
         ['Tag', interaction.client.user.tag],

src/commands/eligible.ts

@@ -1,20 +1,19 @@
 import { SlashCommandBuilder } from 'discord.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
-import getWN8 from '../core/blitz/getWN8.js';
+import calculateWN8 from '../core/blitz/calculateWN8.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
 import sumStats from '../core/blitz/sumStats.js';
 import { tankopedia } from '../core/blitz/tankopedia.js';
 import getPeriodNow from '../core/blitzstars/getPeriodNow.js';
-import getPeriodicStart from '../core/blitzstars/getPeriodStart.js';
-import getTankStatsOverTime from '../core/blitzstars/getTankStatsOverTime.js';
+import getPeriodStart from '../core/blitzstars/getPeriodStart.js';
+import getTankStatsDiffed from '../core/blitzstars/getTankStatsDiffed.js';
 import { tankAverages } from '../core/blitzstars/tankAverages.js';
-import cleanTable, { TableInput } from '../core/interaction/cleanTable.js';
-import cmdName from '../core/interaction/cmdName.js';
-import negativeEmbed from '../core/interaction/negativeEmbed.js';
-import positiveEmbed from '../core/interaction/positiveEmbed.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import embedNegative from '../core/discord/embedNegative.js';
+import embedPositive from '../core/discord/embedPositive.js';
+import markdownTable, { TableInput } from '../core/discord/markdownTable.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountInfo } from '../types/accountInfo.js';
 
 export type SkilledClan = 'SKLLD' | 'SMRI';
@@ -30,7 +29,7 @@ export default {
   inPublic: false,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('eligible'))
+    .setName('eligible')
     .setDescription('Checks eligibility for any Skilled clan')
     .addStringOption((option) =>
       option
@@ -45,11 +44,11 @@ export default {
         )
         .setRequired(true),
     )
-    .addStringOption(addUsernameOption),
+    .addStringOption(addUsernameChoices),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const clan = interaction.options.getString('clan') as SkilledClan;
-    const { id, server } = await getBlitzAccount(interaction);
+    const { id, server } = await resolvePlayerFromCommand(interaction);
     const accountInfo = await getWargamingResponse<AccountInfo>(
       `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
     );
@@ -59,11 +58,10 @@ export default {
     let body = '';
 
     if (clan === 'SKLLD') {
-      const tankStatsOverTime = await getTankStatsOverTime(
-        interaction,
+      const tankStatsOverTime = await getTankStatsDiffed(
         server,
         id,
-        getPeriodicStart('30'),
+        getPeriodStart('30'),
         getPeriodNow(),
       );
       const entries = Object.entries(tankStatsOverTime);
@@ -81,7 +79,7 @@ export default {
 
           // edge case where new tanks don't have averages
           if (tankAverages[tankId]) {
-            const tankWN8 = getWN8(tankAverages[tankId].all, stats);
+            const tankWN8 = calculateWN8(tankAverages[tankId].all, stats);
 
             if (isNaN(tankWN8)) return accumulator;
             return accumulator + tankWN8 * stats.battles;
@@ -124,7 +122,10 @@ export default {
         ]);
       }
       if (WN8 < 2450) {
-        problems.push(['WN8', `${WN8.toFixed(0)} (${WN8 - 2450})`]);
+        problems.push([
+          'WN8',
+          `${WN8.toFixed(0)} (${(WN8 - 2450).toFixed(0)})`,
+        ]);
       }
       if (tier10Damage < 1250) {
         problems.push([
@@ -136,7 +137,7 @@ export default {
       isEligible = problems.length === 0;
       body = isEligible
         ? 'Player is fully eligible.'
-        : `Player is not eligible. Shortcomings in 30-day statistics:\n\n${cleanTable(
+        : `Player is not eligible. Shortcomings in 30-day statistics:\n\n${markdownTable(
             problems,
           )}`;
     } else if (clan === 'SMRI') {
@@ -161,11 +162,11 @@ export default {
       isEligible = problems.length === 0;
       body = isEligible
         ? 'Player is fully eligible.'
-        : `Player is not eligible. Shortcomings in career statistics:\n\n${cleanTable(
+        : `Player is not eligible. Shortcomings in career statistics:\n\n${markdownTable(
             problems,
           )}`;
     }
 
-    return (isEligible ? positiveEmbed : negativeEmbed)(title, body);
+    return (isEligible ? embedPositive : embedNegative)(title, body);
   },
 } satisfies CommandRegistry;

src/commands/evolution.tsx

@@ -0,0 +1,86 @@
+import { SlashCommandBuilder } from 'discord.js';
+import { CYCLIC_API } from '../constants/cyclic.js';
+import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
+import resolveTankId from '../core/blitz/resolveTankId.js';
+import addStatTypeSubCommandGroups from '../core/discord/addStatTypeSubCommandGroups.js';
+import autocompleteTanks from '../core/discord/autocompleteTanks.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import interactionToURL from '../core/discord/interactionToURL.js';
+import linkButton from '../core/discord/linkButton.js';
+import primaryButton from '../core/discord/primaryButton.js';
+import resolvePeriodFromButton from '../core/discord/resolvePeriodFromButton.js';
+import resolvePeriodFromCommand from '../core/discord/resolvePeriodFromCommand.js';
+import resolvePlayerFromButton from '../core/discord/resolvePlayerFromButton.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
+import evolution from '../renderers/evolution.js';
+import { StatType } from '../renderers/statsfull.js';
+import { AccountInfo } from '../types/accountInfo.js';
+
+export default {
+  inProduction: true,
+  inDevelopment: true,
+  inPublic: true,
+
+  command: addStatTypeSubCommandGroups(
+    new SlashCommandBuilder()
+      .setName('evolution')
+      .setDescription('Evolution of statistics'),
+  ),
+
+  async handler(interaction) {
+    const commandGroup = interaction.options.getSubcommandGroup(
+      true,
+    ) as StatType;
+    const player = await resolvePlayerFromCommand(interaction);
+    const period = resolvePeriodFromCommand(interaction);
+    const tankIdRaw = interaction.options.getString('tank')!;
+    const tankId = commandGroup === 'tank' ? resolveTankId(tankIdRaw) : null;
+    const start = interaction.options.getInteger('start');
+    const end = interaction.options.getInteger('end');
+    const { nickname } = (
+      await getWargamingResponse<AccountInfo>(
+        `https://api.wotblitz.${player.server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${player.id}`,
+      )
+    )[player.id];
+    const path = interactionToURL(interaction, {
+      ...player,
+      tankId,
+      start,
+      end,
+    });
+
+    return [
+      await evolution(commandGroup, period, player, tankId),
+      primaryButton(path, 'Refresh'),
+      // linkButton(`${CYCLIC_API}/${path}`, 'Embed'),
+      linkButton(
+        `https://www.blitzstars.com/player/${player.server}/${nickname}${
+          commandGroup === 'tank' ? `/tank/${tankId!}` : ''
+        }`,
+        'BlitzStars',
+      ),
+    ];
+  },
+
+  autocomplete: (interaction) => {
+    autocompleteUsername(interaction);
+    autocompleteTanks(interaction);
+  },
+
+  async button(interaction) {
+    const url = new URL(`${CYCLIC_API}/${interaction.customId}`);
+    const path = url.pathname.split('/').filter(Boolean);
+    const commandGroup = path[1] as StatType;
+    const period = resolvePeriodFromButton(interaction);
+    const player = await resolvePlayerFromButton(interaction);
+
+    return await evolution(
+      commandGroup,
+      period,
+      player,
+      parseInt(url.searchParams.get('tankId')!),
+    );
+  },
+} satisfies CommandRegistry;

src/commands/help.ts

@@ -1,13 +1,12 @@
 import { SlashCommandBuilder } from 'discord.js';
 import discord from '../../discord.json' assert { type: 'json' };
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
+import { client } from '../bot.js';
+import embedInfo from '../core/discord/embedInfo.js';
 import {
   CommandRegistry,
   guildCommands,
   publicCommands,
-} from '../events/interactionCreate.js';
-import { client } from '../index.js';
+} from '../events/interactionCreate/index.js';
 
 export default {
   inProduction: true,
@@ -15,11 +14,11 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('help'))
+    .setName('help')
     .setDescription('All the help you need about the bot'),
 
-  execute(interaction) {
-    return infoEmbed(
+  handler(interaction) {
+    return embedInfo(
       `${client.user?.username} help`,
       `**About**\n${
         client.user?.username

src/commands/inactive.tsx

@@ -1,17 +1,16 @@
 import { SlashCommandBuilder } from 'discord.js';
 import GenericStats from '../components/GenericStats/index.js';
 import NoData, { NoDataType } from '../components/NoData.js';
-import PoweredByWargaming from '../components/PoweredByWargaming.js';
+import PoweredBy, { PoweredByType } from '../components/PoweredBy.js';
 import TitleBar from '../components/TitleBar.js';
 import Wrapper from '../components/Wrapper.js';
 import { BLITZ_SERVERS } from '../constants/servers.js';
-import clanAutocomplete from '../core/autocomplete/clan.js';
 import getBlitzClan from '../core/blitz/getBlitzClan.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import cmdName from '../core/interaction/cmdName.js';
-import addClanChoices from '../core/options/addClanChoices.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addClanChoices from '../core/discord/addClanChoices.js';
+import autocompleteClan from '../core/discord/autocompleteClan.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountInfo } from '../types/accountInfo.js';
 import { ClanInfo } from '../types/clanInfo.js';
 
@@ -23,7 +22,7 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('inactive'))
+    .setName('inactive')
     .setDescription('Lists all inactive players')
     .addStringOption(addClanChoices)
     .addNumberOption((option) =>
@@ -35,9 +34,9 @@ export default {
         .setMinValue(0),
     ),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const clanName = interaction.options.getString('clan')!;
-    const { server, id } = await getBlitzClan(interaction, clanName);
+    const { server, id } = await getBlitzClan(clanName);
     const threshold =
       interaction.options.getNumber('threshold')! ?? DEFAULT_THRESHOLD;
     const time = new Date().getTime() / 1000;
@@ -80,10 +79,10 @@ export default {
         {!hasInactiveMembers && <NoData type={NoDataType.PlayersInPeriod} />}
         {hasInactiveMembers && <GenericStats stats={inactive} />}
 
-        <PoweredByWargaming />
+        <PoweredBy type={PoweredByType.Wargaming} />
       </Wrapper>
     );
   },
 
-  autocomplete: clanAutocomplete,
+  autocomplete: autocompleteClan,
 } satisfies CommandRegistry;

src/commands/ownedtanks.tsx

@@ -1,19 +1,22 @@
 import { SlashCommandBuilder } from 'discord.js';
 import NoData, { NoDataType } from '../components/NoData.js';
-import PoweredByWargaming from '../components/PoweredByWargaming.js';
+import PoweredBy, { PoweredByType } from '../components/PoweredBy.js';
 import * as Tanks from '../components/Tanks/index.js';
 import TitleBar from '../components/TitleBar.js';
 import Wrapper from '../components/Wrapper.js';
 import { BLITZ_SERVERS } from '../constants/servers.js';
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
 import getTankStats from '../core/blitz/getTankStats.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import { TIER_ROMAN_NUMERALS, tankopedia } from '../core/blitz/tankopedia.js';
-import cmdName from '../core/interaction/cmdName.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import {
+  TIER_ROMAN_NUMERALS,
+  Tier,
+  tankopedia,
+} from '../core/blitz/tankopedia.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountInfo } from '../types/accountInfo.js';
 import { PlayerClanData } from '../types/playerClanData.js';
 
@@ -44,7 +47,7 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('ownedtanks'))
+    .setName('ownedtanks')
     .setDescription("Shows a player's owned tanks")
     .addStringOption((option) =>
       option
@@ -64,16 +67,16 @@ export default {
         )
         .setRequired(true),
     )
-    .addStringOption(addUsernameOption),
+    .addStringOption(addUsernameChoices),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const tier = Number(interaction.options.getString('tier'));
-    const account = await getBlitzAccount(interaction);
+    const account = await resolvePlayerFromCommand(interaction);
     const { id, server } = account;
     const accountInfo = await getWargamingResponse<AccountInfo>(
       `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
     );
-    const tankStats = await getTankStats(interaction, server, id);
+    const tankStats = await getTankStats(server, id);
     const tanks = tankStats
       .map((tankData) => tankopedia[tankData.tank_id])
       .filter((tank) => tank?.tier === tier);
@@ -86,7 +89,7 @@ export default {
         {/* TODO: integrate some of these into title bar */}
         <TitleBar
           name={accountInfo[id].nickname}
-          nameDiscriminator={`(Tier ${TIER_ROMAN_NUMERALS[tier]})`}
+          nameDiscriminator={`(Tier ${TIER_ROMAN_NUMERALS[tier as Tier]})`}
           image={
             clanData[id]?.clan
               ? `https://wotblitz-gc.gcdn.co/icons/clanEmblems1x/clan-icon-v2-${clanData[id]?.clan?.emblem_set_id}.png`
@@ -112,10 +115,10 @@ export default {
           </Tanks.Root>
         )}
 
-        <PoweredByWargaming />
+        <PoweredBy type={PoweredByType.Wargaming} />
       </Wrapper>
     );
   },
 
-  autocomplete: usernameAutocomplete,
+  autocomplete: autocompleteUsername,
 } satisfies CommandRegistry;

src/commands/ping.ts

@@ -0,0 +1,33 @@
+import { SlashCommandBuilder } from 'discord.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
+
+export default {
+  inProduction: true,
+  inDevelopment: false,
+  inPublic: true,
+  handlesInteraction: true,
+
+  command: new SlashCommandBuilder()
+    .setName('ping')
+    .setDescription('Check if the bot is alive')
+    .addSubcommand((option) =>
+      option.setName('blitzkrieg').setDescription('Ping Blitzkrieg'),
+    )
+    .addSubcommand((option) =>
+      option.setName('blitz').setDescription('Ping Blitz'),
+    ),
+
+  async handler(interaction) {
+    const subcommand = interaction.options.getSubcommand();
+    const executionStart = Date.now();
+
+    if (subcommand === 'blitzkrieg') {
+      await interaction.editReply('Pong 🏓');
+    } else {
+      await fetch('https://api.wotblitz.com/');
+    }
+
+    const executionTime = Date.now() - executionStart;
+    interaction.editReply(`Pong 🏓 - ${executionTime}ms`);
+  },
+} satisfies CommandRegistry<true>;

src/commands/playerachievements.ts

@@ -1,15 +1,16 @@
 import { SlashCommandBuilder } from 'discord.js';
-import startCase from 'lodash.startcase';
+import { startCase } from 'lodash';
 import markdownEscape from 'markdown-escape';
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import cleanTable, { TableInputEntry } from '../core/interaction/cleanTable.js';
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import embedInfo from '../core/discord/embedInfo.js';
+import markdownTable, {
+  TableInputEntry,
+} from '../core/discord/markdownTable.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountAchievements } from '../types/accountAchievements.js';
 import { AccountInfo } from '../types/accountInfo.js';
 
@@ -21,9 +22,9 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('playerachievements'))
+    .setName('playerachievements')
     .setDescription("All the player's achievements")
-    .addStringOption(addUsernameOption)
+    .addStringOption(addUsernameChoices)
     .addStringOption((option) =>
       option
         .setName('sort')
@@ -34,9 +35,9 @@ export default {
         ),
     ),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const sortBy = (interaction.options.getString('sort') ?? 'name') as SortBy;
-    const account = await getBlitzAccount(interaction);
+    const account = await resolvePlayerFromCommand(interaction);
     const { id, server } = account;
     const accounts = await getWargamingResponse<AccountInfo>(
       `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
@@ -51,10 +52,10 @@ export default {
       ...accountAchievements.max_series,
     };
 
-    return infoEmbed(
+    return embedInfo(
       `${markdownEscape(accounts[id].nickname)}'s information`,
 
-      cleanTable(
+      markdownTable(
         Object.keys(compound)
           .filter((achievement) => compound[achievement] > 0)
           .sort(
@@ -73,5 +74,5 @@ export default {
     );
   },
 
-  autocomplete: usernameAutocomplete,
+  autocomplete: autocompleteUsername,
 } satisfies CommandRegistry;

src/commands/playerinfo.ts

@@ -1,14 +1,13 @@
 import { SlashCommandBuilder } from 'discord.js';
 import markdownEscape from 'markdown-escape';
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import cleanTable from '../core/interaction/cleanTable.js';
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import embedInfo from '../core/discord/embedInfo.js';
+import markdownTable from '../core/discord/markdownTable.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountInfo } from '../types/accountInfo.js';
 
 export default {
@@ -17,22 +16,22 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('playerinfo'))
+    .setName('playerinfo')
     .setDescription('Basic information about a player')
-    .addStringOption(addUsernameOption),
+    .addStringOption(addUsernameChoices),
 
-  async execute(interaction) {
-    const account = await getBlitzAccount(interaction);
+  async handler(interaction) {
+    const account = await resolvePlayerFromCommand(interaction);
     const { id, server } = account;
     const accounts = await getWargamingResponse<AccountInfo>(
       `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
     );
     const accountInfo = accounts[id];
 
-    return infoEmbed(
+    return embedInfo(
       `${markdownEscape(accountInfo.nickname)}'s information`,
 
-      cleanTable([
+      markdownTable([
         ['Nickname', `${accountInfo.nickname}`],
         ['Battles', `${accountInfo.statistics.all.battles}`],
         [
@@ -57,5 +56,5 @@ export default {
     );
   },
 
-  autocomplete: usernameAutocomplete,
+  autocomplete: autocompleteUsername,
 } satisfies CommandRegistry;

src/commands/searchclans.ts

@@ -2,12 +2,11 @@ import { SlashCommandBuilder } from 'discord.js';
 import markdownEscape from 'markdown-escape';
 import { BLITZ_SERVERS, BlitzServer } from '../constants/servers.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
-import addClanChoices from '../core/options/addClanChoices.js';
-import addServerChoices from '../core/options/addServerChoices.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addClanChoices from '../core/discord/addClanChoices.js';
+import addServerChoices from '../core/discord/addServerChoices.js';
+import embedInfo from '../core/discord/embedInfo.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { ClanList } from '../types/clanList.js';
 
 export default {
@@ -16,7 +15,7 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('searchclans'))
+    .setName('searchclans')
     .setDescription('Search clans')
     .addStringOption(addServerChoices)
     .addStringOption((option) => addClanChoices(option).setAutocomplete(false))
@@ -28,7 +27,7 @@ export default {
         .setMaxValue(100),
     ),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const server = interaction.options.getString('server') as BlitzServer;
     const clan = interaction.options.getString('clan')!;
     const limit = interaction.options.getInteger('limit') ?? 25;
@@ -36,7 +35,7 @@ export default {
       `https://api.wotblitz.${server}/wotb/clans/list/?application_id=${WARGAMING_APPLICATION_ID}&search=${clan}&limit=${limit}`,
     );
 
-    return infoEmbed(
+    return embedInfo(
       `Clan search for "${markdownEscape(clan)}" in ${BLITZ_SERVERS[server]}`,
       clanList.length === 0
         ? 'No clans found.'

src/commands/searchplayers.ts

@@ -2,13 +2,12 @@ import { SlashCommandBuilder } from 'discord.js';
 import markdownEscape from 'markdown-escape';
 import { BLITZ_SERVERS, BlitzServer } from '../constants/servers.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import { usernamePattern } from '../core/blitz/listAccountsPanServer.js';
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
-import addServerChoices from '../core/options/addServerChoices.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import { usernamePattern } from '../core/blitz/listPlayers.js';
+import addServerChoices from '../core/discord/addServerChoices.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import embedInfo from '../core/discord/embedInfo.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountList } from '../types/accountList.js';
 
 export default {
@@ -17,11 +16,11 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('searchplayers'))
+    .setName('searchplayers')
     .setDescription('Search players in a Blitz server')
     .addStringOption(addServerChoices)
     .addStringOption((option) =>
-      addUsernameOption(option).setAutocomplete(false).setRequired(true),
+      addUsernameChoices(option).setAutocomplete(false).setRequired(true),
     )
     .addIntegerOption((option) =>
       option
@@ -31,7 +30,7 @@ export default {
         .setMaxValue(100),
     ),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const server = interaction.options.getString('server') as BlitzServer;
     const name = interaction.options.getString('username')!;
     const limit = interaction.options.getInteger('limit') ?? 25;
@@ -44,7 +43,7 @@ export default {
         )
       : [];
 
-    return infoEmbed(
+    return embedInfo(
       `Player search for "${markdownEscape(name)}" in ${BLITZ_SERVERS[server]}`,
       `\`\`\`${
         players.length === 0

src/commands/searchtanks.ts

@@ -2,10 +2,9 @@ import { SlashCommandBuilder } from 'discord.js';
 import { go } from 'fuzzysort';
 import markdownEscape from 'markdown-escape';
 import { TANK_NAMES } from '../core/blitz/tankopedia.js';
-import cmdName from '../core/interaction/cmdName.js';
-import infoEmbed from '../core/interaction/infoEmbed.js';
-import addTankChoices from '../core/options/addTankChoices.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addTankChoices from '../core/discord/addTankChoices.js';
+import embedInfo from '../core/discord/embedInfo.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 
 export default {
   inProduction: true,
@@ -13,7 +12,7 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('searchtanks'))
+    .setName('searchtanks')
     .setDescription('Search tanks')
     .addStringOption((option) => addTankChoices(option).setAutocomplete(false))
     .addIntegerOption((option) =>
@@ -24,14 +23,14 @@ export default {
         .setMaxValue(100),
     ),
 
-  async execute(interaction) {
+  async handler(interaction) {
     const tank = interaction.options.getString('tank')!;
     const limit = interaction.options.getInteger('limit') ?? 25;
     const results = go(tank, TANK_NAMES, { limit }).map(
       (result) => result.target,
     );
 
-    return infoEmbed(
+    return embedInfo(
       `Tank search for "${markdownEscape(tank)}"`,
       results.length === 0
         ? 'No tanks found.'

src/commands/stats.tsx

@@ -1,165 +1,84 @@
 import { SlashCommandBuilder } from 'discord.js';
-import GenericAllStats from '../components/GenericAllStats.js';
-import NoData, { NoDataType } from '../components/NoData.js';
-import PoweredByBlitzStars from '../components/PoweredByBlitzStars.js';
-import TitleBar from '../components/TitleBar.js';
-import Wrapper from '../components/Wrapper.js';
-import { BLITZ_SERVERS } from '../constants/servers.js';
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
-import getTankStats from '../core/blitz/getTankStats.js';
-import getWN8 from '../core/blitz/getWN8.js';
+import { CYCLIC_API } from '../constants/cyclic.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import sumStats from '../core/blitz/sumStats.js';
-import { tankopedia } from '../core/blitz/tankopedia.js';
-import getPeriodNow from '../core/blitzstars/getPeriodNow.js';
-import getPeriodicStart from '../core/blitzstars/getPeriodStart.js';
-import getTankStatsOverTime from '../core/blitzstars/getTankStatsOverTime.js';
-import { tankAverages } from '../core/blitzstars/tankAverages.js';
-import cmdName from '../core/interaction/cmdName.js';
-import fullBlitzStarsStats from '../core/interaction/fullBlitzStarsStats.js';
-import { supportBlitzStars } from '../core/interaction/supportBlitzStars.js';
-import addStatPeriodChoices, {
-  StatPeriod,
-  statPeriodNames,
-} from '../core/options/addStatPeriodChoices.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
-import {
-  AccountInfo,
-  AllStats,
-  SupplementaryStats,
-} from '../types/accountInfo.js';
-import { PlayerClanData } from '../types/playerClanData.js';
+import resolveTankId from '../core/blitz/resolveTankId.js';
+import addStatTypeSubCommandGroups from '../core/discord/addStatTypeSubCommandGroups.js';
+import autocompleteTanks from '../core/discord/autocompleteTanks.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import interactionToURL from '../core/discord/interactionToURL.js';
+import linkButton from '../core/discord/linkButton.js';
+import primaryButton from '../core/discord/primaryButton.js';
+import resolvePeriodFromButton from '../core/discord/resolvePeriodFromButton.js';
+import resolvePeriodFromCommand from '../core/discord/resolvePeriodFromCommand.js';
+import resolvePlayerFromButton from '../core/discord/resolvePlayerFromButton.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
+import stats from '../renderers/stats.js';
+import { StatType } from '../renderers/statsfull.js';
+import { AccountInfo } from '../types/accountInfo.js';
 
 export default {
   inProduction: true,
-  inDevelopment: false,
+  inDevelopment: true,
   inPublic: true,
 
-  command: new SlashCommandBuilder()
-    .setName(cmdName('stats'))
-    .setDescription("Gets the user's in-game statistics")
-    .addStringOption(addStatPeriodChoices)
-    .addStringOption(addUsernameOption),
+  command: addStatTypeSubCommandGroups(
+    new SlashCommandBuilder()
+      .setName('stats')
+      .setDescription('In-game statistics'),
+  ),
 
-  async execute(interaction) {
-    const period = interaction.options.getString('period') as StatPeriod;
-    const { id, server } = await getBlitzAccount(interaction);
-    const accountInfo = await getWargamingResponse<AccountInfo>(
-      `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
-    );
-    const clanData = await getWargamingResponse<PlayerClanData>(
-      `https://api.wotblitz.${server}/wotb/clans/accountinfo/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}&extra=clan`,
-    );
-    const tankStats = await getTankStats(interaction, server, id);
-    let stats: AllStats;
-    let supplementaryStats: SupplementaryStats | undefined;
-    let hasWN8AccumulatedAtAll = false;
-
-    if (period === 'career') {
-      stats = accountInfo[id].statistics.all;
-      const totalBattles = tankStats.reduce(
-        (accumulator, { all }) => accumulator + all.battles,
-        0,
-      );
-
-      supplementaryStats = {
-        tier:
-          tankStats.reduce(
-            (accumulator, { tank_id, all }) =>
-              accumulator + tankopedia[tank_id].tier * all.battles,
-            0,
-          ) / totalBattles,
-        WN8:
-          tankStats.reduce((accumulator, { tank_id, all }) => {
-            if (tankAverages[tank_id]) {
-              const tankWN8 = getWN8(tankAverages[tank_id].all, all);
-
-              if (isNaN(tankWN8)) return accumulator;
-
-              hasWN8AccumulatedAtAll = true;
-
-              return accumulator + tankWN8 * all.battles;
-            } else return accumulator;
-          }, 0) / totalBattles,
-      };
-    } else {
-      const tankStatsOverTime = await getTankStatsOverTime(
-        interaction,
-        server,
-        id,
-        getPeriodicStart(period),
-        getPeriodNow(),
-      );
-      const entries = Object.entries(tankStatsOverTime);
-      const totalBattles = entries.reduce(
-        (accumulator, [, stats]) => accumulator + stats.battles,
-        0,
-      );
-
-      supplementaryStats = {
-        tier:
-          entries.reduce((accumulator, [tankIdString, stats]) => {
-            const tankId = parseInt(tankIdString);
-            const tankTier = tankopedia[tankId].tier;
-
-            return accumulator + tankTier * stats.battles;
-          }, 0) / totalBattles,
-        WN8:
-          entries.reduce((accumulator, [tankIdString, stats]) => {
-            const tankId = parseInt(tankIdString);
-
-            // edge case where new tanks don't have averages
-            if (tankAverages[tankId]) {
-              const tankWN8 = getWN8(tankAverages[tankId].all, stats);
-
-              if (isNaN(tankWN8)) return accumulator;
-
-              hasWN8AccumulatedAtAll = true;
-
-              return accumulator + tankWN8 * stats.battles;
-            } else return accumulator;
-          }, 0) / totalBattles,
-      };
-
-      stats = sumStats(entries.map(([, stats]) => stats));
-    }
-
-    if (!hasWN8AccumulatedAtAll) supplementaryStats.WN8 = undefined;
+  async handler(interaction) {
+    const commandGroup = interaction.options.getSubcommandGroup(
+      true,
+    ) as StatType;
+    const player = await resolvePlayerFromCommand(interaction);
+    const period = resolvePeriodFromCommand(interaction);
+    const tankIdRaw = interaction.options.getString('tank')!;
+    const tankId = commandGroup === 'tank' ? resolveTankId(tankIdRaw) : null;
+    const start = interaction.options.getInteger('start');
+    const end = interaction.options.getInteger('end');
+    const path = interactionToURL(interaction, {
+      ...player,
+      tankId,
+      start,
+      end,
+    });
+    const { nickname } = (
+      await getWargamingResponse<AccountInfo>(
+        `https://api.wotblitz.${player.server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${player.id}`,
+      )
+    )[player.id];
 
     return [
-      <Wrapper>
-        <TitleBar
-          name={accountInfo[id].nickname}
-          nameDiscriminator={
-            clanData[id]?.clan ? `[${clanData[id]?.clan?.tag}]` : undefined
-          }
-          image={
-            clanData[id]?.clan
-              ? `https://wotblitz-gc.gcdn.co/icons/clanEmblems1x/clan-icon-v2-${clanData[id]?.clan?.emblem_set_id}.png`
-              : undefined
-          }
-          description={`${
-            statPeriodNames[period]
-          } • ${new Date().toDateString()} • ${BLITZ_SERVERS[server]}`}
-        />
-
-        {stats.battles === 0 && <NoData type={NoDataType.BattlesInPeriod} />}
-        {stats.battles > 0 && (
-          <GenericAllStats
-            stats={stats}
-            supplementaryStats={supplementaryStats}
-          />
-        )}
-
-        <PoweredByBlitzStars />
-      </Wrapper>,
-      fullBlitzStarsStats(server, accountInfo[id].nickname),
-      supportBlitzStars,
+      await stats(commandGroup, period, player, tankId),
+      primaryButton(path, 'Refresh'),
+      linkButton(`${CYCLIC_API}/${path}`, 'Embed'),
+      linkButton(
+        `https://www.blitzstars.com/player/${player.server}/${nickname}`,
+        'BlitzStars',
+      ),
     ];
   },
 
-  autocomplete: usernameAutocomplete,
+  autocomplete: (interaction) => {
+    autocompleteUsername(interaction);
+    autocompleteTanks(interaction);
+  },
+
+  async button(interaction) {
+    const url = new URL(`${CYCLIC_API}/${interaction.customId}`);
+    const path = url.pathname.split('/').filter(Boolean);
+    const commandGroup = path[1] as StatType;
+    const period = resolvePeriodFromButton(interaction);
+    const player = await resolvePlayerFromButton(interaction);
+
+    return await stats(
+      commandGroup,
+      period,
+      player,
+      parseInt(url.searchParams.get('tankId')!),
+    );
+  },
 } satisfies CommandRegistry;

src/commands/statsfull.tsx

@@ -0,0 +1,83 @@
+import { SlashCommandBuilder } from 'discord.js';
+import { CYCLIC_API } from '../constants/cyclic.js';
+import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
+import resolveTankId from '../core/blitz/resolveTankId.js';
+import addStatTypeSubCommandGroups from '../core/discord/addStatTypeSubCommandGroups.js';
+import autocompleteTanks from '../core/discord/autocompleteTanks.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import interactionToURL from '../core/discord/interactionToURL.js';
+import linkButton from '../core/discord/linkButton.js';
+import primaryButton from '../core/discord/primaryButton.js';
+import resolvePeriodFromButton from '../core/discord/resolvePeriodFromButton.js';
+import resolvePeriodFromCommand from '../core/discord/resolvePeriodFromCommand.js';
+import resolvePlayerFromButton from '../core/discord/resolvePlayerFromButton.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
+import statsfull, { StatType } from '../renderers/statsfull.js';
+import { AccountInfo } from '../types/accountInfo.js';
+
+export default {
+  inProduction: true,
+  inDevelopment: false,
+  inPublic: true,
+
+  command: addStatTypeSubCommandGroups(
+    new SlashCommandBuilder()
+      .setName('statsfull')
+      .setDescription('Full in-game statistics'),
+  ),
+
+  async handler(interaction) {
+    const commandGroup = interaction.options.getSubcommandGroup(
+      true,
+    ) as StatType;
+    const player = await resolvePlayerFromCommand(interaction);
+    const period = resolvePeriodFromCommand(interaction);
+    const tankIdRaw = interaction.options.getString('tank')!;
+    const tankId = commandGroup === 'tank' ? resolveTankId(tankIdRaw) : null;
+    const start = interaction.options.getInteger('start');
+    const end = interaction.options.getInteger('end');
+    const path = interactionToURL(interaction, {
+      ...player,
+      tankId,
+      start,
+      end,
+    });
+    const { nickname } = (
+      await getWargamingResponse<AccountInfo>(
+        `https://api.wotblitz.${player.server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${player.id}`,
+      )
+    )[player.id];
+
+    return [
+      await statsfull(commandGroup, period, player, tankId),
+      primaryButton(path, 'Refresh'),
+      // linkButton(`${CYCLIC_API}/${path}`, 'Embed'),
+      linkButton(
+        `https://www.blitzstars.com/player/${player.server}/${nickname}`,
+        'BlitzStars',
+      ),
+    ];
+  },
+
+  autocomplete: (interaction) => {
+    autocompleteUsername(interaction);
+    autocompleteTanks(interaction);
+  },
+
+  async button(interaction) {
+    const url = new URL(`${CYCLIC_API}/${interaction.customId}`);
+    const path = url.pathname.split('/').filter(Boolean);
+    const commandGroup = path[1] as StatType;
+    const period = resolvePeriodFromButton(interaction);
+    const player = await resolvePlayerFromButton(interaction);
+
+    return await statsfull(
+      commandGroup,
+      period,
+      player,
+      parseInt(url.searchParams.get('tankId')!),
+    );
+  },
+} satisfies CommandRegistry;

src/commands/tankstats.tsx

@@ -1,112 +0,0 @@
-import { SlashCommandBuilder } from 'discord.js';
-import GenericAllStats from '../components/GenericAllStats.js';
-import NoData, { NoDataType } from '../components/NoData.js';
-import PoweredByBlitzStars from '../components/PoweredByBlitzStars.js';
-import TitleBar from '../components/TitleBar.js';
-import Wrapper from '../components/Wrapper.js';
-import { BLITZ_SERVERS } from '../constants/servers.js';
-import tanksAutocomplete from '../core/autocomplete/tanks.js';
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
-import getTankStats from '../core/blitz/getTankStats.js';
-import getWN8 from '../core/blitz/getWN8.js';
-import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import resolveTankId from '../core/blitz/resolveTankId.js';
-import resolveTankName from '../core/blitz/resolveTankName.js';
-import { tankopedia } from '../core/blitz/tankopedia.js';
-import getPeriodNow from '../core/blitzstars/getPeriodNow.js';
-import getPeriodicStart from '../core/blitzstars/getPeriodStart.js';
-import getTankStatsOverTime, {
-  emptyAllStats,
-} from '../core/blitzstars/getTankStatsOverTime.js';
-import { tankAverages } from '../core/blitzstars/tankAverages.js';
-import cmdName from '../core/interaction/cmdName.js';
-import fullBlitzStarsStats from '../core/interaction/fullBlitzStarsStats.js';
-import { supportBlitzStars } from '../core/interaction/supportBlitzStars.js';
-import addStatPeriodChoices, {
-  StatPeriod,
-  statPeriodNames,
-} from '../core/options/addStatPeriodChoices.js';
-import addTankChoices from '../core/options/addTankChoices.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
-import { AccountInfo, AllStats } from '../types/accountInfo.js';
-
-export default {
-  inProduction: true,
-  inDevelopment: false,
-  inPublic: true,
-
-  command: new SlashCommandBuilder()
-    .setName(cmdName('tankstats'))
-    .setDescription('Stats for a tank over a period')
-    .addStringOption(addTankChoices)
-    .addStringOption(addStatPeriodChoices)
-    .addStringOption(addUsernameOption),
-
-  async execute(interaction) {
-    const tank = await resolveTankId(
-      interaction,
-      interaction.options.getString('tank')!,
-    );
-    const period = interaction.options.getString('period') as StatPeriod;
-    const blitzAccount = await getBlitzAccount(interaction);
-    const { id, server } = blitzAccount;
-    const accountInfo = await getWargamingResponse<AccountInfo>(
-      `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
-    );
-    const tankStats = await getTankStats(interaction, server, id);
-    let stats: AllStats;
-    const tankId = Number(tank);
-
-    if (period === 'career') {
-      stats =
-        tankStats.find((stats) => stats.tank_id === tankId)?.all ??
-        emptyAllStats;
-    } else {
-      const tankStatsOverTime = await getTankStatsOverTime(
-        interaction,
-        server,
-        id,
-        getPeriodicStart(period),
-        getPeriodNow(),
-      );
-
-      stats = tankStatsOverTime[tankId] ?? emptyAllStats;
-    }
-
-    return [
-      <Wrapper>
-        <TitleBar
-          name={accountInfo[id].nickname}
-          nameDiscriminator={`(${resolveTankName(tankId)})`}
-          image={tankopedia[tankId].images.normal}
-          description={`${
-            statPeriodNames[period]
-          } • ${new Date().toDateString()} • ${BLITZ_SERVERS[server]}`}
-        />
-
-        {stats.battles === 0 && <NoData type={NoDataType.BattlesInPeriod} />}
-        {stats.battles > 0 && (
-          <GenericAllStats
-            stats={stats}
-            supplementaryStats={{
-              tier: tankopedia[tankId].tier,
-              WN8: getWN8(tankAverages[tankId].all, stats),
-            }}
-          />
-        )}
-
-        <PoweredByBlitzStars />
-      </Wrapper>,
-      fullBlitzStarsStats(server, accountInfo[id].nickname),
-      supportBlitzStars,
-    ];
-  },
-
-  autocomplete: (interaction) => {
-    tanksAutocomplete(interaction);
-    usernameAutocomplete(interaction);
-  },
-} satisfies CommandRegistry;

src/commands/today.tsx

@@ -1,29 +1,16 @@
 import { SlashCommandBuilder } from 'discord.js';
-import * as Breakdown from '../components/Breakdown/index.js';
-import NoData, { NoDataType } from '../components/NoData.js';
-import PoweredByBlitzStars from '../components/PoweredByBlitzStars.js';
-import TitleBar from '../components/TitleBar.js';
-import Wrapper from '../components/Wrapper.js';
-import { BLITZ_SERVERS } from '../constants/servers.js';
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
-import getTankStats from '../core/blitz/getTankStats.js';
-import getWN8 from '../core/blitz/getWN8.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import resolveTankName from '../core/blitz/resolveTankName.js';
-import sumStats from '../core/blitz/sumStats.js';
-import { tankopedia } from '../core/blitz/tankopedia.js';
-import getTankStatsOverTime from '../core/blitzstars/getTankStatsOverTime.js';
-import last5AM from '../core/blitzstars/last5AM.js';
-import { tankAverages } from '../core/blitzstars/tankAverages.js';
-import cmdName from '../core/interaction/cmdName.js';
-import fullBlitzStarsStats from '../core/interaction/fullBlitzStarsStats.js';
-import { supportBlitzStars } from '../core/interaction/supportBlitzStars.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
-import { AccountInfo, AllStats } from '../types/accountInfo.js';
-import { PlayerClanData } from '../types/playerClanData.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import interactionToURL from '../core/discord/interactionToURL.js';
+import linkButton from '../core/discord/linkButton.js';
+import primaryButton from '../core/discord/primaryButton.js';
+import resolvePlayerFromButton from '../core/discord/resolvePlayerFromButton.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
+import today from '../renderers/today.js';
+import { AccountInfo } from '../types/accountInfo.js';
 
 export default {
   inProduction: true,
@@ -31,155 +18,35 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('today'))
+    .setName('today')
     .setDescription('A general daily breakdown of your performance')
-    .addStringOption(addUsernameOption),
+    .addStringOption(addUsernameChoices),
 
-  async execute(interaction) {
-    const { id, server } = await getBlitzAccount(interaction);
-    const tankStatsOverTime = await getTankStatsOverTime(
-      interaction,
-      server,
-      id,
-      last5AM().getTime() / 1000,
-      new Date().getTime() / 1000,
-    );
-    const accountInfo = await getWargamingResponse<AccountInfo>(
-      `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
-    );
-    const clanData = await getWargamingResponse<PlayerClanData>(
-      `https://api.wotblitz.${server}/wotb/clans/accountinfo/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}&extra=clan`,
-    );
-    const careerTankStatsRaw = await getTankStats(interaction, server, id);
-    const careerStats: Record<number, AllStats> = {
-      0: accountInfo[id].statistics.all,
-    };
-    const allStatsToAccumulate: AllStats[] = [];
-
-    Object.entries(tankStatsOverTime).forEach(([, tankStats]) => {
-      allStatsToAccumulate.push(tankStats);
-    });
-    Object.entries(careerTankStatsRaw).forEach(([, tankStats]) => {
-      careerStats[tankStats.tank_id] = tankStats.all;
-    });
-
-    const accumulatedStats = sumStats(allStatsToAccumulate);
-
-    if (Object.keys(tankStatsOverTime).length > 0) {
-      tankStatsOverTime[0] = accumulatedStats;
-    }
-
-    const tankStatsOverTimeEntries = Object.entries(tankStatsOverTime);
-    const todayWN8s = tankStatsOverTimeEntries.reduce<Record<number, number>>(
-      (accumulator, [tankIdString, tankStats]) => {
-        const tankId = Number(tankIdString);
-
-        return tankId === 0 || tankAverages[tankId] === undefined
-          ? accumulator
-          : {
-              ...accumulator,
-              [tankId]: getWN8(tankAverages[tankId].all, tankStats),
-            };
-      },
-      {},
-    );
-    const careerWN8s = careerTankStatsRaw.reduce<Record<number, number>>(
-      (accumulator, { tank_id }) => {
-        return tank_id === 0 || tankAverages[tank_id] === undefined
-          ? accumulator
-          : {
-              ...accumulator,
-              [tank_id]: getWN8(
-                tankAverages[tank_id].all,
-                careerStats[tank_id],
-              ),
-            };
-      },
-      {},
-    );
-    const todayWN8sEntries = Object.entries(todayWN8s);
-    const careerWN8sEntries = Object.entries(careerWN8s);
-
-    todayWN8s[0] =
-      todayWN8sEntries.reduce(
-        (accumulator, [tankIdString, wn8]) =>
-          accumulator + wn8 * tankStatsOverTime[Number(tankIdString)].battles,
-        0,
-      ) /
-      todayWN8sEntries.reduce(
-        (accumulator, [tankIdString]) =>
-          accumulator + tankStatsOverTime[Number(tankIdString)].battles,
-        0,
-      );
-    careerWN8s[0] =
-      careerWN8sEntries.reduce(
-        (accumulator, [tankIdString, WN8]) =>
-          isNaN(WN8)
-            ? accumulator
-            : accumulator + WN8 * careerStats[Number(tankIdString)].battles,
-        0,
-      ) /
-      careerWN8sEntries.reduce(
-        (accumulator, [tankIdString, WN8]) =>
-          isNaN(WN8)
-            ? accumulator
-            : accumulator + careerStats[Number(tankIdString)].battles,
-        0,
-      );
-
-    const rows = tankStatsOverTimeEntries.map(([tankIdString, tankStats]) => {
-      const tankId = Number(tankIdString);
-      const career = careerStats[tankId];
-
-      return (
-        <Breakdown.Row
-          key={tankId}
-          name={tankId === 0 ? 'Total' : resolveTankName(Number(tankIdString))}
-          winrate={tankStats.wins / tankStats.battles}
-          careerWinrate={career.wins / career.battles}
-          WN8={isNaN(todayWN8s[tankId]) ? undefined : todayWN8s[tankId]}
-          careerWN8={isNaN(careerWN8s[tankId]) ? undefined : careerWN8s[tankId]}
-          damage={tankStats.damage_dealt / tankStats.battles}
-          careerDamage={career.damage_dealt / career.battles}
-          survival={tankStats.survived_battles / tankStats.battles}
-          careerSurvival={career.survived_battles / career.battles}
-          battles={tankStats.battles}
-          careerBattles={career.battles}
-          icon={
-            tankId === 0
-              ? undefined
-              : tankopedia[tankIdString as unknown as number].images.normal
-          }
-        />
-      );
-    });
+  async handler(interaction) {
+    const player = await resolvePlayerFromCommand(interaction);
+    const { nickname } = (
+      await getWargamingResponse<AccountInfo>(
+        `https://api.wotblitz.${player.server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${player.id}`,
+      )
+    )[player.id];
+    const path = interactionToURL(interaction, player);
 
     return [
-      <Wrapper>
-        <TitleBar
-          name={accountInfo[id].nickname}
-          nameDiscriminator={
-            clanData[id]?.clan ? `[${clanData[id]?.clan?.tag}]` : undefined
-          }
-          image={
-            clanData[id]?.clan
-              ? `https://wotblitz-gc.gcdn.co/icons/clanEmblems1x/clan-icon-v2-${clanData[id]?.clan?.emblem_set_id}.png`
-              : undefined
-          }
-          description={`Today's breakdown • ${new Date().toDateString()} • ${
-            BLITZ_SERVERS[server]
-          }`}
-        />
-
-        {rows.length === 0 && <NoData type={NoDataType.BattlesInPeriod} />}
-        {rows.length > 0 && <Breakdown.Root>{rows}</Breakdown.Root>}
-
-        <PoweredByBlitzStars />
-      </Wrapper>,
-      fullBlitzStarsStats(server, accountInfo[id].nickname),
-      supportBlitzStars,
+      await today(player),
+      primaryButton(path, 'Refresh'),
+      // linkButton(`${CYCLIC_API}/${path}`, 'Embed'),
+      linkButton(
+        `https://www.blitzstars.com/player/${player.server}/${nickname}`,
+        'BlitzStars',
+      ),
     ];
   },
 
-  autocomplete: usernameAutocomplete,
+  autocomplete: autocompleteUsername,
+
+  async button(interaction) {
+    const player = await resolvePlayerFromButton(interaction);
+
+    return await today(player);
+  },
 } satisfies CommandRegistry;

src/commands/verify.ts

@@ -1,15 +1,14 @@
 import { SlashCommandBuilder } from 'discord.js';
 import markdownEscape from 'markdown-escape';
 import discord from '../../discord.json' assert { type: 'json' };
-import usernameAutocomplete from '../core/autocomplete/username.js';
-import getBlitzAccount from '../core/blitz/getBlitzAccount.js';
 import getWargamingResponse from '../core/blitz/getWargamingResponse.js';
-import cmdName from '../core/interaction/cmdName.js';
-import negativeEmbed from '../core/interaction/negativeEmbed.js';
-import positiveEmbed from '../core/interaction/positiveEmbed.js';
-import addUsernameOption from '../core/options/addUsernameOption.js';
-import { WARGAMING_APPLICATION_ID } from '../core/process/args.js';
-import { CommandRegistry } from '../events/interactionCreate.js';
+import addUsernameChoices from '../core/discord/addUsernameChoices.js';
+import autocompleteUsername from '../core/discord/autocompleteUsername.js';
+import embedNegative from '../core/discord/embedNegative.js';
+import embedPositive from '../core/discord/embedPositive.js';
+import resolvePlayerFromCommand from '../core/discord/resolvePlayerFromCommand.js';
+import { WARGAMING_APPLICATION_ID } from '../core/node/arguments.js';
+import { CommandRegistry } from '../events/interactionCreate/index.js';
 import { AccountInfo } from '../types/accountInfo.js';
 import { PlayerClanData } from '../types/playerClanData.js';
 
@@ -19,12 +18,12 @@ export default {
   inPublic: true,
 
   command: new SlashCommandBuilder()
-    .setName(cmdName('verify'))
+    .setName('verify')
     .setDescription("Set's the user's username to their in-game name")
-    .addStringOption((option) => addUsernameOption(option).setRequired(true)),
+    .addStringOption((option) => addUsernameChoices(option).setRequired(true)),
 
-  async execute(interaction) {
-    const blitzAccount = await getBlitzAccount(interaction);
+  async handler(interaction) {
+    const blitzAccount = await resolvePlayerFromCommand(interaction);
     const { id, server } = blitzAccount;
     const accountInfo = await getWargamingResponse<AccountInfo>(
       `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
@@ -39,13 +38,13 @@ export default {
       interaction.guild?.members.cache.get(interaction.member?.user.id);
 
     if (!interaction.guild?.members.me?.permissions.has('ManageNicknames')) {
-      return negativeEmbed(
+      return embedNegative(
         `${markdownEscape(interaction.user.username)} failed to verify`,
         "I don't have the permission to change your nickname.",
       );
     }
     if (!interaction.member || !member) {
-      return negativeEmbed(
+      return embedNegative(
         `${interaction.user.username} is not in this server`,
         "I couldn't find this person in this server. Did they leave?",
       );
@@ -56,7 +55,7 @@ export default {
 
       if (interaction.guildId === discord.sklld_guild_id) {
         if (!interaction.guild?.members.me?.permissions.has('ManageRoles')) {
-          return negativeEmbed(
+          return embedNegative(
             `${markdownEscape(interaction.user.username)} failed to verify`,
             "I don't have the permission to change your manage roles.",
           );
@@ -66,19 +65,19 @@ export default {
         await member.roles.add(discord.sklld_peasant_role);
       }
 
-      return positiveEmbed(
+      return embedPositive(
         `${interaction.user.username} is verified`,
         `The user is now verified as ${markdownEscape(
           accountInfo[id].nickname,
         )}${markdownEscape(clanTag)}`,
       );
     } catch (error) {
-      return negativeEmbed(
+      return embedNegative(
         `${interaction.user.username} failed to verify`,
         "I can't change your nickname because you have higher permissions than me. Try setting your nickname to your Blitz username manually.",
       );
     }
   },
 
-  autocomplete: usernameAutocomplete,
+  autocomplete: autocompleteUsername,
 } satisfies CommandRegistry;

src/components/AllStatsOverview/components/WN8Display/components/Glow.tsx

@@ -0,0 +1,39 @@
+import { Percentile } from '../../../../../constants/percentiles.js';
+import hslToHex from '../../../../../core/node/hslToHex.js';
+import { PERCENTILE_COLORS } from '../../../../PercentileIndicator.js';
+
+export enum GlowSide {
+  Top,
+  Bottom,
+}
+
+export interface GlowProps {
+  percentile: Percentile;
+  side: GlowSide;
+}
+
+export function Glow({ percentile, side }: GlowProps) {
+  const color = PERCENTILE_COLORS[percentile];
+  const color1 = hslToHex(color);
+  const color2 = `${color1}00`;
+
+  const background = `linear-gradient(${
+    side === GlowSide.Top ? 0 : 180
+  }deg, ${color1} 0%, ${color2} 100%)`;
+
+  return (
+    <div
+      style={{
+        display: 'flex',
+        alignItems: side === GlowSide.Top ? 'flex-end' : 'flex-start',
+        justifyContent: 'center',
+      }}
+    >
+      <div style={{ height: 54, width: 16, background }} />
+      <div style={{ height: 72, width: 16, background }} />
+      <div style={{ height: 80, width: 16, background }} />
+      <div style={{ height: 72, width: 16, background }} />
+      <div style={{ height: 54, width: 16, background }} />
+    </div>
+  );
+}

src/components/AllStatsOverview/components/WN8Display/index.tsx

@@ -0,0 +1,77 @@
+import { Percentile } from '../../../../constants/percentiles.js';
+import getWN8Percentile from '../../../../core/blitz/getWN8Percentile.js';
+import { theme } from '../../../../stitches.config.js';
+import { PERCENTILE_COLORS } from '../../../PercentileIndicator.js';
+import { Glow, GlowSide } from './components/Glow.js';
+
+export interface WN8DisplayProps {
+  WN8?: number;
+}
+
+export const PERCENTILE_NAMES = {
+  [Percentile.VeryBad]: 'Very Bad',
+  [Percentile.Bad]: 'Bad',
+  [Percentile.BelowAverage]: 'Below Average',
+  [Percentile.Average]: 'Average',
+  [Percentile.AboveAverage]: 'Above Average',
+  [Percentile.Good]: 'Good',
+  [Percentile.VeryGood]: 'Very Good',
+  [Percentile.Great]: 'Great',
+  [Percentile.Unicum]: 'Unicum',
+  [Percentile.SuperUnicum]: 'Super Unicum',
+};
+
+export function WN8Display({ WN8 }: WN8DisplayProps) {
+  const percentile =
+    WN8 === undefined ? Percentile.VeryBad : getWN8Percentile(WN8);
+  const color = PERCENTILE_COLORS[percentile];
+
+  return (
+    <div
+      style={{
+        width: 128 * 2, // idk why twice the width turns into the correct width
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+        gap: -16,
+      }}
+    >
+      <Glow percentile={percentile} side={GlowSide.Top} />
+
+      <div
+        style={{
+          width: 128,
+          height: 80,
+          backgroundColor: color,
+          borderRadius: 40,
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+          justifyContent: 'center',
+          gap: -4,
+        }}
+      >
+        <span
+          style={{
+            fontWeight: 900,
+            fontSize: 32,
+            color: theme.colors.textHighContrast,
+          }}
+        >
+          {WN8 === undefined ? '--' : WN8.toFixed(0)}
+        </span>
+        <span
+          style={{
+            fontSize: 16,
+            color: theme.colors.textHighContrast,
+          }}
+        >
+          {PERCENTILE_NAMES[percentile]}
+        </span>
+      </div>
+
+      <Glow percentile={percentile} side={GlowSide.Bottom} />
+    </div>
+  );
+}

src/components/AllStatsOverview/components/WN8SurroundingStat.tsx

@@ -0,0 +1,47 @@
+import { theme } from '../../../stitches.config.js';
+
+export enum WN8SurroundingStatAlign {
+  Left,
+  Right,
+}
+
+export interface WN8SurroundingStatProps {
+  label: string;
+  value: string | number;
+  align?: WN8SurroundingStatAlign;
+  padded?: boolean;
+}
+
+export function WN8SurroundingStat({
+  label,
+  value,
+  align = WN8SurroundingStatAlign.Left,
+  padded = false,
+}: WN8SurroundingStatProps) {
+  return (
+    <div
+      style={{
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems:
+          align === WN8SurroundingStatAlign.Left ? 'flex-start' : 'flex-end',
+        paddingLeft: padded && align === WN8SurroundingStatAlign.Left ? 32 : 0,
+        paddingRight:
+          padded && align === WN8SurroundingStatAlign.Right ? 32 : 0,
+      }}
+    >
+      <span
+        style={{
+          color: theme.colors.textHighContrast,
+          fontSize: 24,
+          fontWeight: 'bold',
+        }}
+      >
+        {value}
+      </span>
+      <span style={{ color: theme.colors.textLowContrast, fontSize: 16 }}>
+        {label}
+      </span>
+    </div>
+  );
+}

src/components/AllStatsOverview/index.tsx

@@ -0,0 +1,96 @@
+import { AllStats, SupplementaryStats } from '../../types/accountInfo.js';
+import { WN8Display } from './components/WN8Display/index.js';
+import {
+  WN8SurroundingStat,
+  WN8SurroundingStatAlign,
+} from './components/WN8SurroundingStat.js';
+
+export interface AllStatsOverviewProps {
+  stats: AllStats;
+  supplementaryStats: SupplementaryStats;
+}
+
+export default function AllStatsOverview({
+  stats,
+  supplementaryStats,
+}: AllStatsOverviewProps) {
+  return (
+    <div
+      style={{
+        display: 'flex',
+        gap: -64,
+        width: '100%',
+      }}
+    >
+      <div
+        style={{
+          display: 'flex',
+          flexDirection: 'column',
+          gap: 8,
+          alignItems: 'flex-end',
+          flex: 1,
+        }}
+      >
+        <WN8SurroundingStat
+          label="Battles"
+          value={stats.battles.toLocaleString()}
+          align={WN8SurroundingStatAlign.Right}
+        />
+        <WN8SurroundingStat
+          label="Winrate"
+          value={`${(100 * (stats.wins / stats.battles)).toFixed(2)}%`}
+          align={WN8SurroundingStatAlign.Right}
+          padded
+        />
+        <WN8SurroundingStat
+          label="Damage"
+          value={Math.round(
+            stats.damage_dealt / stats.battles,
+          ).toLocaleString()}
+          align={WN8SurroundingStatAlign.Right}
+          padded
+        />
+        <WN8SurroundingStat
+          label="Dmg. ratio"
+          value={(stats.damage_dealt / stats.damage_received).toFixed(2)}
+          align={WN8SurroundingStatAlign.Right}
+        />
+      </div>
+
+      <WN8Display WN8={supplementaryStats.WN8} />
+
+      <div
+        style={{
+          display: 'flex',
+          flexDirection: 'column',
+          gap: 8,
+          flex: 1,
+        }}
+      >
+        <WN8SurroundingStat
+          label="Tier"
+          value={supplementaryStats.tier.toFixed(2)}
+        />
+        <WN8SurroundingStat
+          label="Survival"
+          value={`${(100 * (stats.survived_battles / stats.battles)).toFixed(
+            2,
+          )}%`}
+          padded
+        />
+        <WN8SurroundingStat
+          label="Accuracy"
+          value={`${(100 * (stats.hits / stats.shots)).toFixed(2)}%`}
+          padded
+        />
+        <WN8SurroundingStat
+          label="Kill ratio"
+          value={(
+            stats.frags /
+            (stats.battles - stats.survived_battles)
+          ).toFixed(2)}
+        />
+      </div>
+    </div>
+  );
+}

src/components/GenericAllStats.tsx

@@ -1,4 +1,5 @@
 import getWN8Percentile from '../core/blitz/getWN8Percentile.js';
+import isNumber from '../core/node/isNumber.js';
 import { AllStats, SupplementaryStats } from '../types/accountInfo.js';
 import GenericStats from './GenericStats/index.js';
 
@@ -11,6 +12,10 @@ export default function GenericAllStats({
   stats,
   supplementaryStats,
 }: GenericAllStatsProps) {
+  const damageRatio = stats.damage_dealt / stats.damage_received;
+  const killsToDeathRatio =
+    stats.frags / (stats.battles - stats.survived_battles);
+
   return (
     <GenericStats
       stats={[
@@ -18,13 +23,13 @@ export default function GenericAllStats({
         [
           'WN8',
           supplementaryStats
-            ? supplementaryStats.WN8 === undefined
-              ? '--'
-              : supplementaryStats.WN8.toFixed(0)
+            ? isNumber(supplementaryStats.WN8)
+              ? supplementaryStats.WN8!.toFixed(0)
+              : '--'
+            : undefined,
+          isNumber(supplementaryStats?.WN8)
+            ? getWN8Percentile(supplementaryStats!.WN8!)
             : undefined,
-          supplementaryStats?.WN8 === undefined
-            ? undefined
-            : getWN8Percentile(supplementaryStats.WN8),
         ],
         [
           'Survival',
@@ -41,13 +46,10 @@ export default function GenericAllStats({
         ['Average hits', (stats.hits / stats.battles).toFixed(2)],
         ['Average kills', (stats.frags / stats.battles).toFixed(2)],
         ['Average spots', (stats.spotted / stats.battles).toFixed(2)],
-        [
-          'Damage ratio',
-          (stats.damage_dealt / stats.damage_received).toFixed(2),
-        ],
+        ['Damage ratio', isFinite(damageRatio) ? damageRatio.toFixed(2) : '--'],
         [
           'Kills to death ratio',
-          (stats.frags / (stats.battles - stats.survived_battles)).toFixed(2),
+          isFinite(killsToDeathRatio) ? killsToDeathRatio.toFixed(2) : '--',
         ],
       ]}
     />

src/components/GenericStats/components/GenericStatsRow.tsx

@@ -1,8 +1,6 @@
 import { theme } from '../../../stitches.config.js';
-import { Stat } from '../index.js';
-
-import '../../../core/blitz/getWN8Percentile.js';
 import PercentileIndicator from '../../PercentileIndicator.js';
+import { Stat } from '../index.js';
 
 export interface GenericStatsRowProps {
   stat: Stat;

src/components/Graph/components/Line.tsx

@@ -0,0 +1,77 @@
+import { blue, green, red, slateDark } from '@radix-ui/colors';
+import { GRAPH_HEIGHT, GRAPH_WIDTH } from './Root.js';
+
+export enum LineColor {
+  Red,
+  Green,
+  Blue,
+  White,
+}
+
+const LINE_COLORS = {
+  [LineColor.Red]: red.red9,
+  [LineColor.Green]: green.green9,
+  [LineColor.Blue]: blue.blue9,
+  [LineColor.White]: slateDark.slate11,
+};
+
+export enum LineStyle {
+  Solid,
+  Dashes,
+  DashesAndDots,
+}
+
+const LINE_STYLES = {
+  [LineStyle.Solid]: undefined,
+  [LineStyle.Dashes]: '8, 8',
+  [LineStyle.DashesAndDots]: '1, 4, 8, 4',
+};
+
+export type PlotItem = [number, number];
+export type Plot = PlotItem[];
+
+export interface LineProps {
+  plot: Plot;
+  minY?: number;
+  maxY?: number;
+  color?: LineColor;
+  style?: LineStyle;
+  lineWidth?: number;
+}
+
+export function Line({
+  plot,
+  minY: providedMinY,
+  maxY: providedMaxY,
+  color = LineColor.Red,
+  style = LineStyle.Solid,
+  lineWidth = 2,
+}: LineProps) {
+  const xs = plot.map(([x]) => x);
+  const minX = Math.min(...xs);
+  const maxX = Math.max(...xs);
+  const ys = plot.map(([, y]) => y);
+  const minY = providedMinY ?? Math.min(...ys);
+  const maxY = providedMaxY ?? Math.max(...ys);
+  const rangeX = maxX - minX;
+  const rangeY = maxY - minY;
+  const points = plot
+    .map(
+      ([x, y]) =>
+        `${(x - minX) * (GRAPH_WIDTH / rangeX)},${
+          GRAPH_HEIGHT - (y - minY) * (GRAPH_HEIGHT / rangeY)
+        }`,
+    )
+    .join(' ');
+
+  return (
+    <polyline
+      vector-effect="non-scaling-stroke"
+      fill="none"
+      stroke={LINE_COLORS[color]}
+      stroke-width={lineWidth}
+      stroke-dasharray={LINE_STYLES[style]}
+      points={points}
+    />
+  );
+}

src/components/Graph/components/Margin.tsx

@@ -0,0 +1,53 @@
+import { times } from 'lodash';
+import { theme } from '../../../stitches.config.js';
+import { MarginInputProps } from './Root.js';
+
+export enum MarginOrientation {
+  Vertical,
+  Horizontal,
+}
+
+export interface MarginProps extends MarginInputProps {
+  verticalSeparations: number;
+  orientation?: MarginOrientation;
+}
+
+export function Margin({
+  verticalSeparations,
+  max,
+  min,
+  suffix,
+  precision = 0,
+  orientation = MarginOrientation.Vertical,
+}: MarginProps) {
+  const isVertical = orientation === MarginOrientation.Vertical;
+
+  return (
+    <div
+      style={{
+        paddingLeft: isVertical ? 0 : 64,
+        width: isVertical ? 48 : '100%',
+        display: 'flex',
+        flexDirection: isVertical ? 'column' : 'row-reverse',
+        justifyContent: 'space-between',
+      }}
+    >
+      {times(verticalSeparations, (index) => (
+        <span
+          key={index}
+          style={{
+            fontSize: 16,
+            color: theme.colors.textLowContrast,
+          }}
+        >
+          {`${(
+            (max - min) *
+              ((verticalSeparations - (index + 1)) /
+                (verticalSeparations - 1)) +
+            min
+          ).toFixed(precision)}${suffix ?? ''}`}
+        </span>
+      ))}
+    </div>
+  );
+}

src/components/Graph/components/Root.tsx

@@ -0,0 +1,93 @@
+import { times } from 'lodash';
+import { ReactNode } from 'react';
+import { theme } from '../../../stitches.config.js';
+import { Margin, MarginOrientation } from './Margin.js';
+
+export const GRAPH_WIDTH = 544;
+export const GRAPH_HEIGHT = 320;
+
+export interface MarginInputProps {
+  min: number;
+  max: number;
+  suffix?: string;
+  precision?: number;
+}
+
+export interface RootProps {
+  children: ReactNode;
+  verticalMargin?: MarginInputProps;
+  horizontalMargin?: MarginInputProps;
+  separations?: number;
+  xMinLabel: string;
+  xMaxLabel: string;
+}
+
+export function Root({
+  children,
+  verticalMargin,
+  horizontalMargin,
+  separations = 5,
+  xMinLabel,
+  xMaxLabel,
+}: RootProps) {
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>
+      <div
+        style={{
+          paddingLeft: 64,
+          display: 'flex',
+          justifyContent: 'space-between',
+        }}
+      >
+        <span style={{ fontSize: 16, color: theme.colors.textLowContrast }}>
+          {xMinLabel}
+        </span>
+        <span style={{ fontSize: 16, color: theme.colors.textLowContrast }}>
+          {xMaxLabel}
+        </span>
+      </div>
+
+      <div style={{ display: 'flex', gap: 16 }}>
+        {verticalMargin && (
+          <Margin {...verticalMargin} verticalSeparations={separations} />
+        )}
+
+        <svg
+          viewBox={`0 0 ${GRAPH_WIDTH} ${GRAPH_HEIGHT}`}
+          preserveAspectRatio="none"
+          style={{
+            flex: 1,
+            backgroundColor: theme.colors.appBackground2,
+            borderRadius: 4,
+            border: theme.borderStyles.nonInteractive,
+          }}
+        >
+          {times(separations - 2, (index) => {
+            const y = GRAPH_HEIGHT * ((index + 1) / (separations - 1));
+
+            return (
+              <polyline
+                key={index}
+                vector-effect="non-scaling-stroke"
+                fill="none"
+                stroke={theme.colors.borderNonInteractive}
+                stroke-width="2"
+                points={`0,${y}, ${GRAPH_WIDTH},${y}`}
+              />
+            );
+          })}
+
+          {children}
+        </svg>
+      </div>
+
+      {horizontalMargin && (
+        <Margin
+          {...horizontalMargin}
+          verticalSeparations={separations}
+          orientation={MarginOrientation.Horizontal}
+        />
+      )}
+    </div>
+  );
+}

src/components/Graph/index.ts

@@ -0,0 +1,3 @@
+export * from './components/Line.js';
+export * from './components/Margin.js';
+export * from './components/Root.js';

src/components/PoweredBy.tsx

@@ -0,0 +1,38 @@
+import { ReactNode } from 'react';
+import { theme } from '../stitches.config.js';
+
+export enum PoweredByType {
+  BlitzStars,
+  Wargaming,
+}
+
+export interface PoweredByProps {
+  type: PoweredByType;
+  footer?: ReactNode;
+}
+
+const POWERED_BY_IMAGES: Record<PoweredByType, string> = {
+  [PoweredByType.BlitzStars]:
+    'https://www.blitzstars.com/assets/images/4b4cb591.TankyMcPewpew.png',
+  [PoweredByType.Wargaming]: 'https://i.imgur.com/jADGWm0.png',
+};
+
+const POWERED_BY_NAMES: Record<PoweredByType, string> = {
+  [PoweredByType.BlitzStars]: 'BlitzStars',
+  [PoweredByType.Wargaming]: 'Wargaming',
+};
+
+export default function PoweredBy({ type, footer }: PoweredByProps) {
+  return (
+    <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+      <div style={{ display: 'flex' }}>{footer}</div>
+
+      <div style={{ display: 'flex', gap: 4 }}>
+        <img src={POWERED_BY_IMAGES[type]} style={{ height: 16, width: 16 }} />
+        <span style={{ color: theme.colors.textLowContrast, fontSize: 16 }}>
+          Powered by {POWERED_BY_NAMES[type]}
+        </span>
+      </div>
+    </div>
+  );
+}

src/components/PoweredByBlitzStars.tsx

@@ -1,15 +0,0 @@
-import { theme } from '../stitches.config.js';
-
-export default function PoweredByBlitzStars() {
-  return (
-    <div style={{ display: 'flex', gap: 4, justifyContent: 'flex-end' }}>
-      <img
-        src="https://www.blitzstars.com/assets/images/4b4cb591.TankyMcPewpew.png"
-        style={{ height: 16, width: 16 }}
-      />
-      <span style={{ color: theme.colors.textLowContrast, fontSize: 16 }}>
-        Powered by BlitzStars
-      </span>
-    </div>
-  );
-}

src/components/PoweredByWargaming.tsx

@@ -1,15 +0,0 @@
-import { theme } from '../stitches.config.js';
-
-export default function PoweredByWargaming() {
-  return (
-    <div style={{ display: 'flex', gap: 4, justifyContent: 'flex-end' }}>
-      <img
-        src="https://i.imgur.com/jADGWm0.png"
-        style={{ height: 16, width: 16 }}
-      />
-      <span style={{ color: theme.colors.textLowContrast, fontSize: 16 }}>
-        Powered by Wargaming
-      </span>
-    </div>
-  );
-}

src/components/TierWeights.tsx

@@ -0,0 +1,34 @@
+import { TIER_ROMAN_NUMERALS, Tier } from '../core/blitz/tankopedia.js';
+import { themeLight } from '../stitches.config.js';
+
+export type TierWeightsRecord = Partial<Record<Tier, number>>;
+
+export interface TierWeightsProps {
+  weights: TierWeightsRecord;
+}
+
+export default function TierWeights({ weights }: TierWeightsProps) {
+  return (
+    <div style={{ display: 'flex', gap: 8 }}>
+      {Object.entries(weights).map(([tier, weight]) => (
+        <div
+          key={tier}
+          style={{
+            backgroundColor: themeLight.colors.appBackground1,
+            flex: weight,
+            color: themeLight.colors.textHighContrast,
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontSize: 16,
+            overflow: 'hidden',
+            borderRadius: 8,
+            minWidth: 16,
+          }}
+        >
+          {TIER_ROMAN_NUMERALS[parseInt(tier) as Tier]}
+        </div>
+      ))}
+    </div>
+  );
+}

src/components/TitleBar.tsx

@@ -1,4 +1,4 @@
-import isDev from '../core/process/isDev.js';
+import isDev from '../core/node/isDev.js';
 import { theme } from '../stitches.config.js';
 
 export interface TitleBarProps {

src/constants/cyclic.ts

@@ -0,0 +1 @@
+export const CYCLIC_API = 'https://blitzkrieg.cyclic.app';

src/constants/servers.ts

@@ -1,19 +1,7 @@
-export const BLITZ_SERVERS = {
+export type BlitzServer = 'com' | 'eu' | 'asia';
+
+export const BLITZ_SERVERS: Record<BlitzServer, string> = {
   com: 'North America',
   eu: 'Europe',
   asia: 'Asia',
 };
-
-export const BLITZ_SERVERS_SHORT = {
-  com: 'NA',
-  eu: 'EU',
-  asia: 'ASIA',
-};
-
-export const BLITZ_SERVERS_SHORT_INVERSE = {
-  NA: 'com',
-  EU: 'eu',
-  ASIA: 'asia',
-};
-
-export type BlitzServer = keyof typeof BLITZ_SERVERS;

src/core/blitz/calculateWN8.ts

@@ -3,7 +3,7 @@ import { AllStats } from '../../types/accountInfo.js';
 /**
  * Formula from https://web.archive.org/web/20190105064817/http://wiki.wnefficiency.net/pages/WN8
  */
-export default function getWN8(expected: AllStats, average: AllStats) {
+export default function calculateWN8(expected: AllStats, average: AllStats) {
   const avgDmg = average.damage_dealt / average.battles;
   const avgSpot = average.spotted / average.battles;
   const avgFrag = average.frags / average.battles;

src/core/blitz/getBlitzClan.ts

@@ -1,23 +1,19 @@
-import { CacheType, ChatInputCommandInteraction } from 'discord.js';
 import { BlitzServer } from '../../constants/servers.js';
-import errorWithCause from '../process/errorWithCause.js';
-import { serverAndIdPattern } from './getBlitzAccount.js';
-import listClansPanServer from './listClansPanServer.js';
+import { serverAndIdPattern } from '../discord/resolvePlayerFromCommand.js';
+import throwError from '../node/throwError.js';
+import listClans from './listClans.js';
 
-export default async function getBlitzClan(
-  interaction: ChatInputCommandInteraction<CacheType>,
-  clan: string,
-) {
+export default async function getBlitzClan(clan: string) {
   if (serverAndIdPattern.test(clan)) {
     const [server, accountId] = clan.split('/');
     return { server: server as BlitzServer, id: Number(accountId) };
   } else {
-    const accounts = await listClansPanServer(clan);
+    const accounts = await listClans(clan);
 
     if (accounts[0]) {
       return { server: accounts[0].server, id: accounts[0].clan_id };
     } else {
-      throw errorWithCause(
+      throw throwError(
         'Could not find clan',
         `I couldn't find clan \`${clan}\`. Try selecting a username from the search result.`,
       );

src/core/blitz/getTankStats.ts

@@ -1,21 +1,16 @@
-import { CacheType, ChatInputCommandInteraction } from 'discord.js';
 import { BLITZ_SERVERS, BlitzServer } from '../../constants/servers.js';
 import { TanksStats } from '../../types/tanksStats.js';
-import { WARGAMING_APPLICATION_ID } from '../process/args.js';
-import errorWithCause from '../process/errorWithCause.js';
+import { WARGAMING_APPLICATION_ID } from '../node/arguments.js';
+import throwError from '../node/throwError.js';
 import getWargamingResponse from './getWargamingResponse.js';
 
-export default async function getTankStats(
-  interaction: ChatInputCommandInteraction<CacheType>,
-  server: BlitzServer,
-  id: number,
-) {
+export default async function getTankStats(server: BlitzServer, id: number) {
   const tankStats = await getWargamingResponse<TanksStats>(
     `https://api.wotblitz.${server}/wotb/tanks/stats/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
   );
 
   if (tankStats[id] === null) {
-    throw errorWithCause(
+    throw throwError(
       'No tank stats available',
       `Wargaming says there is no tank stats for this account. This account may not have any battles/tanks or exist in the ${BLITZ_SERVERS[server]} server.`,
     );

src/core/blitz/getWargamingResponse.ts

@@ -1,5 +1,14 @@
-import { WargamingResponse } from '../../types/wargamingResponse.js';
-import errorWithCause from '../process/errorWithCause.js';
+import throwError from '../node/throwError.js';
+
+export type WargamingResponse<Data extends object> =
+  | {
+      status: 'error';
+      error: { field: string; message: string; code: 402; value: null };
+    }
+  | {
+      status: 'ok';
+      data: Data;
+    };
 
 export default async function getWargamingResponse<Data extends object>(
   url: string,
@@ -12,7 +21,7 @@ export default async function getWargamingResponse<Data extends object>(
   if (parsed.status === 'ok') {
     return parsed.data;
   } else {
-    throw errorWithCause(
+    throw throwError(
       `Wargaming response error status:"${parsed.status}"`,
       `Message: "${parsed.error.message}"\nURL: "${url}"`,
     );

src/core/blitz/listClans.ts

@@ -1,13 +1,13 @@
 import { BlitzServer } from '../../constants/servers.js';
 import { Clan, ClanList } from '../../types/clanList.js';
-import { WARGAMING_APPLICATION_ID } from '../process/args.js';
+import { WARGAMING_APPLICATION_ID } from '../node/arguments.js';
 import getWargamingResponse from './getWargamingResponse.js';
 
 export type ClanListWithServer = (Clan & {
   server: 'com' | 'eu' | 'asia';
 })[];
 
-export default async function listClansPanServer(search: string, limit = 9) {
+export default async function listClans(search: string, limit = 9) {
   const trimmed = search.trim();
   if (trimmed.length < 3 && trimmed.length > 100) return [];
   const normalizedLimit = Math.round(limit / 3);

src/core/blitz/listPlayers.ts

@@ -1,6 +1,6 @@
 import { BlitzServer } from '../../constants/servers.js';
 import { Account, AccountList } from '../../types/accountList.js';
-import { WARGAMING_APPLICATION_ID } from '../process/args.js';
+import { WARGAMING_APPLICATION_ID } from '../node/arguments.js';
 import getWargamingResponse from './getWargamingResponse.js';
 
 export type AccountListWithServer = (Account & {
@@ -10,7 +10,7 @@ export type AccountListWithServer = (Account & {
 export const usernamePattern = /^[a-zA-Z0-9_]{3,24}$/;
 export const usernamePatternWithoutPosition = /[a-zA-Z0-9_]{3,24}/;
 
-export default async function listAccountsPanServer(search: string, limit = 9) {
+export default async function listPlayers(search: string, limit = 9) {
   const trimmedSearch = search.trim();
   const normalizedLimit = Math.round(limit / 3);
   const encodedSearch = encodeURIComponent(trimmedSearch);

src/core/blitz/resolveTankId.ts

@@ -1,19 +1,15 @@
-import { CacheType, ChatInputCommandInteraction } from 'discord.js';
 import { go } from 'fuzzysort';
-import errorWithCause from '../process/errorWithCause.js';
+import throwError from '../node/throwError.js';
 import { TANKS, tankopedia } from './tankopedia.js';
 
-export default async function resolveTankId(
-  interaction: ChatInputCommandInteraction<CacheType>,
-  tank: string,
-) {
-  const number = Number(tank);
+export default function resolveTankId(tank: string) {
+  const number = parseInt(tank);
 
   if (Number.isNaN(number)) {
     const searchResult = go(tank, TANKS, { keys: ['name'], limit: 1 });
 
     if (searchResult.length === 0) {
-      throw errorWithCause(
+      throw throwError(
         'Tank not found',
         `Could not find tank by the name "${tank}".`,
       );
@@ -24,7 +20,7 @@ export default async function resolveTankId(
     if (tankopedia[number]) {
       return number;
     } else {
-      throw errorWithCause(
+      throw throwError(
         'Tank not found',
         `Could not find tank by the ID "${number}".`,
       );

src/core/blitz/sumStats.ts

@@ -1,5 +1,5 @@
 import { AllStats } from '../../types/accountInfo.js';
-import { emptyAllStats } from '../blitzstars/getTankStatsOverTime.js';
+import { emptyAllStats } from '../blitzstars/getTankStatsDiffed.js';
 
 export default function sumStats(allStatsCollection: AllStats[]) {
   return allStatsCollection.reduce((accumulated, current) => {

src/core/blitz/tankopedia.ts

@@ -1,4 +1,5 @@
-import { WargamingResponse } from '../../types/wargamingResponse.js';
+import { readFileSync } from 'fs';
+import { join } from 'path';
 
 export type TankType = 'AT-SPG' | 'lightTank' | 'mediumTank' | 'heavyTank';
 
@@ -18,30 +19,15 @@ export interface Tankopedia {
   [id: number]: TankopediaEntry;
 }
 
-export const tankopedia: Tankopedia = {};
-export const TANK_IDS: number[] = [];
-export const TANKS: TankopediaEntry[] = [];
-export const TANK_NAMES: string[] = [];
-
-console.log('Caching tankopedia...');
-fetch('https://www.blitzstars.com/bs-tankopedia.json')
-  .then(
-    (response) =>
-      response.json() as Promise<
-        WargamingResponse<Tankopedia> & { status: 'ok' }
-      >,
-  )
-  .then((wargamingResponse) => {
-    Object.assign(tankopedia, wargamingResponse.data);
-    Object.entries(tankopedia).forEach(([idString, entry]) => {
-      const id = Number(idString);
-
-      TANK_IDS.push(id);
-      TANKS.push(entry);
-      TANK_NAMES.push(entry.name);
-    }),
-      console.log('Cached tankopedia');
-  });
+export const tankopedia = (
+  JSON.parse(
+    readFileSync(join(__dirname, 'tankopedia.json')) as unknown as string,
+  ) as { data: Tankopedia }
+).data;
+const entries = Object.entries(tankopedia);
+export const TANK_IDS = entries.map(([, { tank_id }]) => tank_id as number);
+export const TANKS = entries.map(([, entry]) => entry as TankopediaEntry);
+export const TANK_NAMES = entries.map(([, { name }]) => name);
 
 export const TANK_ICONS: Record<TankType, string> = {
   'AT-SPG': 'https://i.imgur.com/BIHSEH0.png',
@@ -50,7 +36,9 @@ export const TANK_ICONS: Record<TankType, string> = {
   heavyTank: 'https://i.imgur.com/ECeqlZa.png',
 };
 
-export const TIER_ROMAN_NUMERALS: Record<number, string> = {
+export type Tier = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;
+
+export const TIER_ROMAN_NUMERALS: Record<Tier, string> = {
   1: 'I',
   2: 'II',
   3: 'III',

src/core/blitz/wargamingError.ts

@@ -1,26 +0,0 @@
-import {
-  CacheType,
-  ChatInputCommandInteraction,
-  EmbedBuilder,
-} from 'discord.js';
-import { NEGATIVE_COLOR } from '../../constants/colors.js';
-import { handleError } from '../../events/error.js';
-import { client } from '../../index.js';
-
-export default async function wargamingError(
-  interaction: ChatInputCommandInteraction<CacheType>,
-  error: Error,
-  command: string,
-) {
-  await interaction.editReply({
-    embeds: [
-      new EmbedBuilder()
-        .setColor(NEGATIVE_COLOR)
-        .setTitle(`${client.user?.username} ran into an issue`)
-        .setDescription('Wargaming returned an error. Please try again later.'),
-    ],
-  });
-
-  console.log(`Wargaming returned an error`);
-  handleError(error, command);
-}

src/core/blitzstars/blitzStarsError.ts

@@ -1,28 +0,0 @@
-import {
-  CacheType,
-  ChatInputCommandInteraction,
-  EmbedBuilder,
-} from 'discord.js';
-import { NEGATIVE_COLOR } from '../../constants/colors.js';
-import { handleError } from '../../events/error.js';
-import { client } from '../../index.js';
-
-export default async function blitzStarsError(
-  interaction: ChatInputCommandInteraction<CacheType>,
-  error: Error,
-  command: string,
-) {
-  await interaction.editReply({
-    embeds: [
-      new EmbedBuilder()
-        .setColor(NEGATIVE_COLOR)
-        .setTitle(`${client.user?.username} ran into an issue`)
-        .setDescription(
-          'BlitzStars returned an error. Please try again later.',
-        ),
-    ],
-  });
-
-  console.log(`BlitzStars returned an error`);
-  handleError(error, command);
-}

src/core/blitzstars/blitzStarsLinks.ts

@@ -1,5 +0,0 @@
-import { BlitzServer } from '../../constants/servers.js';
-
-export default function blitzStarsLinks(server: BlitzServer, nickname: string) {
-  return `[View full stats](https://www.blitzstars.com/player/${server}/${nickname}) • [Support BlitzStars](https://www.blitzstars.com/supporters)`;
-}

src/core/blitzstars/getPeriodNow.ts

@@ -1,3 +1,3 @@
 export default function getPeriodNow() {
-  return new Date().getTime() / 1000;
+  return Date.now() / 1000;
 }

src/core/blitzstars/getPeriodStart.ts

@@ -1,23 +1,12 @@
-import { StatPeriod } from '../options/addStatPeriodChoices.js';
+import { Period } from '../discord/addPeriodSubCommands.js';
+import getTimeDaysAgo from './getTimeDaysAgo.js';
 
-export default function getPeriodicStart(period: StatPeriod) {
+export default function getPeriodStart(period: Exclude<Period, 'custom'>) {
   if (period === 'career') {
     return -Infinity;
   } else if (period === 'today') {
-    const now = new Date();
-    now.setHours(5, 0, 0, 0);
-
-    // If it's after 5:00 AM today, subtract one day
-    if (now.getTime() > Date.now()) now.setDate(now.getDate() - 1);
-
-    return now.getTime() / 1000;
+    return getTimeDaysAgo(0);
   } else {
-    const daysAgo = Number(period) - 1;
-    const periodStart = new Date();
-
-    periodStart.setDate(periodStart.getDate() - daysAgo);
-    periodStart.setHours(5, 0, 0, 0);
-
-    return periodStart.getTime() / 1000;
+    return getTimeDaysAgo(parseInt(period));
   }
 }

src/core/blitzstars/getPlayerHistories.ts

@@ -0,0 +1,92 @@
+import { BlitzServer } from '../../constants/servers.js';
+import { AccountInfo, AllStats } from '../../types/accountInfo.js';
+import {
+  GetHistoriesOptions,
+  Histories,
+  History,
+  getHistoriesDefaultOptions,
+} from '../../types/histories.js';
+import getWargamingResponse from '../blitz/getWargamingResponse.js';
+import { WARGAMING_APPLICATION_ID } from '../node/arguments.js';
+import { emptyAllStats } from './getTankStatsDiffed.js';
+
+export interface PlayerHistoryRaw {
+  clan: { clan_id: number; name: string; tag: string };
+  statistics: {
+    all: AllStats;
+    wn8: number;
+    wn7: number;
+    average_tier: number;
+  };
+  last_battle_time: number;
+  nickname: string;
+  account_id: number;
+  achievements: {
+    account_id: number;
+    [key: string]: number;
+  };
+  region: BlitzServer;
+}
+
+export type PlayerHistoriesRaw = PlayerHistoryRaw[];
+
+export default async function getPlayerHistories(
+  server: BlitzServer,
+  id: number,
+  options?: Partial<GetHistoriesOptions>,
+) {
+  const mergedOptions = { ...getHistoriesDefaultOptions, ...options };
+  const response = await fetch(
+    `https://www.blitzstars.com/api/playerstats/${id}`,
+  );
+  const playerHistories = ((await response.json()) as PlayerHistoriesRaw).map(
+    (history) =>
+      ({
+        all: history.statistics.all,
+        last_battle_time: history.last_battle_time,
+      } satisfies History),
+  );
+  let lastNonCompliantIndex = -1;
+  let hasCompliedOnce = false;
+  const filtered = playerHistories.filter(({ last_battle_time }, index) => {
+    const complies =
+      last_battle_time >= mergedOptions.start &&
+      last_battle_time <= mergedOptions.end;
+
+    if (complies && !hasCompliedOnce) hasCompliedOnce = true;
+    if (!hasCompliedOnce) lastNonCompliantIndex = index;
+
+    return complies;
+  });
+
+  const latestNodes: Histories = [];
+
+  if (mergedOptions.includeLatestHistories) {
+    const {
+      last_battle_time,
+      statistics: { all },
+    } = (
+      await getWargamingResponse<AccountInfo>(
+        `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`,
+      )
+    )[id];
+
+    latestNodes.push({ all, last_battle_time });
+  }
+
+  const previousNodes: Histories = [];
+
+  if (mergedOptions.includePreviousHistories) {
+    if (lastNonCompliantIndex !== -1) {
+      previousNodes.push(
+        playerHistories[lastNonCompliantIndex] ??
+          ({
+            all: emptyAllStats,
+            last_battle_time: -Infinity,
+          } satisfies History),
+      );
+    }
+  }
+
+  return [...latestNodes, ...filtered, ...previousNodes] satisfies Histories;
+}

src/core/blitzstars/getTankHistories.ts

@@ -0,0 +1,113 @@
+import { BlitzServer } from '../../constants/servers.js';
+import {
+  GetHistoriesOptions,
+  Histories,
+  History,
+  getHistoriesDefaultOptions,
+} from '../../types/histories.js';
+import getTankStats from '../blitz/getTankStats.js';
+import { emptyAllStats } from './getTankStatsDiffed.js';
+
+export interface TankHistory extends History {
+  tank_id: number;
+}
+
+export type TankHistories = TankHistory[];
+
+export interface TankHistoryRaw extends TankHistory {
+  mark_of_mastery: number;
+  battle_life_time: number;
+  account_id: number;
+}
+
+export type TankHistoriesRaw = TankHistoryRaw[];
+
+export interface GetTankHistoriesOptions extends GetHistoriesOptions {
+  tankId?: number;
+}
+
+export const getTankHistoriesDefaultOptions: GetTankHistoriesOptions = {
+  ...getHistoriesDefaultOptions,
+  tankId: undefined,
+};
+
+export default async function getTankHistories(
+  server: BlitzServer,
+  id: number,
+  options?: Partial<GetTankHistoriesOptions>,
+) {
+  const mergedOptions = { ...getTankHistoriesDefaultOptions, ...options };
+  const tankHistoriesResponse = await fetch(
+    `https://www.blitzstars.com/api/tankhistories/for/${id}/`,
+  );
+  const tankHistories = (
+    (await tankHistoriesResponse.json()) as TankHistoriesRaw
+  ).map(
+    (history) =>
+      ({
+        all: history.all,
+        last_battle_time: history.last_battle_time,
+        tank_id: history.tank_id,
+      } satisfies TankHistory),
+  );
+  const compliantTanks: number[] = [];
+  const lastBattles: Record<number, number> = {};
+  const lastNonCompliantIndex: Record<number, number> = {};
+  const hasCompliedOnce: Record<number, boolean> = {};
+  const filtered = tankHistories.filter(
+    ({ last_battle_time, tank_id, all: { battles } }, index) => {
+      const complies =
+        last_battle_time >= mergedOptions.start &&
+        last_battle_time <= mergedOptions.end &&
+        (mergedOptions.tankId === undefined ||
+          tank_id === mergedOptions.tankId);
+
+      if (complies && !hasCompliedOnce[tank_id]) {
+        hasCompliedOnce[tank_id] = true;
+        compliantTanks.push(tank_id);
+      }
+      if (!hasCompliedOnce[tank_id]) lastNonCompliantIndex[tank_id] = index;
+      lastBattles[tank_id] = battles;
+
+      return complies;
+    },
+  );
+
+  const latestNodes: TankHistories = [];
+
+  if (mergedOptions.includeLatestHistories) {
+    (await getTankStats(server, id)).forEach((tankHistory) => {
+      if (
+        tankHistory.all.battles > (lastBattles[tankHistory.tank_id] ?? 0) &&
+        (mergedOptions.tankId === undefined ||
+          tankHistory.tank_id === mergedOptions.tankId)
+      ) {
+        if (!hasCompliedOnce[tankHistory.tank_id]) {
+          // was played today for the first time... I think???
+          hasCompliedOnce[tankHistory.tank_id] = true;
+          compliantTanks.push(tankHistory.tank_id);
+        }
+        latestNodes.push(tankHistory);
+      }
+    });
+  }
+
+  const previousNodes: TankHistories = [];
+
+  if (mergedOptions.includePreviousHistories) {
+    compliantTanks.forEach((tankId) => {
+      if (tankId in lastNonCompliantIndex) {
+        previousNodes.push(
+          tankHistories[lastNonCompliantIndex[tankId]] ??
+            ({
+              all: emptyAllStats,
+              last_battle_time: -Infinity,
+              tank_id: tankId,
+            } satisfies TankHistory),
+        );
+      }
+    });
+  }
+
+  return [...previousNodes, ...filtered, ...latestNodes] satisfies Histories;
+}

src/core/blitzstars/getTankStatsDiffed.ts

@@ -1,16 +1,9 @@
-import { CacheType, ChatInputCommandInteraction } from 'discord.js';
 import { BlitzServer } from '../../constants/servers.js';
 import { AllStats } from '../../types/accountInfo.js';
-import getTankStats from '../blitz/getTankStats.js';
-
-export interface TankHistoryNode {
-  all: AllStats;
-  last_battle_time: number;
-  mark_of_mastery: number;
-  battle_life_time: number;
-  account_id: number;
-  tank_id: number;
-}
+import getTankHistories, {
+  TankHistories,
+  TankHistoryRaw,
+} from './getTankHistories.js';
 
 export const emptyAllStats: AllStats = {
   battles: 0,
@@ -32,7 +25,7 @@ export const emptyAllStats: AllStats = {
   wins: 0,
 };
 
-export const emptyTankHistoryNode: TankHistoryNode = {
+export const emptyTankHistoryNode: TankHistoryRaw = {
   account_id: 0,
   battle_life_time: 0,
   last_battle_time: 0,
@@ -41,24 +34,18 @@ export const emptyTankHistoryNode: TankHistoryNode = {
   all: emptyAllStats,
 };
 
-export type TankHistory = TankHistoryNode[];
-
-export default async function getTankStatsOverTime(
-  interaction: ChatInputCommandInteraction<CacheType>,
+export default async function getTankStatsDiffed(
   server: BlitzServer,
   id: number,
   start: number,
   end: number,
 ) {
-  const latestTankStatsRaw = await getTankStats(interaction, server, id);
-  const tankHistoriesResponse = await fetch(
-    `https://www.blitzstars.com/api/tankhistories/for/${id}/`,
-  );
-  const tankHistories = (await tankHistoriesResponse.json()) as TankHistory;
-  const history = [...tankHistories, ...latestTankStatsRaw];
+  const history = await getTankHistories(server, id, {
+    includeLatestHistories: true,
+  });
 
   // sort them even though most won't be used
-  const tankSortedHistory: Record<number, TankHistory> = {};
+  const tankSortedHistory: Record<number, TankHistories> = {};
   const tankIds: number[] = [];
   history.forEach((node) => {
     if (!tankSortedHistory[node.tank_id]) {

src/core/blitzstars/getTimeDaysAgo.ts

@@ -0,0 +1,12 @@
+export default function getTimeDaysAgo(daysAgo: number) {
+  const now = new Date();
+  now.setHours(5, 0, 0, 0);
+
+  // if it's after 5:00 AM today, subtract one day
+  if (now.getTime() > Date.now()) now.setDate(now.getDate() - 1);
+
+  // subtract the period number of days from now
+  now.setDate(now.getDate() - daysAgo);
+
+  return now.getTime() / 1000;
+}

src/core/blitzstars/last5AM.ts

@@ -1,11 +0,0 @@
-export default function last5AM() {
-  const fiveAM = new Date();
-  fiveAM.setHours(5, 0, 0, 0); // Set the time to 5:00 AM today
-
-  if (fiveAM > new Date()) {
-    // If it's now before 5:00 AM, go back one day
-    fiveAM.setDate(fiveAM.getDate() - 1);
-  }
-
-  return fiveAM;
-}

src/core/blitzstars/playerAverage.ts

@@ -1,5 +1,5 @@
 import sumStats from '../blitz/sumStats.js';
-import { emptyAllStats } from './getTankStatsOverTime.js';
+import { emptyAllStats } from './getTankStatsDiffed.js';
 import { tankAverages } from './tankAverages.js';
 
 console.log('Calculating player average...');

src/core/blitzstars/poweredByBlitzStars.ts

@@ -1,8 +0,0 @@
-import { EmbedBuilder } from 'discord.js';
-
-export default function poweredByBlitzStars(embed: EmbedBuilder) {
-  return embed.setTimestamp().setFooter({
-    text: 'Powered by BlitzStars',
-    iconURL: 'https://www.blitzstars.com/assets/images/TankyMcPewpew.png',
-  });
-}

src/core/blitzstars/tankAverages.ts

@@ -1,3 +1,5 @@
+import { readFileSync } from 'fs';
+import { join } from 'path';
 import { AllStats } from '../../types/accountInfo.js';
 
 export interface SpecialStats {
@@ -78,14 +80,8 @@ export interface IndividualTankAverage {
   last_update: number;
 }
 
-export const tankAverages: Record<number, IndividualTankAverage> = {};
+export type TankAverages = Record<number, IndividualTankAverage>;
 
-console.log('Caching tank averages...');
-fetch('https://www.blitzstars.com/api/tankaverages.json')
-  .then((response) => response.json() as Promise<IndividualTankAverage[]>)
-  .then((individualTankAverages) => {
-    individualTankAverages.forEach((individualTankAverage) => {
-      tankAverages[individualTankAverage.tank_id] = individualTankAverage;
-    });
-    console.log('Tank averages cached');
-  });
+export const tankAverages = JSON.parse(
+  readFileSync(join(__dirname, 'tankaverages.json')) as unknown as string,
+) as TankAverages;

src/core/discord/addPeriodSubCommands.ts

@@ -0,0 +1,52 @@
+import {
+  SlashCommandSubcommandBuilder,
+  SlashCommandSubcommandGroupBuilder,
+} from 'discord.js';
+import { PERIOD_NAMES } from '../discord/resolvePeriodFromCommand.js';
+
+export type Period = 'today' | '30' | '60' | '90' | 'career' | 'custom';
+
+export default function addPeriodSubCommands(
+  option: SlashCommandSubcommandGroupBuilder,
+  extra: (
+    option: SlashCommandSubcommandBuilder,
+  ) => SlashCommandSubcommandBuilder = (option) => option,
+) {
+  return option
+    .addSubcommand((option) =>
+      extra(option.setName('today').setDescription(PERIOD_NAMES.today)),
+    )
+    .addSubcommand((option) =>
+      extra(option.setName('30').setDescription(PERIOD_NAMES[30])),
+    )
+    .addSubcommand((option) =>
+      extra(option.setName('60').setDescription(PERIOD_NAMES[60])),
+    )
+    .addSubcommand((option) =>
+      extra(option.setName('90').setDescription(PERIOD_NAMES[90])),
+    )
+    .addSubcommand((option) =>
+      extra(option.setName('career').setDescription(PERIOD_NAMES.career)),
+    )
+    .addSubcommand((option) =>
+      extra(
+        option
+          .setName('custom')
+          .setDescription(PERIOD_NAMES.custom)
+          .addIntegerOption((option) =>
+            option
+              .setName('start')
+              .setDescription('Start of period in days ago from today')
+              .setMinValue(0)
+              .setRequired(true),
+          )
+          .addIntegerOption((option) =>
+            option
+              .setName('end')
+              .setDescription('End of period in days ago from today')
+              .setMinValue(0)
+              .setRequired(true),
+          ),
+      ),
+    );
+}

src/core/discord/addStatTypeSubCommandGroups.ts

@@ -0,0 +1,26 @@
+import { SlashCommandBuilder } from 'discord.js';
+import addPeriodSubCommands from './addPeriodSubCommands.js';
+import addTankChoices from './addTankChoices.js';
+import addUsernameChoices from './addUsernameChoices.js';
+
+export default function addStatTypeSubCommandGroups(
+  option: SlashCommandBuilder,
+) {
+  return option
+    .addSubcommandGroup((option) =>
+      addPeriodSubCommands(option, (option) =>
+        option.addStringOption(addUsernameChoices),
+      )
+        .setName('player')
+        .setDescription("Player's statistics"),
+    )
+    .addSubcommandGroup((option) =>
+      addPeriodSubCommands(option, (option) =>
+        option
+          .addStringOption(addTankChoices)
+          .addStringOption(addUsernameChoices),
+      )
+        .setName('tank')
+        .setDescription("Tank's statistics"),
+    );
+}

src/core/discord/addUsernameChoices.ts

@@ -0,0 +1,10 @@
+import { SlashCommandStringOption } from 'discord.js';
+
+export default function addUsernameChoices(option: SlashCommandStringOption) {
+  return option
+    .setName('username')
+    .setDescription(
+      'The username you use in Blitz (inferred from Discord nickname by default)',
+    )
+    .setAutocomplete(true);
+}

src/core/discord/autocompleteClan.ts

@@ -4,14 +4,14 @@ import {
   CacheType,
 } from 'discord.js';
 import { BLITZ_SERVERS } from '../../constants/servers.js';
-import listClansPanServer from '../blitz/listClansPanServer.js';
+import listClans from '../blitz/listClans.js';
 
-export default async function clanAutocomplete(
+export default async function autocompleteClan(
   interaction: AutocompleteInteraction<CacheType>,
 ) {
   const focusedOption = interaction.options.getFocused(true);
   if (focusedOption.name !== 'clan') return;
-  const players = await listClansPanServer(focusedOption.value);
+  const players = await listClans(focusedOption.value);
 
   await interaction.respond(
     players

src/core/discord/autocompleteTanks.ts

@@ -7,7 +7,7 @@ import { go } from 'fuzzysort';
 import resolveTankName from '../blitz/resolveTankName.js';
 import { TANKS } from '../blitz/tankopedia.js';
 
-export default async function tanksAutocomplete(
+export default async function autocompleteTanks(
   interaction: AutocompleteInteraction<CacheType>,
 ) {
   const focusedOption = interaction.options.getFocused(true);

src/core/discord/autocompleteUsername.ts

@@ -4,14 +4,14 @@ import {
   CacheType,
 } from 'discord.js';
 import { BLITZ_SERVERS } from '../../constants/servers.js';
-import listAccountsPanServer from '../blitz/listAccountsPanServer.js';
+import listPlayers from '../blitz/listPlayers.js';
 
-export default async function usernameAutocomplete(
+export default async function autocompleteUsername(
   interaction: AutocompleteInteraction<CacheType>,
 ) {
   const focusedOption = interaction.options.getFocused(true);
   if (focusedOption.name !== 'username') return;
-  const players = await listAccountsPanServer(focusedOption.value);
+  const players = await listPlayers(focusedOption.value);
 
   try {
     await interaction.respond(

src/core/discord/embedInfo.ts

@@ -1,7 +1,7 @@
 import { EmbedBuilder } from 'discord.js';
 import { ACCENT_COLOR } from '../../constants/colors.js';
 
-export default function infoEmbed(title: string, description: string) {
+export default function embedInfo(title: string, description: string) {
   return new EmbedBuilder()
     .setColor(ACCENT_COLOR)
     .setTitle(title)

src/core/discord/embedNegative.ts

@@ -1,7 +1,7 @@
 import { EmbedBuilder } from 'discord.js';
 import { NEGATIVE_COLOR } from '../../constants/colors.js';
 
-export default function negativeEmbed(title: string, description: string) {
+export default function embedNegative(title: string, description: string) {
   return new EmbedBuilder()
     .setColor(NEGATIVE_COLOR)
     .setTitle(title)

src/core/discord/embedPositive.ts

@@ -1,7 +1,7 @@
 import { EmbedBuilder } from 'discord.js';
 import { POSITIVE_COLOR } from '../../constants/colors.js';
 
-export default function positiveEmbed(title: string, description: string) {
+export default function embedPositive(title: string, description: string) {
   return new EmbedBuilder()
     .setColor(POSITIVE_COLOR)
     .setTitle(title)

src/core/discord/embedWarning.ts

@@ -1,7 +1,7 @@
 import { EmbedBuilder } from 'discord.js';
 import { WARNING_COLOR } from '../../constants/colors.js';
 
-export default function warningEmbed(title: string, description: string) {
+export default function embedWarning(title: string, description: string) {
   return new EmbedBuilder()
     .setColor(WARNING_COLOR)
     .setTitle(title)

src/core/discord/interactionToURL.ts

@@ -0,0 +1,33 @@
+import {
+  CacheType,
+  ChatInputCommandInteraction,
+  CommandInteractionOption,
+} from 'discord.js';
+
+export interface Parameters {
+  [key: string]: CommandInteractionOption['value'] | undefined | null;
+}
+
+export default function interactionToURL(
+  interaction: ChatInputCommandInteraction<CacheType>,
+  parameters?: Parameters,
+) {
+  const pathname = [
+    interaction.commandName,
+    interaction.options.getSubcommandGroup(false),
+    interaction.options.getSubcommand(false),
+  ]
+    .filter(Boolean)
+    .join('/');
+  const params = [
+    ...interaction.options.data.map(
+      (option) => [option.name, option.value] as const,
+    ),
+    ...Object.entries(parameters ?? {}),
+  ]
+    .filter(([, value]) => value !== undefined && value !== null)
+    .map(([key, value]) => `${key}=${value}`)
+    .join('&');
+
+  return `${pathname}${params.length > 0 ? `?${params}` : ''}`;
+}

src/core/discord/linkButton.ts

@@ -0,0 +1,20 @@
+import {
+  ButtonBuilder,
+  ButtonStyle,
+  ComponentEmojiResolvable,
+} from 'discord.js';
+
+export default function linkButton(
+  url: string,
+  label: string,
+  emoji?: ComponentEmojiResolvable,
+) {
+  const button = new ButtonBuilder()
+    .setStyle(ButtonStyle.Link)
+    .setURL(url)
+    .setLabel(label);
+
+  if (emoji) button.setEmoji(emoji);
+
+  return button;
+}

src/core/discord/markdownTable.ts

@@ -1,7 +1,7 @@
 export type TableInputEntry = [string, string | number] | [];
 export type TableInput = TableInputEntry[];
 
-export default function cleanTable(input: TableInput) {
+export default function markdownTable(input: TableInput) {
   return input
     .filter((array) => array[1] !== undefined)
     .map((array) => (array.length === 0 ? '' : `**${array[0]}**: ${array[1]}`))

src/core/discord/normalizeInteractionReturnable.ts

@@ -0,0 +1,40 @@
+import {
+  ActionRowBuilder,
+  ButtonBuilder,
+  EmbedBuilder,
+  InteractionEditReplyOptions,
+} from 'discord.js';
+import { InteractionReturnable } from '../../events/interactionCreate/index.js';
+import jsxToPng from '../node/jsxToPng.js';
+
+export default async function normalizeInteractionReturnable(
+  returnable: InteractionReturnable,
+) {
+  const reply: InteractionEditReplyOptions = {};
+
+  const awaitedReturnable = await returnable;
+  const normalizedReturnable = Array.isArray(awaitedReturnable)
+    ? awaitedReturnable
+    : [awaitedReturnable];
+
+  await Promise.all(
+    normalizedReturnable.map(async (item) => {
+      if (item instanceof EmbedBuilder) {
+        if (!reply.embeds) reply.embeds = [];
+        reply.embeds.push(item);
+      } else if (item instanceof ButtonBuilder) {
+        if (!reply.components)
+          reply.components = [new ActionRowBuilder<ButtonBuilder>()];
+        (reply.components[0] as ActionRowBuilder<ButtonBuilder>).addComponents(
+          item,
+        );
+      } else {
+        const image = await jsxToPng(item);
+        if (!reply.files) reply.files = [];
+        reply.files.push(image);
+      }
+    }),
+  );
+
+  return reply;
+}

src/core/discord/primaryButton.ts

@@ -0,0 +1,20 @@
+import {
+  ButtonBuilder,
+  ButtonStyle,
+  ComponentEmojiResolvable,
+} from 'discord.js';
+
+export default function primaryButton(
+  id: string,
+  label: string,
+  emoji?: ComponentEmojiResolvable,
+) {
+  const button = new ButtonBuilder()
+    .setCustomId(id)
+    .setStyle(ButtonStyle.Primary)
+    .setLabel(label);
+
+  if (emoji) button.setEmoji(emoji);
+
+  return button;
+}

src/core/discord/psa.ts

@@ -4,10 +4,10 @@ export interface PSAData {
 }
 
 export interface PSA {
-  data?: PSAData;
+  data: PSAData | null;
 }
 
-export const psa: PSA = {};
+export const psa: PSA = { data: null };
 
 console.log('Caching PSA...');
 fetch(

src/core/discord/resolvePeriodFromButton.ts

@@ -0,0 +1,9 @@
+import { ButtonInteraction, CacheType } from 'discord.js';
+import { CYCLIC_API } from '../../constants/cyclic.js';
+import resolvePeriodFromURL from '../express/resolvePeriodFromURL.js';
+
+export default function resolvePeriodFromButton(
+  interaction: ButtonInteraction<CacheType>,
+) {
+  return resolvePeriodFromURL(`${CYCLIC_API}/${interaction.customId}`);
+}

src/core/discord/resolvePeriodFromCommand.ts

@@ -0,0 +1,64 @@
+import { CacheType, ChatInputCommandInteraction } from 'discord.js';
+import getPeriodNow from '../blitzstars/getPeriodNow.js';
+import getPeriodStart from '../blitzstars/getPeriodStart.js';
+import getTimeDaysAgo from '../blitzstars/getTimeDaysAgo.js';
+import { Period } from '../discord/addPeriodSubCommands.js';
+
+export const PERIOD_NAMES: Record<Period, string> = {
+  today: "Today's statistics",
+  30: "30 days' statistics",
+  60: "60 days' statistics",
+  90: "90 days' statistics",
+  career: 'Career statistics',
+  custom: 'Custom period',
+};
+
+export const EVOLUTION_PERIOD_NAMES: Record<Period, string> = {
+  today: "Today's evolution",
+  30: "30 days' evolution",
+  60: "60 days' evolution",
+  90: "90 days' evolution",
+  career: 'Career evolution',
+  custom: 'Custom period',
+};
+
+export interface ResolvedPeriod {
+  statsName: string;
+  evolutionName: string;
+  start: number;
+  end: number;
+}
+
+export default function resolvePeriodFromCommand(
+  interaction: ChatInputCommandInteraction<CacheType>,
+) {
+  let statsName: string;
+  let evolutionName: string;
+  let start: number;
+  let end: number;
+  const period = interaction.options.getSubcommand() as Period;
+
+  if (period === 'custom') {
+    const startRaw = interaction.options.getInteger('start')!;
+    const endRaw = interaction.options.getInteger('end')!;
+    const startMin = Math.min(startRaw, endRaw);
+    const endMax = Math.max(startRaw, endRaw);
+
+    statsName = `${startMin} to ${endMax} days' statistics`;
+    evolutionName = `${startMin} to ${endMax} days' evolution`;
+    start = getTimeDaysAgo(startMin);
+    end = getTimeDaysAgo(endMax);
+  } else {
+    statsName = PERIOD_NAMES[period];
+    evolutionName = EVOLUTION_PERIOD_NAMES[period];
+    start = getPeriodStart(period);
+    end = getPeriodNow();
+  }
+
+  return {
+    statsName,
+    evolutionName,
+    start,
+    end,
+  } satisfies ResolvedPeriod;
+}

src/core/discord/resolvePlayerFromButton.ts

@@ -0,0 +1,9 @@
+import { ButtonInteraction, CacheType } from 'discord.js';
+import { CYCLIC_API } from '../../constants/cyclic.js';
+import resolvePlayerFromURL from '../express/resolvePlayerFromURL.js';
+
+export default async function resolvePlayerFromButton(
+  interaction: ButtonInteraction<CacheType>,
+) {
+  return resolvePlayerFromURL(`${CYCLIC_API}/${interaction.customId}`);
+}

src/core/discord/resolvePlayerFromCommand.ts

@@ -1,13 +1,18 @@
 import { CacheType, ChatInputCommandInteraction } from 'discord.js';
 import { BlitzServer } from '../../constants/servers.js';
-import errorWithCause from '../process/errorWithCause.js';
-import listAccountsPanServer, {
+import listPlayers, {
   usernamePatternWithoutPosition,
-} from './listAccountsPanServer.js';
+} from '../blitz/listPlayers.js';
+import throwError from '../node/throwError.js';
 
 export const serverAndIdPattern = /(com|eu|asia)\/[0-9]+/;
 
-export default async function getBlitzAccount(
+export interface ResolvedPlayer {
+  server: BlitzServer;
+  id: number;
+}
+
+export default async function resolvePlayerFromCommand(
   interaction: ChatInputCommandInteraction<CacheType>,
 ) {
   const commandUsername = interaction.options.getString('username');
@@ -17,7 +22,7 @@ export default async function getBlitzAccount(
   const username = commandUsername ?? displayName;
 
   if (username === undefined) {
-    throw errorWithCause(
+    throw throwError(
       'Username could not be inferred',
       "You didn't provide me a username in the command nor was I able to infer your Blitz username from your Discord nickname. Try providing a username manually in the command or using the `/verify` command to set your Discord nickname to your Blitz username.",
     );
@@ -25,14 +30,20 @@ export default async function getBlitzAccount(
 
   if (serverAndIdPattern.test(username)) {
     const [server, accountId] = username.split('/');
-    return { server: server as BlitzServer, id: Number(accountId) };
+    return {
+      server: server as BlitzServer,
+      id: Number(accountId),
+    } satisfies ResolvedPlayer;
   } else {
-    const accounts = await listAccountsPanServer(username);
+    const accounts = await listPlayers(username);
 
     if (accounts[0]) {
-      return { server: accounts[0].server, id: accounts[0].account_id };
+      return {
+        server: accounts[0].server,
+        id: accounts[0].account_id,
+      } satisfies ResolvedPlayer;
     } else {
-      throw errorWithCause(
+      throw throwError(
         'Could not find user',
         `I couldn't find user \`${username}\`. Try providing a valid username manually or using the \`/verify\` command to set your Discord nickname to your Blitz username.`,
       );

src/core/discord/supportBlitzStars.ts

@@ -1,5 +1,6 @@
 import { ButtonBuilder, ButtonStyle } from 'discord.js';
 
+// TODO: ADD THIS AGAIN IMMEDIATELY
 export const supportBlitzStars = new ButtonBuilder()
   .setLabel('Support BlitzStars')
   .setURL('https://www.blitzstars.com/supporters')

src/core/express/normalizeRouteReturnable.ts

@@ -0,0 +1,11 @@
+import { RouteReturnable } from '../../server.js';
+import jsxToSvg from '../node/jsxToSvg.js';
+
+export default async function normalizeRouteReturnable(
+  returnable: RouteReturnable,
+) {
+  const awaitedReturnable = await returnable;
+  const svg = await jsxToSvg(awaitedReturnable);
+
+  return svg;
+}

src/core/express/resolvePeriodFromRequest.ts

@@ -0,0 +1,7 @@
+import { Request } from 'express';
+import { CYCLIC_API } from '../../constants/cyclic.js';
+import resolvePeriodFromURL from './resolvePeriodFromURL.js';
+
+export default function resolvePeriodFromRequest(request: Request) {
+  return resolvePeriodFromURL(`${CYCLIC_API}${request.path}`);
+}

src/core/express/resolvePeriodFromURL.ts

@@ -0,0 +1,43 @@
+import getPeriodNow from '../blitzstars/getPeriodNow.js';
+import getPeriodStart from '../blitzstars/getPeriodStart.js';
+import getTimeDaysAgo from '../blitzstars/getTimeDaysAgo.js';
+import { Period } from '../discord/addPeriodSubCommands.js';
+import {
+  EVOLUTION_PERIOD_NAMES,
+  PERIOD_NAMES,
+  ResolvedPeriod,
+} from '../discord/resolvePeriodFromCommand.js';
+
+export default function resolvePeriodFromURL(urlString: string) {
+  let statsName: string;
+  let evolutionName: string;
+  let start: number;
+  let end: number;
+  const url = new URL(urlString);
+  const path = url.pathname.split('/').filter(Boolean);
+  const period = path[path.length - 1] as Period;
+
+  if (period === 'custom') {
+    const startRaw = parseInt(url!.searchParams.get('start')!);
+    const endRaw = parseInt(url!.searchParams.get('end')!);
+    const startMin = Math.min(startRaw, endRaw);
+    const endMax = Math.max(startRaw, endRaw);
+
+    statsName = `${startMin} to ${endMax} days' statistics`;
+    evolutionName = `${startMin} to ${endMax} days' evolution`;
+    start = getTimeDaysAgo(startMin);
+    end = getTimeDaysAgo(endMax);
+  } else {
+    statsName = PERIOD_NAMES[period];
+    evolutionName = EVOLUTION_PERIOD_NAMES[period];
+    start = getPeriodStart(period);
+    end = getPeriodNow();
+  }
+
+  return {
+    statsName,
+    evolutionName,
+    start,
+    end,
+  } satisfies ResolvedPeriod;
+}

src/core/express/resolvePlayerFromRequest.ts

@@ -0,0 +1,7 @@
+import { Request } from 'express';
+import { CYCLIC_API } from '../../constants/cyclic.js';
+import resolvePlayerFromURL from './resolvePlayerFromURL.js';
+
+export default function resolvePlayerFromRequest(request: Request) {
+  return resolvePlayerFromURL(`${CYCLIC_API}${request.originalUrl}`);
+}

src/core/express/resolvePlayerFromURL.ts

@@ -0,0 +1,11 @@
+import { BlitzServer } from '../../constants/servers.js';
+import { ResolvedPlayer } from '../discord/resolvePlayerFromCommand.js';
+
+export default function resolvePlayerFromURL(urlString: string) {
+  const url = new URL(urlString);
+
+  return {
+    id: parseInt(url.searchParams.get('id')!),
+    server: url.searchParams.get('server') as BlitzServer,
+  } satisfies ResolvedPlayer;
+}

src/core/express/withAutoRefresh.ts

@@ -0,0 +1,23 @@
+export default function withAutoRefresh(svg: string, refreshAfter: number) {
+  return `
+    <html>
+      <head>
+        <script>
+          setTimeout(() => {
+            window.location.reload();
+          }, ${refreshAfter});
+        </script>
+
+        <style>
+          body {
+            margin: 0;
+          }
+        </style>
+      </head>
+
+      <body>
+        ${svg}
+      </body>
+    </html>
+  `;
+}

src/core/interaction/cmdName.ts

@@ -1,5 +0,0 @@
-import isDev from '../process/isDev.js';
-
-export default function cmdName(name: string) {
-  return isDev() ? `${name}dev` : name;
-}

src/core/interaction/fullBlitzStarsStats.ts

@@ -1,12 +0,0 @@
-import { ButtonBuilder, ButtonStyle } from 'discord.js';
-import { BlitzServer } from '../../constants/servers.js';
-
-export default function fullBlitzStarsStats(
-  server: BlitzServer,
-  username: string,
-) {
-  return new ButtonBuilder()
-    .setLabel('View on BlitzStars')
-    .setURL(`https://www.blitzstars.com/player/${server}/${username}`)
-    .setStyle(ButtonStyle.Link);
-}

src/core/interaction/noMember.ts

@@ -1,6 +0,0 @@
-import negativeEmbed from './negativeEmbed.js';
-
-export const noMember = negativeEmbed(
-  'User of command is not a member',
-  'Discord claims that the user of this command does not have an account... strange!',
-);

src/core/interaction/notTrackedByBlitzStars.ts

@@ -1,6 +0,0 @@
-import negativeEmbed from './negativeEmbed.js';
-
-export const notTrackedByBlitzStars = negativeEmbed(
-  'No data to display',
-  'Player is not tracked by BlitzStars.',
-);

src/core/node/hslToHex.ts

@@ -0,0 +1,22 @@
+const numberRegex = /\d+(\.\d+)?/g;
+
+/**
+ * Thanks to icl7126!
+ * https://stackoverflow.com/a/44134328/12294756
+ */
+export default function hslToHex(hsl: string) {
+  let [h, s, l] = Array.from(hsl.matchAll(numberRegex)).map((m) =>
+    parseFloat(m[0]),
+  );
+
+  l /= 100;
+  const a = (s * Math.min(l, 1 - l)) / 100;
+  const f = (n: number) => {
+    const k = (n + h / 30) % 12;
+    const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+    return Math.round(255 * color)
+      .toString(16)
+      .padStart(2, '0'); // convert to Hex and prefix "0" if needed
+  };
+  return `#${f(0)}${f(8)}${f(4)}`;
+}