@percepta/create 4.1.7 → 4.1.8

package/templates/webapp/README.md

@@ -82,23 +82,23 @@ src/
 
 ## Available Scripts
 
-| Script | Description |
-|--------|-------------|
-| `pnpm dev` | Start development server with Turbopack |
-| `pnpm build` | Build for production |
-| `pnpm start` | Start production server |
-| `pnpm typecheck` | Type-check with `tsc` |
-| `pnpm access:validate` | Validate the access manifest and schema |
-| `pnpm access:apply-local` | Apply the merged customer access schema to local SpiceDB |
-| `pnpm auth:db:migrate` | Run migrations for the shared customer auth database |
-| `pnpm inngest:dev` | Start the local Inngest dev server for this app |
-| `pnpm db:generate` | Generate Drizzle migrations |
-| `pnpm db:migrate` | Run database migrations |
-| `pnpm db:studio` | Run migrations, then open Drizzle Studio |
-| `pnpm db:seed` | Seed default shared-auth dev users and local access grants |
-| `pnpm test:e2e:install` | Install the Chromium browser used by Playwright |
-| `pnpm test:e2e` | Run Playwright e2e tests after local setup |
-| `pnpm test:e2e:ui` | Run Playwright e2e tests in UI mode after local setup |
+| Script                    | Description                                                |
+| ------------------------- | ---------------------------------------------------------- |
+| `pnpm dev`                | Start development server with Turbopack                    |
+| `pnpm build`              | Build for production                                       |
+| `pnpm start`              | Start production server                                    |
+| `pnpm typecheck`          | Type-check with `tsc`                                      |
+| `pnpm access:validate`    | Validate the access manifest and schema                    |
+| `pnpm access:apply-local` | Apply the merged customer access schema to local SpiceDB   |
+| `pnpm auth:db:migrate`    | Run migrations for the shared customer auth database       |
+| `pnpm inngest:dev`        | Start the local Inngest dev server for this app            |
+| `pnpm db:generate`        | Generate Drizzle migrations                                |
+| `pnpm db:migrate`         | Run database migrations                                    |
+| `pnpm db:studio`          | Run migrations, then open Drizzle Studio                   |
+| `pnpm db:seed`            | Seed default shared-auth dev users and local access grants |
+| `pnpm test:e2e:install`   | Install the Chromium browser used by Playwright            |
+| `pnpm test:e2e`           | Run Playwright e2e tests after local setup                 |
+| `pnpm test:e2e:ui`        | Run Playwright e2e tests in UI mode after local setup      |
 
 ## End-to-End Tests
 
@@ -136,15 +136,11 @@ const logger = getLogger();
 // Unsafe data (PII) is redacted
 logger.info(
   { safe: { requestId }, unsafe: { email } },
-  "User action completed"
+  "User action completed",
 );
 
 // Errors should be passed as the third parameter
-logger.error(
-  { safe: { documentId } },
-  "Processing failed",
-  error
-);
+logger.error({ safe: { documentId } }, "Processing failed", error);
 ```
 
 ## Authentication
@@ -165,6 +161,7 @@ database Secret. Local development can omit it and use the root-created local
 `auth` database.
 
 To create dev users:
+
 ```bash
 pnpm db:seed
 # Creates customer-admin@example.com / password as a customer admin
@@ -181,56 +178,57 @@ App permissions are authored in `src/access/schema.zed`; `src/access/access.mani
 
 ### Application
 
-| Variable | Description | Default |
-|----------|-------------|---------|
-| `NODE_ENV` | Environment mode | `development` |
-| `APP_BASE_URL` | Base URL for the app | - |
-| `DEPLOYMENT_ENVIRONMENT` | Deployment environment label for telemetry | `NODE_ENV` |
+| Variable                 | Description                                | Default       |
+| ------------------------ | ------------------------------------------ | ------------- |
+| `NODE_ENV`               | Environment mode                           | `development` |
+| `APP_BASE_URL`           | Base URL for the app                       | -             |
+| `DEPLOYMENT_ENVIRONMENT` | Deployment environment label for telemetry | `NODE_ENV`    |
 
 ### App Database
 
-| Variable | Description | Default |
-|----------|-------------|---------|
+| Variable       | Description                   | Default                                                       |
+| -------------- | ----------------------------- | ------------------------------------------------------------- |
 | `DATABASE_URL` | App PostgreSQL connection URL | `postgresql://postgres:postgres@localhost:5434/__DB_NAME__` |
 
 ### Shared Auth Database
 
-| Variable | Description | Default |
-|----------|-------------|---------|
-| `AUTH_DATABASE_URL` | Shared auth database URL from the monorepo auth Secret | - |
+| Variable            | Description                                            | Default |
+| ------------------- | ------------------------------------------------------ | ------- |
+| `AUTH_DATABASE_URL` | Shared auth database URL from the monorepo auth Secret | -       |
 
 ### Security
 
-| Variable | Description |
-|----------|-------------|
+| Variable                | Description                         |
+| ----------------------- | ----------------------------------- |
 | `ENCRYPTION_SECRET_KEY` | 32-character key for URL encryption |
 
 Generate a secret key:
+
 ```bash
 node -e "console.log(require('crypto').randomBytes(16).toString('hex'))"
 ```
 
 ### Access Control
 
-| Variable | Description | Default |
-|----------|-------------|---------|
-| `SPICEDB_ENDPOINT` | SpiceDB gRPC endpoint | `localhost:50051` |
-| `SPICEDB_PRESHARED_KEY` | SpiceDB preshared key | `dev-spicedb-token` |
-| `SPICEDB_INSECURE` | Use insecure local gRPC transport | `true` |
+| Variable                | Description                       | Default             |
+| ----------------------- | --------------------------------- | ------------------- |
+| `SPICEDB_ENDPOINT`      | SpiceDB gRPC endpoint             | `localhost:50051`   |
+| `SPICEDB_PRESHARED_KEY` | SpiceDB preshared key             | `dev-spicedb-token` |
+| `SPICEDB_INSECURE`      | Use insecure local gRPC transport | `true`              |
 
 ### Inngest (Background Jobs)
 
-| Variable | Description |
-|----------|-------------|
-| `INNGEST_BASE_URL` | Inngest server URL |
+| Variable              | Description         |
+| --------------------- | ------------------- |
+| `INNGEST_BASE_URL`    | Inngest server URL  |
 | `INNGEST_SIGNING_KEY` | Inngest signing key |
-| `INNGEST_EVENT_KEY` | Inngest event key |
+| `INNGEST_EVENT_KEY`   | Inngest event key   |
 
 ### Langfuse (LLM Observability)
 
-| Variable | Description |
-|----------|-------------|
-| `LANGFUSE_BASE_URL` | Langfuse server URL |
+| Variable              | Description         |
+| --------------------- | ------------------- |
+| `LANGFUSE_BASE_URL`   | Langfuse server URL |
 | `LANGFUSE_PUBLIC_KEY` | Langfuse public key |
 | `LANGFUSE_SECRET_KEY` | Langfuse secret key |
 
@@ -238,12 +236,12 @@ Set these values through the target deployment platform when Langfuse is enabled
 
 ### LLM Providers
 
-| Variable | Description |
-|----------|-------------|
-| `ANTHROPIC_API_KEY` | Anthropic API key |
-| `OPENAI_API_KEY` | OpenAI API key for local or non-demo deployments |
-| `LLM_PROVIDER` | Optional provider override: `anthropic` or `openai` |
-| `LLM_MODEL` | Optional model override |
+| Variable            | Description                                         |
+| ------------------- | --------------------------------------------------- |
+| `ANTHROPIC_API_KEY` | Anthropic API key                                   |
+| `OPENAI_API_KEY`    | OpenAI API key for local or non-demo deployments    |
+| `LLM_PROVIDER`      | Optional provider override: `anthropic` or `openai` |
+| `LLM_MODEL`         | Optional model override                             |
 
 Use `LLMService` for backend model calls:
 
@@ -261,11 +259,11 @@ For local development, `pnpm dev` also loads `~/.config/percepta/create.env` whe
 
 ### OpenTelemetry / LGTM
 
-| Variable | Description |
-|----------|-------------|
-| `OTEL_EXPORTER_OTLP_ENDPOINT` | Base OTLP HTTP collector endpoint |
-| `OTEL_EXPORTER_OTLP_TRACES_ENDPOINT` | Optional trace-specific OTLP endpoint |
-| `OTEL_TRACES_EXPORTER` | Set to `none` to disable server trace export |
+| Variable                             | Description                                  |
+| ------------------------------------ | -------------------------------------------- |
+| `OTEL_EXPORTER_OTLP_ENDPOINT`        | Base OTLP HTTP collector endpoint            |
+| `OTEL_EXPORTER_OTLP_TRACES_ENDPOINT` | Optional trace-specific OTLP endpoint        |
+| `OTEL_TRACES_EXPORTER`               | Set to `none` to disable server trace export |
 
 The generated app sets its OpenTelemetry service name and deployment
 environment resource label internally. Configure the collector endpoint through

package/templates/webapp/agent-skills/access-control.md

@@ -12,11 +12,11 @@ The customer monorepo has one shared identity layer and one shared SpiceDB deplo
 
 There are three separate authorization layers:
 
-| Layer | Owner | Stored as |
-|-------|-------|-----------|
-| Customer admins | Customer bootstrap / Applications admin | `core/customer:main#admin@core/user:<users.id>` |
-| Default application roles | Customer Applications admin | `core/application:<app>#admin/user@core/user:<users.id>` or `core/group:<groups.id>#member` |
-| App roles/resources | This app's admin UI and app code | `<app>/system:main#<role>@<subject>` and app resource relationships |
+| Layer                     | Owner                                   | Stored as                                                                                   |
+| ------------------------- | --------------------------------------- | ------------------------------------------------------------------------------------------- |
+| Customer admins           | Customer bootstrap / Applications admin | `core/customer:main#admin@core/user:<users.id>`                                             |
+| Default application roles | Customer Applications admin             | `core/application:<app>#admin/user@core/user:<users.id>` or `core/group:<groups.id>#member` |
+| App roles/resources       | This app's admin UI and app code        | `<app>/system:main#<role>@<subject>` and app resource relationships                         |
 
 Customer admins do not automatically get application access. They can manage default app roles, but to enter the app as a user, a user or group must be an application `admin` or `user`.
 
@@ -195,9 +195,7 @@ const [canReadSalary] = await getAccessControl().permissions.canMany(checks);
 Use a lifecycle sync wrapper in repositories/services that create, update, or delete rows with SpiceDB-backed relationships. Configure it once with either direct SpiceDB writes for authorization changes that must be visible immediately, or outbox enqueueing for transactional retry.
 
 ```ts
-import {
-  createPermissionedResourceLifecycleSync,
-} from "@percepta/access-control/drizzle";
+import { createPermissionedResourceLifecycleSync } from "@percepta/access-control/drizzle";
 
 const employeeLifecycle = createPermissionedResourceLifecycleSync({
   apply: {
@@ -222,7 +220,10 @@ Do not model ordinary Postgres columns as SpiceDB objects. Model business permis
 Use the app access service instead of constructing raw SpiceDB clients in feature code:
 
 ```ts
-import { getAccessControl, toUserSubject } from "@/services/access/AppAccessControl";
+import {
+  getAccessControl,
+  toUserSubject,
+} from "@/services/access/AppAccessControl";
 
 const allowed = await getAccessControl().permissions.can({
   permission: "view_private",

package/templates/webapp/agent-skills/database.md

@@ -60,13 +60,19 @@ import { eq } from "drizzle-orm";
 const db = DatabaseService.create().getDatabase();
 
 // Select
-const docs = await db.select().from(documents).where(eq(documents.userId, userId));
+const docs = await db
+  .select()
+  .from(documents)
+  .where(eq(documents.userId, userId));
 
 // Insert
 await db.insert(documents).values({ title: "New Doc", userId });
 
 // Update
-await db.update(documents).set({ title: "Updated" }).where(eq(documents.id, docId));
+await db
+  .update(documents)
+  .set({ title: "Updated" })
+  .where(eq(documents.id, docId));
 
 // Delete
 await db.delete(documents).where(eq(documents.id, docId));
@@ -129,8 +135,8 @@ pnpm --dir ../.. run docker:down
 
 ## Environment Variables
 
-| Variable | Default | Description |
-|----------|---------|-------------|
+| Variable       | Default                                                       | Description                   |
+| -------------- | ------------------------------------------------------------- | ----------------------------- |
 | `DATABASE_URL` | `postgresql://postgres:postgres@localhost:5434/__DB_NAME__` | App PostgreSQL connection URL |
 
 Shared auth data belongs to the customer monorepo auth package. Deployed apps

package/templates/webapp/agent-skills/inngest.md

@@ -13,7 +13,9 @@ Create a Zod schema for the event payload:
 ```typescript
 import z from "zod";
 
-export type DocumentProcessedPayload = z.infer<typeof DocumentProcessedPayload.SCHEMA>;
+export type DocumentProcessedPayload = z.infer<
+  typeof DocumentProcessedPayload.SCHEMA
+>;
 export namespace DocumentProcessedPayload {
   export const SCHEMA = z.object({
     documentId: z.string(),
@@ -135,13 +137,13 @@ The Inngest Dev Server auto-discovers functions by calling the serve endpoint at
 
 ## Environment Variables
 
-| Variable | Required | Description |
-|----------|----------|-------------|
-| `INNGEST_BASE_URL` | Yes | Inngest server URL (`http://localhost:8288` locally) |
-| `INNGEST_EVENT_KEY` | Yes (prod) | Event authentication key |
-| `INNGEST_SIGNING_KEY` | Yes (prod) | Function registration signing key |
-| `INNGEST_APP_URL` | No | Override app URL for Inngest to call back |
-| `SKIP_INNGEST_SYNC` | No | Set `true` to skip Inngest app sync on startup |
+| Variable              | Required   | Description                                          |
+| --------------------- | ---------- | ---------------------------------------------------- |
+| `INNGEST_BASE_URL`    | Yes        | Inngest server URL (`http://localhost:8288` locally) |
+| `INNGEST_EVENT_KEY`   | Yes (prod) | Event authentication key                             |
+| `INNGEST_SIGNING_KEY` | Yes (prod) | Function registration signing key                    |
+| `INNGEST_APP_URL`     | No         | Override app URL for Inngest to call back            |
+| `SKIP_INNGEST_SYNC`   | No         | Set `true` to skip Inngest app sync on startup       |
 
 ## Key Concepts
 

package/templates/webapp/agent-skills/langfuse.md

@@ -7,6 +7,7 @@ Langfuse is an open-source LLM observability platform. It captures traces, spans
 ## When to Use Langfuse
 
 **Use Langfuse when the app calls LLMs** (OpenAI, Bedrock/Claude, etc.). It gives you:
+
 - Trace visualization of multi-step LLM chains
 - Token usage and cost tracking per request
 - Prompt versioning and A/B testing
@@ -69,6 +70,7 @@ platform's environment-scoped variable or secret mechanism.
 ### Self-Hosted / Langfuse Cloud
 
 For external projects, you can:
+
 - Use [Langfuse Cloud](https://cloud.langfuse.com) (free tier available)
 - Self-host with `docker run langfuse/langfuse`
 
@@ -109,10 +111,10 @@ Simply don't set the `LANGFUSE_*` env vars. This is the default local developmen
 
 ## Environment Variables
 
-| Variable | Required | Description |
-|----------|----------|-------------|
-| `LANGFUSE_BASE_URL` | No | Langfuse server URL. If unset, Langfuse integration is disabled. |
-| `LANGFUSE_PUBLIC_KEY` | No | Public key from Langfuse dashboard |
-| `LANGFUSE_SECRET_KEY` | No | Secret key from Langfuse dashboard |
+| Variable              | Required | Description                                                      |
+| --------------------- | -------- | ---------------------------------------------------------------- |
+| `LANGFUSE_BASE_URL`   | No       | Langfuse server URL. If unset, Langfuse integration is disabled. |
+| `LANGFUSE_PUBLIC_KEY` | No       | Public key from Langfuse dashboard                               |
+| `LANGFUSE_SECRET_KEY` | No       | Secret key from Langfuse dashboard                               |
 
 All three must be set for Langfuse to activate. If any is missing, the integration silently no-ops.

package/templates/webapp/agent-skills/oneshot.md

@@ -74,6 +74,7 @@ This is the ONLY point where you pause for user confirmation. After they confirm
 Based on the confirmed requirements, design the architecture. Do NOT write a plan document — think through it and write it as a brief message to the user (so they can see your thinking), then start building.
 
 Cover:
+
 1. **Database schema** — which tables, columns, relationships
 2. **API routes** — which tRPC routers and procedures
 3. **Pages** — which routes/pages in the app
@@ -162,6 +163,7 @@ pnpm dev
 ### Step 3: Verify the app works
 
 Open the app in a browser and walk through the core workflows from the requirements. Check:
+
 - Pages load without errors
 - Data can be created, read, updated, deleted
 - Auth works (if configured)
@@ -215,16 +217,16 @@ Report the deployment URL to the user when done.
 
 ## Common Mistakes
 
-| Mistake | Fix |
-|---------|-----|
-| Stopping after design to ask permission | After requirements are confirmed, build autonomously. |
-| Not running `pnpm build` between chunks | Build after every chunk. Fix errors immediately. |
-| Writing custom UI instead of using `@percepta/design` | Check the design system first. |
-| Using `console.log` | Use `getLogger()` with safe/unsafe fields. |
-| Using `process.env` | Use `getEnvConfig()`. |
-| Forgetting to export new schema from the schema index | Every new table must be exported from the index. |
-| Forgetting to register Inngest functions in the serve endpoint | Function collections must be added to the serve endpoint. |
-| Forgetting to add new router to the root appRouter | Every new tRPC router must be composed in the root. |
-| Not verifying the app in the browser | Build + lint passing is necessary but not sufficient. Test the UI. |
-| Creating the GitHub repo before the app works locally | Verify locally first, then create the repo. |
-| Deploying without the user asking | Only deploy when explicitly requested. |
+| Mistake                                                        | Fix                                                                |
+| -------------------------------------------------------------- | ------------------------------------------------------------------ |
+| Stopping after design to ask permission                        | After requirements are confirmed, build autonomously.              |
+| Not running `pnpm build` between chunks                        | Build after every chunk. Fix errors immediately.                   |
+| Writing custom UI instead of using `@percepta/design`          | Check the design system first.                                     |
+| Using `console.log`                                            | Use `getLogger()` with safe/unsafe fields.                         |
+| Using `process.env`                                            | Use `getEnvConfig()`.                                              |
+| Forgetting to export new schema from the schema index          | Every new table must be exported from the index.                   |
+| Forgetting to register Inngest functions in the serve endpoint | Function collections must be added to the serve endpoint.          |
+| Forgetting to add new router to the root appRouter             | Every new tRPC router must be composed in the root.                |
+| Not verifying the app in the browser                           | Build + lint passing is necessary but not sufficient. Test the UI. |
+| Creating the GitHub repo before the app works locally          | Verify locally first, then create the repo.                        |
+| Deploying without the user asking                              | Only deploy when explicitly requested.                             |

package/templates/webapp/package.json.template

@@ -3,9 +3,6 @@
   "version": "0.1.0",
   "private": true,
   "type": "module",
-  "engines": {
-    "node": ">=18.0.0"
-  },
   "scripts": {
     "dev": "tsx ./scripts/with-local-env.ts next dev --turbopack",
     "build": "next build",
@@ -46,9 +43,9 @@
     "@opentelemetry/auto-instrumentations-node": "^0.75.0",
     "@opentelemetry/exporter-trace-otlp-proto": "^0.217.0",
     "@opentelemetry/sdk-node": "^0.217.0",
-    "@__CUSTOMER_SLUG__/auth": "workspace:*",
     "@percepta/access-control": "^1.0.0",
     "@percepta/ai": "^0.1.0",
+    "@__CUSTOMER_SLUG__/auth": "workspace:*",
     "@percepta/database": "^0.1.2",
     "@percepta/design": "^0.4.1",
     "@percepta/inngest": "^0.1.0",
@@ -93,8 +90,8 @@
     "zod": "^4.1.5"
   },
   "devDependencies": {
-    "@playwright/test": "^1.58.2",
     "@percepta/build": "^1.0.0",
+    "@playwright/test": "^1.58.2",
     "@tailwindcss/postcss": "^4.1.11",
     "@types/formidable": "^3.4.5",
     "@types/he": "^1.2.3",
@@ -112,5 +109,8 @@
     "tailwindcss": "^4.0.12",
     "vitest": "^4.0.0",
     "yargs": "^17.7.2"
+  },
+  "engines": {
+    "node": ">=18.0.0"
   }
 }

package/templates/webapp/playwright.config.ts

@@ -2,8 +2,7 @@ import { defineConfig, devices } from "@playwright/test";
 
 const port = Number(process.env.PLAYWRIGHT_PORT ?? 3000);
 const host = process.env.PLAYWRIGHT_HOST ?? "localhost";
-const baseURL =
-  process.env.PLAYWRIGHT_BASE_URL ?? `http://${host}:${port}`;
+const baseURL = process.env.PLAYWRIGHT_BASE_URL ?? `http://${host}:${port}`;
 
 export default defineConfig({
   testDir: "./e2e",

package/templates/webapp/src/app/(app)/page.tsx

@@ -59,8 +59,8 @@ export default function HomePage() {
           <p className="app-kicker">Overview</p>
           <h1 className="app-title">Good afternoon, App Admin</h1>
           <p className="app-subtitle">
-            Welcome to __APP_TITLE__. Three items want attention; the workspace
-            is ready for your team&apos;s first workflows.
+            Welcome to __APP_TITLE__. Three items want attention; the workspace is
+            ready for your team&apos;s first workflows.
           </p>
         </div>
         <div className="app-actions">
@@ -77,7 +77,9 @@ export default function HomePage() {
                 <span className="app-metric-label">{metric.label}</span>
                 <span
                   className={
-                    metric.tone === "warn" ? "app-chip app-chip-warn" : "app-chip"
+                    metric.tone === "warn"
+                      ? "app-chip app-chip-warn"
+                      : "app-chip"
                   }
                 >
                   {metric.delta}

package/templates/webapp/src/app/(auth)/layout.tsx

@@ -24,8 +24,8 @@ export default function AuthLayout({
             A quieter place to do your team's most considered work.
           </h2>
           <p className="app-auth-copy">
-            Keep decisions, handoffs, and daily operations in one calm
-            workspace built for focused teams.
+            Keep decisions, handoffs, and daily operations in one calm workspace
+            built for focused teams.
           </p>
         </div>
 

package/templates/webapp/src/app/(settings)/settings/page.tsx

@@ -1,9 +1,9 @@
-import type {
-  AccessRoleDefinition,
-  ApplicationGrant,
-  SubjectRef,
+import {
+  type AccessRoleDefinition,
+  type ApplicationGrant,
+  type SubjectRef,
+  groupSubjectRef,
 } from "@percepta/access-control";
-import { groupSubjectRef } from "@percepta/access-control";
 import {
   PrincipalMultiInput,
   type PrincipalOption,
@@ -32,6 +32,10 @@ import {
   getCustomerAccessControl,
   toUserSubject,
 } from "../../../services/access/AppAccessControl";
+import {
+  AccessControlTabs,
+  type AccessControlTab,
+} from "./_components/AccessControlTabs";
 import {
   type AccessAppRole,
   type SettingsPermissions,
@@ -39,10 +43,6 @@ import {
   readAssignableRole,
   requireAnySettingsPermission,
 } from "./_lib/accessSettings";
-import {
-  AccessControlTabs,
-  type AccessControlTab,
-} from "./_components/AccessControlTabs";
 
 export const metadata: Metadata = {
   title: "Settings - __APP_TITLE__",
@@ -73,10 +73,10 @@ interface RoleAssignmentRow {
   readonly definition: RoleDefinition;
   readonly disabled: boolean;
   readonly disabledReason?: string;
-  readonly hiddenFields?: readonly {
+  readonly hiddenFields?: ReadonlyArray<{
     readonly name: string;
     readonly value: string;
-  }[];
+  }>;
   readonly options: readonly PrincipalAssignmentOption[];
   readonly selectedSubjects: readonly SubjectRef[];
   readonly updateAction: (formData: FormData) => Promise<void>;
@@ -123,7 +123,7 @@ const roleDefinitions = [
     source: "Application access",
   },
   ...(
-    accessRoleDefinitions as readonly AccessRoleDefinition<AccessAppRole>[]
+    accessRoleDefinitions as ReadonlyArray<AccessRoleDefinition<AccessAppRole>>
   ).map(
     (definition): RoleDefinition => ({
       ...definition,
@@ -139,7 +139,9 @@ const appRoleDefinitionMap = new Map<AccessAppRole, RoleDefinition>(
     .map((definition) => [definition.role as AccessAppRole, definition]),
 );
 
-export default async function SettingsPage({ searchParams }: SettingsPageProps) {
+export default async function SettingsPage({
+  searchParams,
+}: SettingsPageProps) {
   const permissions = await requireAnySettingsPermission();
   const params = await searchParams;
   const section = readSettingsSection(params?.section);
@@ -211,10 +213,7 @@ function RolesTab() {
         </TableHeader>
         <TableBody>
           {roleDefinitions.map((role) => (
-            <TableRow
-              key={`${role.source}:${role.role}`}
-              className="align-top"
-            >
+            <TableRow key={`${role.source}:${role.role}`} className="align-top">
               <TableCell className="py-4 whitespace-normal">
                 <div className="font-medium text-foreground">{role.label}</div>
                 <div className="text-muted-foreground">{role.description}</div>
@@ -492,10 +491,10 @@ async function listAssignableRoleSubjects(): Promise<
 > {
   const app = getAccessControl().app;
   const entries = await Promise.all(
-    assignableRoles.map(async (role) => [
-      role,
-      new Set(await app.listAppRoleSubjects(role)),
-    ] as const),
+    assignableRoles.map(
+      async (role) =>
+        [role, new Set(await app.listAppRoleSubjects(role))] as const,
+    ),
   );
 
   return new Map(entries);

package/templates/webapp/src/components/FaroProvider.tsx

@@ -2,8 +2,7 @@
 
 import { Alert, AlertDescription, AlertTitle, Button } from "@percepta/design";
 import { FaroProvider as BaseFaroProvider } from "@percepta/next-utils/faro";
-import { type ReactNode } from "react";
-
+import type { ReactNode } from "react";
 // Import to trigger Faro initialization at module scope (earliest possible)
 import "../services/observability/initFaro";
 

package/templates/webapp/src/components/Header.tsx

@@ -40,10 +40,7 @@ export default function Header({
   return (
     <header className="app-header">
       <nav aria-label="Primary navigation" className="app-header-nav">
-        <Link
-          className="app-header-brand"
-          href="/"
-        >
+        <Link className="app-header-brand" href="/">
           <span className="app-header-mark" aria-hidden={true}>
             {appInitial}
           </span>
@@ -66,10 +63,7 @@ export default function Header({
       </div>
       <DropdownMenu>
         <DropdownMenuTrigger asChild={true}>
-          <button
-            className="app-account-button"
-            aria-label="Open account menu"
-          >
+          <button className="app-account-button" aria-label="Open account menu">
             <div className="app-account-text">
               <p className="text-sm font-medium text-foreground">
                 {user.name || "User"}

package/templates/webapp/src/components/form/FormItem.tsx

@@ -2,7 +2,7 @@ import { Label } from "@percepta/design";
 import { Slot } from "@radix-ui/react-slot";
 import { compact } from "lodash-es";
 import React, { useId } from "react";
-import { type ControllerFieldState } from "react-hook-form";
+import type { ControllerFieldState } from "react-hook-form";
 import { cn } from "../../utils/cn";
 
 interface FormItemProps extends React.ComponentProps<"div"> {

package/templates/webapp/src/drizzle/db.ts

@@ -8,7 +8,9 @@ export const { client, db } = createDb();
 function createDb(): { client: Pool; db: NodePgDatabase } {
   const { DATABASE_URL: databaseUrl, NODE_ENV: nodeEnv } = getEnvConfig();
   const pool = createPgPool(
-    readDatabaseConfig({ env: { DATABASE_URL: databaseUrl, NODE_ENV: nodeEnv } }),
+    readDatabaseConfig({
+      env: { DATABASE_URL: databaseUrl, NODE_ENV: nodeEnv },
+    }),
   );
 
   return { client: pool, db: drizzle(pool) };

package/templates/webapp/src/drizzle/schema/utils/jsonbFromZod.ts

@@ -1,5 +1,5 @@
 import { customType } from "drizzle-orm/pg-core";
-import { type z } from "zod";
+import type { z } from "zod";
 
 export function jsonbFromZod<TValue>(schema: z.Schema<TValue>): ReturnType<
   typeof customType<{

package/templates/webapp/src/instrumentation.ts

@@ -9,14 +9,11 @@ import { getLogger } from "./services/logger/AppLogger";
 type SpanProcessor = tracing.SpanProcessor;
 
 function setDefaultOpenTelemetryEnv(): void {
-  const {
-    DEPLOYMENT_ENVIRONMENT: deploymentEnvironment,
-    NODE_ENV: nodeEnv,
-  } = getEnvConfig();
+  const { DEPLOYMENT_ENVIRONMENT: deploymentEnvironment, NODE_ENV: nodeEnv } =
+    getEnvConfig();
 
   process.env.OTEL_SERVICE_NAME ??= "__APP_NAME__";
-  process.env.OTEL_RESOURCE_ATTRIBUTES ??=
-    `deployment.environment=${deploymentEnvironment ?? nodeEnv}`;
+  process.env.OTEL_RESOURCE_ATTRIBUTES ??= `deployment.environment=${deploymentEnvironment ?? nodeEnv}`;
 }
 
 function getOtlpTracesEndpoint(): string | undefined {