some equipment groundwork

packages/website-ue/src/api/abstract.ts

@@ -6,12 +6,14 @@ import type { AvatarList } from "@protos/avatar_list";
 import type { Avatars } from "@protos/avatars";
 import type { Background } from "@protos/background";
 import type { Backgrounds } from "@protos/backgrounds";
+import type { Consumables } from "@protos/consumables";
 import type { Equipment } from "@protos/equipment";
 import type { PopularTanks } from "@protos/popular_tanks";
 import type { Tank } from "@protos/tank";
 import type { TankList } from "@protos/tank_list";
 import type { TankUpgradePresets } from "@protos/tank_upgrade_presets";
 import type { Tanks } from "@protos/tanks";
+import type { TierPrices } from "@protos/tier_prices";
 import type { Tiers } from "@protos/tiers";
 
 export abstract class AbstractAPI {
@@ -27,6 +29,8 @@ export abstract class AbstractAPI {
 
   abstract tiers(): Promise<Tiers>;
   abstract equipment(): Promise<Equipment>;
+  abstract consumables(): Promise<Consumables>;
+  abstract tierPrices(): Promise<TierPrices>;
 
   abstract strings(locale: string): Promise<Strings>;
   abstract gameStrings(locale: string): Promise<Record<string, string>>;

packages/website-ue/src/api/client.ts

@@ -1,11 +1,13 @@
 import { fetchPB } from "@blitzkit/core";
 import type { Strings } from "@blitzkit/i18n";
 import { Avatars } from "@protos/avatars";
+import { Consumables } from "@protos/consumables";
 import { Equipment } from "@protos/equipment";
 import { PopularTanks } from "@protos/popular_tanks";
 import { TankList } from "@protos/tank_list";
 import { TankUpgradePresets } from "@protos/tank_upgrade_presets";
 import { Tanks } from "@protos/tanks";
+import { TierPrices } from "@protos/tier_prices";
 import { Tiers } from "@protos/tiers";
 import { AbstractAPI, Cache } from "./abstract";
 
@@ -59,6 +61,16 @@ export class ClientAPI extends AbstractAPI {
     return fetchPB("/api/equipment.pb", Equipment);
   }
 
+  @Cache()
+  consumables() {
+    return fetchPB("/api/consumables.pb", Consumables);
+  }
+
+  @Cache()
+  tierPrices() {
+    return fetchPB("/api/tier-prices.pb", TierPrices);
+  }
+
   @Cache()
   async strings(locale: string) {
     const response = await fetch(`/api/strings/${locale}.json`);

packages/website-ue/src/api/server.ts

@@ -5,12 +5,14 @@ import locales from "@blitzkit/i18n/locales.json";
 import type { Avatar, DeepPartial } from "@protos/avatar";
 import type { Background } from "@protos/background";
 import type { RemoteStorageComponent } from "@protos/blitz_static_remote_storage_component";
+import { Consumables } from "@protos/consumables";
 import { Equipment } from "@protos/equipment";
 import type { PopularTanks } from "@protos/popular_tanks";
 import type { Tank } from "@protos/tank";
 import type { TankListEntry } from "@protos/tank_list";
 import { TankUpgradePresets } from "@protos/tank_upgrade_presets";
 import type { Tanks } from "@protos/tanks";
+import { TierPrices } from "@protos/tier_prices";
 import type { Tiers } from "@protos/tiers";
 import { existsSync } from "fs";
 import { mkdir, readFile, writeFile } from "fs/promises";
@@ -262,6 +264,36 @@ export class ServerAPI extends AbstractAPI {
     return equipment;
   }
 
+  @Cache()
+  async consumables() {
+    const consumables = Consumables.create();
+
+    for (const item of this.metadata.group("ConsumableEntity")) {
+      const purchase = item.BlitzStaticPurchase("purchasable");
+      const consumable = item.Consumable();
+      const compatibility = item.Compatibility();
+
+      consumables.consumables[item.id] = {
+        purchase,
+        consumable,
+        compatibility,
+      };
+    }
+
+    return consumables;
+  }
+
+  @Cache()
+  async tierPrices() {
+    const tierPrices = TierPrices.create();
+
+    for (const item of this.metadata.group("TierPricesEntity")) {
+      tierPrices.prices[item.id] = item.TierPrices();
+    }
+
+    return tierPrices;
+  }
+
   @Cache(true)
   async strings(locale: string) {
     const localized = (await globbedStrings[

packages/website-ue/src/components/TankopediaLoadout/index.tsx

@@ -19,11 +19,14 @@ import {
   maxModulesPerRow,
   originalLineName,
 } from "../../config/modules";
+import { useConsumables } from "../../hooks/useConsumables";
 import { useEquipment } from "../../hooks/useEquipment";
 import { useProtagonist } from "../../hooks/useProtagonist";
 import { useStrings } from "../../hooks/useStrings";
+import { useTierPrices } from "../../hooks/useTierPrices";
 import { useUpgradePreset } from "../../hooks/useUpgradePreset";
 import { Tankopedia } from "../../stores/tankopedia";
+import { isCompatible } from "../../tankopedia/isCompatible";
 import { Button } from "../Button";
 import { Heading } from "../Heading";
 import { Link } from "../Link";
@@ -43,10 +46,24 @@ export function TankopediaLoadout() {
     <Section>
       {showModules && <Modules />}
       <Equipment />
+      <Consumables />
     </Section>
   );
 }
 
+function Consumables() {
+  const consumables = useConsumables();
+  const tierPrices = useTierPrices();
+
+  return Object.values(consumables.consumables).map(
+    ({ compatibility, consumable }) => {
+      if (!isCompatible(compatibility!)) return null;
+
+      return <span>{consumable!.name_key}</span>;
+    },
+  );
+}
+
 function Equipment() {
   const strings = useStrings();
   const tank = useProtagonist();

packages/website-ue/src/hooks/useConsumables.ts

@@ -0,0 +1,7 @@
+import { api } from "../api/dynamic";
+import { useAwait } from "./useAwait";
+
+export function useConsumables() {
+  const consumables = useAwait(() => api.consumables(), "consumables");
+  return consumables;
+}

packages/website-ue/src/hooks/useTierPrices.ts

@@ -0,0 +1,7 @@
+import { api } from "../api/dynamic";
+import { useAwait } from "./useAwait";
+
+export function useTierPrices() {
+  const tierPrices = useAwait(() => api.tierPrices(), "tier-prices");
+  return tierPrices;
+}

packages/website-ue/src/pages/[api]/consumables.pb.ts

@@ -0,0 +1,9 @@
+import { Consumables } from "@protos/consumables";
+import { api } from "../../api/dynamic";
+
+export { getStaticPaths } from "./_index";
+
+export async function GET() {
+  const consumables = await api.consumables();
+  return new Response(Consumables.encode(consumables).finish());
+}

packages/website-ue/src/pages/[api]/tier-prices.pb.ts

@@ -0,0 +1,9 @@
+import { TierPrices } from "@protos/tier_prices";
+import { api } from "../../api/dynamic";
+
+export { getStaticPaths } from "./_index";
+
+export async function GET() {
+  const tierPrices = await api.tierPrices();
+  return new Response(TierPrices.encode(tierPrices).finish());
+}

packages/website-ue/src/tankopedia/isCompatible.ts

@@ -0,0 +1,7 @@
+import type { CompatibilityComponent } from "@protos/blitz_static_compatibility_component";
+
+export function isCompatible(compatibility: CompatibilityComponent) {
+  console.log(compatibility);
+
+  return true;
+}