feat: server side strings

packages/website-ue/src/components/HomeHero.astro

@@ -1,10 +1,17 @@
 ---
 import { MagnifyingGlassIcon } from "@radix-ui/react-icons";
+import { api } from "../core/api/dynamic";
 import { BlitzKitIcon } from "../icons/BlitzKit";
 import { Code } from "./Code";
 import { TextField } from "./TextField";
 
-const strings = { home: { search: "test" } };
+interface Props {
+  locale: string;
+}
+
+const { locale } = Astro.props;
+
+const strings = await api.strings(locale);
 ---
 
 <style>
@@ -39,7 +46,10 @@ const strings = { home: { search: "test" } };
         width: 100%;
         height: 100%;
 
-        background: linear-gradient(transparent, var(--gray-1));
+        background: linear-gradient(
+          color-mix(in srgb, transparent 50%, var(--gray-1)),
+          var(--gray-1)
+        );
       }
     }
 

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

@@ -1,15 +1,42 @@
 import type { CatalogItemAccessor } from "@blitzkit/closed";
+import type { Strings } from "@blitzkit/i18n";
+import locales from "@blitzkit/i18n/locales.json";
+import type { Tank } from "../../protos/tank";
+import type { TankList } from "../../protos/tank_list";
+import type { Tanks } from "../../protos/tanks";
 
 export abstract class AbstractAPI {
   abstract tanks(): Promise<Tanks>;
 
   abstract tankList(): Promise<TankList>;
 
-  abstract strings(
+  abstract _strings(locale: string): Promise<Strings>;
+  abstract _gameStrings(
     locale: string,
-    prefix?: string
+    prefix: string
   ): Promise<Record<string, string>>;
 
+  private assertLocale(locale: string) {
+    const supported = locales.supported.find(
+      (supported) => supported.locale === locale
+    );
+
+    if (supported === undefined) {
+      throw new Error(`Unsupported locale: ${locale}`);
+    }
+
+    return supported;
+  }
+  async strings(locale: string) {
+    this.assertLocale(locale);
+    return await this._strings(locale);
+  }
+  async gameStrings(locale: string, prefix: string) {
+    const supported = this.assertLocale(locale);
+    const blitz = supported.blitz ?? supported.locale;
+    return await this._gameStrings(blitz, prefix);
+  }
+
   abstract tank(id: string): Promise<Tank>;
 
   abstract avatars(): Promise<CatalogItemAccessor[]>;

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

@@ -1,6 +1,9 @@
 import type { MetadataAccessor } from "@blitzkit/closed";
-import { sluggify } from "@blitzkit/core";
+import { sluggify, type DeepPartial } from "@blitzkit/core";
+import type { Strings } from "@blitzkit/i18n";
+import locales from "@blitzkit/i18n/locales.json";
 import type { RemoteStorageComponent } from "@protos/blitz_static_remote_storage_component";
+import { merge } from "lodash-es";
 import { parse } from "yaml";
 import type { Tank } from "../../protos/tank";
 import type { TankList, TankListEntry } from "../../protos/tank_list";
@@ -11,6 +14,8 @@ if (typeof window !== "undefined") {
   throw new Error("ServerAPI is being evaluated in the browser");
 }
 
+const globbedStrings = import.meta.glob("../../../../i18n/strings/*.json");
+
 interface LocalizationConfig {
   namespaces: string[];
 }
@@ -20,7 +25,7 @@ export class ServerAPI extends AbstractAPI {
     super();
   }
 
-  async strings(locale: string) {
+  async _gameStrings(locale: string, prefix: string) {
     const group = this.metadata.group("ClientConfigsEntity");
 
     if (group.length !== 1) {
@@ -89,6 +94,26 @@ export class ServerAPI extends AbstractAPI {
       );
     }
 
+    const filtered: Record<string, string> = {};
+
+    for (const key in strings) {
+      if (key.startsWith(`${prefix}__`)) {
+        filtered[key] = strings[key];
+      }
+    }
+
+    return filtered;
+  }
+
+  async _strings(locale: string) {
+    const localized = (await globbedStrings[
+      `../../../../i18n/strings/${locale}.json`
+    ]()) as DeepPartial<Strings>;
+    const defaults = (await globbedStrings[
+      `../../../../i18n/strings/${locales.default}.json`
+    ]()) as Strings;
+    const strings = merge({}, defaults, localized);
+
     return strings;
   }
 
@@ -97,7 +122,7 @@ export class ServerAPI extends AbstractAPI {
     if (this._tankList === undefined) {
       const group = this.metadata.group("TankEntity");
       const list: TankListEntry[] = [];
-      const strings = await this.strings("en");
+      const strings = await this.gameStrings("en", "TankEntity");
 
       for (const item of group) {
         const tankCatalog = item.TankCatalog();

packages/website-ue/src/pages/[...locale]/index.astro

@@ -15,10 +15,12 @@ export const getStaticPaths = (() => {
     { params: { locale: undefined }, props: { locale: locales.default } },
   ];
 }) satisfies GetStaticPaths;
+
+const { locale } = Astro.props;
 ---
 
 <BaseLayout accent="amber">
-  <HomeHero />
+  <HomeHero {locale} />
 
   <h1>blitzkit {packageJson.version}</h1>