npm - @voltro/cli - Versions diffs - 0.1.0 - Mend

@voltro/cli 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (626) hide show

package/templates/apps/frontend-docs/src/pages/layout.tsx ADDED Viewed

@@ -0,0 +1,66 @@
+// Root layout. Strategy B (URL-prefix i18n): an INNER <I18nProvider> reads
+// the locale FROM THE URL, so the pre-render pipeline resolves the right
+// catalog per locale-prefixed path (and client-side nav swaps it without a
+// full reload). The language switcher is plain <a> links — no JS needed, so
+// this stays compatible with the pages' `interactive: 'none'`.
+//
+// `<html>`/`<head>`/`<body>` are owned by the framework shell — don't render
+// them here. Page <title> + meta come from each page's `meta` export.
+import type { ReactNode } from 'react'
+import { I18nProvider, T } from '@voltro/i18n'
+import { useLocation } from '@voltro/web'
+import {
+  CATALOGS,
+  DEFAULT_LOCALE,
+  SUPPORTED_LOCALES,
+  stripLocalePrefix,
+  useUrlLocale,
+  withLocalePrefix,
+} from '../lib/locale'
+import '../globals.css'
+function TopNav(): ReactNode {
+  const locale = useUrlLocale()
+  // The path WITHOUT its locale prefix — so the language switch keeps you
+  // on the same doc (e.g. /de/docs/x → /docs/x, then re-prefix per locale).
+  const barePath = stripLocalePrefix(useLocation())
+  // Plain <a> (not <Link>): these hrefs are COMPUTED per locale, and
+  // <Link to> wants a statically-known `VoltroUrl` literal. Each language
+  // is its own crawlable URL, reached by a full navigation.
+  return (
+    <nav className="topnav">
+      <a href={withLocalePrefix('/', locale)}>
+        <T id="nav.home" />
+      </a>
+      <span className="spacer" />
+      <span className="lang">
+        <span className="label">
+          <T id="nav.language" />:
+        </span>
+        {SUPPORTED_LOCALES.map((code) => (
+          <a
+            key={code}
+            href={withLocalePrefix(barePath, code)}
+            aria-current={code === locale ? 'true' : undefined}
+          >
+            {code.toUpperCase()}
+          </a>
+        ))}
+      </span>
+    </nav>
+  )
+}
+export default function Layout({ children }: { readonly children: ReactNode }): ReactNode {
+  const locale = useUrlLocale()
+  return (
+    <I18nProvider locale={locale} messages={CATALOGS[locale]} defaultLocale={DEFAULT_LOCALE}>
+      <div className="shell">
+        <TopNav />
+        {children}
+      </div>
+    </I18nProvider>
+  )
+}

package/templates/apps/frontend-docs/template.json ADDED Viewed

@@ -0,0 +1,6 @@
+{
+  "id": "frontend-docs",
+  "kind": "web",
+  "summary": "Bilingual (en/de) documentation site: catch-all docs router (`docs/[...slug].tsx`), URL-prefix i18n with a [locale] mirror emitting the locale × slug cross-product, dynamic getStaticPaths so every doc page pre-renders per locale at build time.",
+  "tags": ["web", "frontend", "docs", "documentation", "static", "i18n", "intl", "localization"]
+}

package/templates/apps/frontend-docs/tsconfig.json ADDED Viewed

@@ -0,0 +1,11 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "lib": ["ES2024", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "moduleResolution": "Bundler"
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist", ".framework"]
+}

package/templates/apps/frontend-i18n/README.md ADDED Viewed

@@ -0,0 +1,61 @@
+# {{projectName}} / {{appName}}
+Voltro web app scaffold (template: **frontend-i18n**) — a bilingual
+(English + German) static site using the **URL-prefix** i18n strategy.
+## Boot
+```bash
+pnpm install
+pnpm --filter @{{projectName}}/{{appName}} dev
+# → http://localhost:{{port}}
+```
+## What this shows
+- **Typed catalogs** — `src/locales/en.ts` is the source of truth;
+  `src/locales/de.ts` uses `defineLocale<typeof en>()`, which fails
+  `tsc --noEmit` if a key is missing or extra. Translations can't drift.
+- **URL-prefix routing** — the default locale lives at the bare path
+  (`/`, `/about`); German is prefixed (`/de`, `/de/about`). Each
+  translated page is its own crawlable URL — good for SEO and
+  shareable language-specific links.
+- **Per-locale SSG** — `src/pages/[locale]/*.tsx` mirror every page and
+  enumerate the non-default locales via `getStaticPaths`. `voltro build`
+  emits one pre-rendered HTML file per (page × locale):
+  ```
+  .framework/dist/index.html        ← en (default, bare path)
+  .framework/dist/de/index.html     ← de mirror
+  .framework/dist/about/index.html  ← en
+  .framework/dist/de/about/index.html ← de mirror
+  ```
+- **Localised `<title>`** — each page's `meta` is a function of
+  `{ locale }`, so every variant's `<title>` / `<meta description>` is
+  in the right language in the pre-rendered HTML (a plain `meta` object
+  would leave the head English on `/de`).
+- **Client-side language switch** — the nav's URL-driven
+  `<I18nProvider>` (in `src/pages/layout.tsx`) swaps catalogs on
+  navigation between `/about` and `/de/about` without a full reload.
+## Add a locale
+1. Add the code to `SUPPORTED_LOCALES` in `src/lib/locale.ts` AND to
+   `locales` in `app.config.ts`.
+2. Add `src/locales/<code>.ts` (mirror `en.ts`; the type-check enforces
+   parity).
+3. Add it to `CATALOGS` in `src/lib/locale.ts`.
+The `[locale]` mirrors pick it up automatically — `getStaticPaths`
+reads `SUPPORTED_LOCALES`.
+## Add a page
+Create `src/pages/<name>.tsx` (default locale) **and** a one-line mirror
+`src/pages/[locale]/<name>.tsx` that re-exports it (copy
+`[locale]/about.tsx`). Without the mirror, only the default-locale URL
+is emitted.
+See AGENTS.md › *Internationalization (`@voltro/i18n`)* for the full
+reference, including the cookie-only strategy product dashboards use.

package/templates/apps/frontend-i18n/app.config.ts ADDED Viewed

@@ -0,0 +1,33 @@
+// Web app for the {{projectName}} project — a BILINGUAL static site.
+//
+// Strategy B (URL-prefix i18n): the default locale lives at the bare path
+// (`/`, `/about`) and every other locale is prefixed (`/de`, `/de/about`).
+// Each translated page is its own crawlable URL — better SEO + shareable
+// language-specific links. The other strategy (cookie-only, same URL for
+// every locale) is what product dashboards use; see AGENTS.md › i18n.
+//
+// `locales` here is load-bearing: it tells `voltro build` to pre-render a
+// per-locale HTML variant for every `[locale]/…` mirror page, each wrapped
+// in the right catalog's <I18nProvider>. Every code listed MUST have a
+// matching `src/locales/<code>.ts` or boot fails.
+import { defineEnv, envVar } from '@voltro/env'
+// Public, build-time env (baked into the bundle; read via `publicEnv`).
+// Never a secret here — a static site has no server to hide one.
+export const env = defineEnv({
+  VOLTRO_PUBLIC_SITE_NAME: envVar.string({ access: 'public', default: '{{capProjectName}}' }),
+})
+export default {
+  type: 'web' as const,
+  name: '{{capProjectName}}{{capAppName}}',
+  port: {{port}},
+  // Follow the visitor's OS theme, set before first paint (no flash).
+  theme: 'system' as const,
+  // The shipped catalogs. `defaultLocale` MUST be one of `locales`.
+  // Keep this in sync with SUPPORTED_LOCALES / DEFAULT_LOCALE in
+  // src/lib/locale.ts — that file drives the [locale] mirror routing.
+  locales:       ['en', 'de'] as const,
+  defaultLocale: 'en'         as const,
+  env,
+}

package/templates/apps/frontend-i18n/package.json ADDED Viewed

@@ -0,0 +1,28 @@
+{
+  "name": "@{{projectName}}/{{appName}}",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "voltro dev .",
+    "build": "voltro build .",
+    "start": "voltro start .",
+    "typecheck": "tsc --noEmit",
+    "test": "voltro test"
+  },
+  "dependencies": {
+    "@voltro/cli": "0.1.0",
+    "@voltro/client": "0.1.0",
+    "@voltro/env": "0.1.0",
+    "@voltro/i18n": "0.1.0",
+    "@voltro/web": "0.1.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "typescript": "^5.7.0",
+    "vitest": "^3.0.0"
+  }
+}

package/templates/apps/frontend-i18n/src/globals.css ADDED Viewed

@@ -0,0 +1,46 @@
+/* Plain CSS — no Tailwind, so there's no @source scanner to configure.
+   Swap in @voltro/ui-shadcn or Tailwind later if you want; see AGENTS.md. */
+:root {
+  --bg: #ffffff;
+  --fg: #0a0a0a;
+  --muted: #6b7280;
+  --accent: #4f46e5;
+  --border: #e5e7eb;
+}
+:root.dark {
+  --bg: #0a0a0a;
+  --fg: #fafafa;
+  --muted: #9ca3af;
+  --accent: #818cf8;
+  --border: #1f2937;
+}
+* { box-sizing: border-box; }
+body {
+  margin: 0;
+  background: var(--bg);
+  color: var(--fg);
+  font-family: ui-sans-serif, system-ui, -apple-system, sans-serif;
+  line-height: 1.6;
+}
+.shell { max-width: 42rem; margin: 0 auto; padding: 2rem 1.25rem; }
+nav.topnav {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  padding-bottom: 1.5rem;
+  margin-bottom: 1.5rem;
+  border-bottom: 1px solid var(--border);
+}
+nav.topnav a { color: var(--fg); text-decoration: none; font-weight: 500; }
+nav.topnav a:hover { color: var(--accent); }
+nav.topnav .spacer { flex: 1; }
+nav.topnav .lang { display: flex; gap: 0.5rem; font-size: 0.875rem; }
+nav.topnav .lang .label { color: var(--muted); }
+nav.topnav .lang a { font-weight: 400; }
+nav.topnav .lang a[aria-current='true'] { color: var(--accent); font-weight: 600; }
+.muted { color: var(--muted); }
+code { background: color-mix(in oklab, var(--fg) 8%, transparent); padding: 0.1em 0.35em; border-radius: 4px; }

package/templates/apps/frontend-i18n/src/globals.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+// Ambient declarations.
+//
+// `declare module '*.css'`: TypeScript with `moduleResolution: Bundler`
+// rejects a bare `import './globals.css'` unless the asset module is
+// declared. Vite resolves it at build time; the declaration is type-only.
+declare module '*.css'

package/templates/apps/frontend-i18n/src/lib/locale.test.ts ADDED Viewed

@@ -0,0 +1,72 @@
+// The URL-prefix i18n helpers — the load-bearing pure functions that drive the
+// [locale] mirror routing + the language switcher. `useUrlLocale` (the one hook
+// in this module) reads useLocation from @voltro/web; the rest are pure string
+// functions we can exercise directly.
+import { describe, expect, test } from 'vitest'
+import {
+  SUPPORTED_LOCALES,
+  DEFAULT_LOCALE,
+  getCatalog,
+  localeFromPathname,
+  withLocalePrefix,
+  stripLocalePrefix,
+} from './locale'
+describe('locale constants', () => {
+  test('supports en + de with en as the default', () => {
+    expect(SUPPORTED_LOCALES).toEqual(['en', 'de'])
+    expect(DEFAULT_LOCALE).toBe('en')
+  })
+})
+describe('getCatalog', () => {
+  test('returns the matching catalog for a supported locale', () => {
+    expect(getCatalog('de')['nav.home']).toBe('Start')
+    expect(getCatalog('en')['nav.home']).toBe('Home')
+  })
+  test('falls back to the default catalog for an unsupported locale', () => {
+    expect(getCatalog('zz')['nav.home']).toBe('Home')
+  })
+})
+describe('localeFromPathname', () => {
+  test('extracts a prefixed locale', () => {
+    expect(localeFromPathname('/de')).toBe('de')
+    expect(localeFromPathname('/de/about')).toBe('de')
+  })
+  test('defaults to en for the bare path or an unknown prefix', () => {
+    expect(localeFromPathname('/')).toBe('en')
+    expect(localeFromPathname('/about')).toBe('en')
+    expect(localeFromPathname('/fr/about')).toBe('en')
+  })
+})
+describe('withLocalePrefix', () => {
+  test('leaves default-locale paths bare', () => {
+    expect(withLocalePrefix('/about', 'en')).toBe('/about')
+    expect(withLocalePrefix('/', 'en')).toBe('/')
+  })
+  test('prefixes non-default locales, mapping / to /<locale>', () => {
+    expect(withLocalePrefix('/about', 'de')).toBe('/de/about')
+    expect(withLocalePrefix('/', 'de')).toBe('/de')
+  })
+})
+describe('stripLocalePrefix', () => {
+  test('removes a locale prefix, mapping /<locale> back to /', () => {
+    expect(stripLocalePrefix('/de/about')).toBe('/about')
+    expect(stripLocalePrefix('/de')).toBe('/')
+  })
+  test('leaves an unprefixed path unchanged', () => {
+    expect(stripLocalePrefix('/about')).toBe('/about')
+  })
+  test('round-trips with withLocalePrefix', () => {
+    expect(stripLocalePrefix(withLocalePrefix('/about', 'de'))).toBe('/about')
+  })
+})

package/templates/apps/frontend-i18n/src/lib/locale.ts ADDED Viewed

@@ -0,0 +1,55 @@
+// The single source of truth for this app's locales + the URL-prefix
+// helpers. `app.config.ts` lists the same codes for the build pipeline;
+// the [locale] mirror pages + the layout's <I18nProvider> read THIS file.
+//
+// Keep SUPPORTED_LOCALES / DEFAULT_LOCALE in sync with `locales` /
+// `defaultLocale` in app.config.ts.
+import { useLocation } from '@voltro/web'
+import en from '../locales/en'
+import de from '../locales/de'
+export const SUPPORTED_LOCALES = ['en', 'de'] as const
+export const DEFAULT_LOCALE = 'en'
+export type Locale = (typeof SUPPORTED_LOCALES)[number]
+// The catalogs, keyed by code. The layout picks one to feed the inner
+// <I18nProvider>; `meta` (build-time, per locale) reads one via getCatalog.
+export const CATALOGS = { en, de } as const
+// Every catalog mirrors `en`'s keys (defineLocale enforces it), so a
+// plain string-record over en's keys is the common type both satisfy —
+// what `meta` reads at build time (`c['meta.home.title']` → string).
+export type Messages = Record<keyof typeof en, string>
+const isSupported = (v: string): v is Locale =>
+  (SUPPORTED_LOCALES as ReadonlyArray<string>).includes(v)
+export const getCatalog = (locale: string): Messages =>
+  isSupported(locale) ? CATALOGS[locale] : CATALOGS[DEFAULT_LOCALE]
+// `/de/about` → 'de'; `/about` → 'en' (default lives at the bare path).
+export const localeFromPathname = (pathname: string): Locale => {
+  const match = /^\/([a-z]{2})(?:\/|$)/.exec(pathname)
+  return match && isSupported(match[1]!) ? (match[1] as Locale) : DEFAULT_LOCALE
+}
+// Reactive: useLocation re-renders on client-side nav, so the layout's
+// provider swaps catalogs when you move between /about and /de/about
+// without a full reload.
+export const useUrlLocale = (): Locale => localeFromPathname(useLocation())
+// '/about' + 'de' → '/de/about'; the default locale stays bare ('/about').
+export const withLocalePrefix = (path: string, locale: string): string => {
+  if (locale === DEFAULT_LOCALE) return path
+  const p = path.startsWith('/') ? path : `/${path}`
+  return p === '/' ? `/${locale}` : `/${locale}${p}`
+}
+// '/de/about' → '/about'; '/about' → '/about'. The inverse of the above,
+// used to keep the active path when switching language.
+export const stripLocalePrefix = (pathname: string): string => {
+  const match = /^\/([a-z]{2})(\/.*|$)/.exec(pathname)
+  return match && isSupported(match[1]!) ? match[2] || '/' : pathname
+}

package/templates/apps/frontend-i18n/src/locales/de.ts ADDED Viewed

@@ -0,0 +1,24 @@
+// German catalog. MUST mirror en.ts key-for-key — `defineLocale<typeof en>()`
+// returns a curried function that fails `tsc --noEmit` on a missing or extra
+// key, so translations can never silently drift out of sync.
+import { defineLocale } from '@voltro/i18n'
+import en from './en'
+export default defineLocale<typeof en>()({
+  'nav.home':     'Start',
+  'nav.about':    'Über',
+  'nav.language': 'Sprache',
+  'home.title':    'Hallo, {name}',
+  'home.tagline':  'Eine zweisprachige statische Website, gebaut mit Voltro.',
+  'home.body':     'Diese Seite wird pro Sprache einmal vorgerendert. Die englische Version liegt am bloßen Pfad; Deutsch wird unter /de ausgeliefert. Wechsle die Sprache in der Navigation — jede Sprache ist ihre eigene crawlbare URL.',
+  'home.activeLocale': 'Du liest die {locale}-Version.',
+  'about.title': 'Über dieses Template',
+  'about.body':  'frontend-i18n zeigt die URL-Prefix-i18n-Strategie: typisierte Kataloge in src/locales, ein [locale]-Mirror für jede Seite und sprachspezifische Seitentitel. Übersetzungen driften nie auseinander — nicht-Basis-Kataloge brechen den Type-Check, wenn ein Schlüssel fehlt.',
+  'meta.home.title':        'Start — Voltro i18n',
+  'meta.home.description':  'Eine zweisprachige statische Website mit Voltro — Englisch am bloßen Pfad, Deutsch unter /de.',
+  'meta.about.title':       'Über — Voltro i18n',
+  'meta.about.description': 'Wie das URL-Prefix-i18n-Template verdrahtet ist: typisierte Kataloge, [locale]-Mirrors, sprachspezifisches SSG.',
+})

package/templates/apps/frontend-i18n/src/locales/en.ts ADDED Viewed

@@ -0,0 +1,25 @@
+// Base catalog — the source of truth. Every other locale (de.ts) mirrors
+// these keys EXACTLY; `defineLocale<typeof en>()` enforces that at `tsc`.
+//
+// Keep ICU placeholders (`{name}`, `{count, plural, …}`) identical across
+// locales — react-intl validates them at render time.
+import { defineCatalog } from '@voltro/i18n'
+export default defineCatalog({
+  'nav.home':     'Home',
+  'nav.about':    'About',
+  'nav.language': 'Language',
+  'home.title':    'Hello, {name}',
+  'home.tagline':  'A bilingual static site built with Voltro.',
+  'home.body':     'This page is pre-rendered once per locale. The English version lives at the bare path; German is served from /de. Switch the language in the nav — each locale is its own crawlable URL.',
+  'home.activeLocale': 'You are reading the {locale} version.',
+  'about.title': 'About this template',
+  'about.body':  'frontend-i18n shows the URL-prefix i18n strategy: typed catalogs in src/locales, a [locale] mirror for every page, and per-locale page titles. Translations never drift — non-base catalogs fail the type-check if a key is missing.',
+  'meta.home.title':        'Home — Voltro i18n',
+  'meta.home.description':  'A bilingual static site built with Voltro — English at the bare path, German under /de.',
+  'meta.about.title':       'About — Voltro i18n',
+  'meta.about.description': 'How the URL-prefix i18n template is wired: typed catalogs, [locale] mirrors, per-locale SSG.',
+} as const)

package/templates/apps/frontend-i18n/src/pages/[locale]/about.tsx ADDED Viewed

@@ -0,0 +1,11 @@
+// Locale mirror of `/about` → renders `/de/about`. Same pattern as the
+// home mirror: re-export the bare page, enumerate non-default locales.
+import { SUPPORTED_LOCALES, DEFAULT_LOCALE } from '../../lib/locale'
+export { default } from '../about'
+export { renderMode, meta } from '../about'
+export const getStaticPaths = async (): Promise<Array<{ params: { locale: string } }>> =>
+  SUPPORTED_LOCALES
+    .filter((l) => l !== DEFAULT_LOCALE)
+    .map((locale) => ({ params: { locale } }))

package/templates/apps/frontend-i18n/src/pages/[locale]/index.tsx ADDED Viewed

@@ -0,0 +1,13 @@
+// Locale mirror of `/` → renders `/de`. Re-exports the bare page verbatim
+// (the component reads its locale from the URL via the layout's provider);
+// `getStaticPaths` tells `voltro build` which locale-prefixed paths to emit.
+// The default locale is NOT listed here — it lives at the bare `/`.
+import { SUPPORTED_LOCALES, DEFAULT_LOCALE } from '../../lib/locale'
+export { default } from '../index'
+export { renderMode, meta } from '../index'
+export const getStaticPaths = async (): Promise<Array<{ params: { locale: string } }>> =>
+  SUPPORTED_LOCALES
+    .filter((l) => l !== DEFAULT_LOCALE)
+    .map((locale) => ({ params: { locale } }))

package/templates/apps/frontend-i18n/src/pages/[locale]/mirrors.test.tsx ADDED Viewed

@@ -0,0 +1,50 @@
+// @vitest-environment jsdom
+//
+// The [locale] mirror pages re-export the bare page and add getStaticPaths,
+// which tells `voltro build` which locale-prefixed paths to emit. The default
+// locale (en) is NOT listed — it lives at the bare path — so only /de is
+// produced. We also confirm each mirror re-exports the base page + its meta.
+import { describe, expect, test, vi } from 'vitest'
+// The mirrors transitively import the base pages, which import @voltro/i18n.
+// Stub it so importing the modules doesn't require the real i18n runtime.
+vi.mock('@voltro/i18n', () => ({
+  // The locale catalogs call these at module top-level; identity mirrors the
+  // real (compile-time-only) implementations so importing them doesn't throw.
+  defineCatalog: <T,>(c: T): T => c,
+  defineLocale:
+    () =>
+    <T,>(c: T): T =>
+      c,
+  useLocale: () => 'en',
+  useT: (id: string) => id,
+  T: ({ id }: { id: string }) => id,
+}))
+const indexMirror = await import('./index')
+const aboutMirror = await import('./about')
+describe('home mirror — getStaticPaths', () => {
+  test('emits only non-default locales (just /de)', async () => {
+    const paths = await indexMirror.getStaticPaths()
+    expect(paths).toEqual([{ params: { locale: 'de' } }])
+  })
+  test('re-exports the base page component + its meta function', () => {
+    expect(typeof indexMirror.default).toBe('function')
+    expect(indexMirror.meta({ locale: 'de' }).title).toBe('Start — Voltro i18n')
+  })
+})
+describe('about mirror — getStaticPaths', () => {
+  test('emits only non-default locales (just /de)', async () => {
+    const paths = await aboutMirror.getStaticPaths()
+    expect(paths).toEqual([{ params: { locale: 'de' } }])
+  })
+  test('re-exports the base page component + its meta function', () => {
+    expect(typeof aboutMirror.default).toBe('function')
+    expect(aboutMirror.meta({ locale: 'en' }).title).toBe('About — Voltro i18n')
+  })
+})

package/templates/apps/frontend-i18n/src/pages/about.test.tsx ADDED Viewed

@@ -0,0 +1,75 @@
+// @vitest-environment jsdom
+//
+// About page (`/about` = en, `/de/about` = de). Same shape as the home test:
+// localized meta() read from the real catalog + localized body render via a
+// mocked @voltro/i18n that resolves against the real catalogs.
+import { afterEach, describe, expect, test, vi } from 'vitest'
+import { act, createElement, type ReactNode } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import en from '../locales/en'
+import de from '../locales/de'
+const catalogs: Record<string, Record<string, string>> = { en, de }
+let currentLocale = 'en'
+vi.mock('@voltro/i18n', () => ({
+  // The locale catalogs call these at module top-level; identity mirrors the
+  // real (compile-time-only) implementations so importing them doesn't throw.
+  defineCatalog: <T,>(c: T): T => c,
+  defineLocale:
+    () =>
+    <T,>(c: T): T =>
+      c,
+  T: ({ id }: { id: string }) => catalogs[currentLocale]?.[id] ?? id,
+}))
+const { default: About, meta, renderMode } = await import('./about')
+;(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true
+let container: HTMLDivElement
+let root: Root
+const render = (node: ReactNode): void => {
+  container = document.createElement('div')
+  document.body.appendChild(container)
+  act(() => {
+    root = createRoot(container)
+    root.render(node)
+  })
+}
+afterEach(() => {
+  currentLocale = 'en'
+  if (root) act(() => root.unmount())
+  container?.remove()
+  document.body.innerHTML = ''
+})
+describe('about — config + localized meta', () => {
+  test('is a static page', () => {
+    expect(renderMode).toBe('static')
+  })
+  test('meta() is localized per locale', () => {
+    expect(meta({ locale: 'en' }).title).toBe('About — Voltro i18n')
+    expect(meta({ locale: 'de' }).title).toBe('Über — Voltro i18n')
+  })
+})
+describe('about — localized render', () => {
+  test('renders the English title + body for locale en', () => {
+    currentLocale = 'en'
+    render(createElement(About))
+    expect(container.querySelector('h1')!.textContent).toBe('About this template')
+    expect(container.textContent).toContain('URL-prefix i18n strategy')
+  })
+  test('renders the German title + body for locale de', () => {
+    currentLocale = 'de'
+    render(createElement(About))
+    expect(container.querySelector('h1')!.textContent).toBe('Über dieses Template')
+    expect(container.textContent).toContain('URL-Prefix-i18n-Strategie')
+  })
+})

package/templates/apps/frontend-i18n/src/pages/about.tsx ADDED Viewed

@@ -0,0 +1,31 @@
+// About, mounted at `/about` (default locale) and mirrored at `/de/about`
+// by src/pages/[locale]/about.tsx. Same per-locale `meta` function pattern
+// as the home page.
+import type { ReactNode } from 'react'
+import type { PageMeta } from '@voltro/web'
+import { T } from '@voltro/i18n'
+import { getCatalog } from '../lib/locale'
+export const renderMode = 'static' as const
+export const meta = ({ locale }: { locale: string }): PageMeta => {
+  const c = getCatalog(locale)
+  return {
+    title: c['meta.about.title'],
+    description: c['meta.about.description'],
+  }
+}
+export default function About(): ReactNode {
+  return (
+    <article>
+      <h1>
+        <T id="about.title" />
+      </h1>
+      <p>
+        <T id="about.body" />
+      </p>
+    </article>
+  )
+}