// Web app for the {{projectName}} project. Read by `voltro dev` / `voltro start`.
//
// This is the FULLSTACK template — a web frontend wired to an api so you can
// see the framework's headline feature: the reactive end-to-end loop. The web
// client subscribes to a server-side query; when a mutation writes the table,
// the server pushes a delta over WebSocket and the React tree re-renders. No
// `refetch`, no polling.
//
// `port` is allocated by `voltro create-project` / `voltro add-app` from the
// project's portRange (in project.json), hard-pinned per app.
import { defineEnv, envVar } from '@voltro/env'

// Typed PUBLIC environment — public vars are validated + baked into the browser
// bundle at build time and read via `publicEnv` from '@voltro/env/public'.
// NEVER put a secret here (it ships to every visitor) — declare secrets on the
// api instead. Run `voltro env` for the manifest.
export const env = defineEnv({
  VOLTRO_PUBLIC_APP_NAME: envVar.string({ access: 'public', default: '{{capProjectName}}' }),
})

export default {
  type: 'web' as const,
  name: '{{capProjectName}}{{capAppName}}',
  port: {{port}},
  env,
  // Bilingual by default. The framework auto-wires a cookie-driven
  // <I18nProvider> from these codes and loads the matching
  // `src/locales/<code>.ts` catalog — so `<T id="…" />` / `useT()` /
  // `useLocale()` work app-wide with no manual setup. The <LocaleSwitcher>
  // in the layout writes the `voltro:locale` cookie + reloads. Grow the app to
  // more languages by adding a code here + a `src/locales/<code>.ts`.
  locales:       ['en', 'de'] as const,
  defaultLocale: 'en'         as const,
  // The api this frontend consumes. The NAME ('app') is the lookup key — spelled
  // ONCE, in `src/lib/api.ts`'s `createHooks<AppProcedures>('app')`, after which
  // pages just call `useSubscription('notes.list')` and
  // `useMutation('notes.create')`. The `package` resolves the sibling api
  // (scaffold it with `--api=api-backend`); its port is auto-discovered from
  // its own app.config.ts, and codegen pulls its typed rpc surface so the
  // hooks are end-to-end typed. Add more entries to consume more apis.
  apis: {
    app: { package: '@{{projectName}}/api' },
  },
}