@stjoseph/prumo 0.0.1

package/templates/site/src/app/globals.css

@@ -0,0 +1,129 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "shadcn/tailwind.css";
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+  --font-heading: var(--font-sans);
+  --font-sans: var(--font-sans);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --color-foreground: var(--foreground);
+  --color-background: var(--background);
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --radius-2xl: calc(var(--radius) * 1.8);
+  --radius-3xl: calc(var(--radius) * 2.2);
+  --radius-4xl: calc(var(--radius) * 2.6);
+}
+
+:root {
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.205 0 0);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.87 0 0);
+  --chart-2: oklch(0.556 0 0);
+  --chart-3: oklch(0.439 0 0);
+  --chart-4: oklch(0.371 0 0);
+  --chart-5: oklch(0.269 0 0);
+  --radius: 0.625rem;
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.87 0 0);
+  --chart-2: oklch(0.556 0 0);
+  --chart-3: oklch(0.439 0 0);
+  --chart-4: oklch(0.371 0 0);
+  --chart-5: oklch(0.269 0 0);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+  html {
+    @apply font-sans;
+  }
+}

package/templates/site/src/app/layout.tsx

@@ -0,0 +1,13 @@
+import './globals.css'
+import { Geist } from 'next/font/google'
+import { cn } from '@/lib/utils'
+
+const geist = Geist({ subsets: ['latin'], variable: '--font-sans' })
+
+export default function RootLayout({ children }: LayoutProps<'/'>) {
+  return (
+    <html lang="en" className={cn('font-sans', geist.variable)}>
+      <body>{children}</body>
+    </html>
+  )
+}

package/templates/site/src/app/page.spec.ts

@@ -0,0 +1,10 @@
+import { describe, expect, it } from 'vitest'
+import { metadata } from './page'
+
+describe('home page metadata', () => {
+  it('gives search results a title and a description', () => {
+    expect(metadata.title).toEqual(expect.any(String))
+    expect(metadata.description).toEqual(expect.any(String))
+    expect(String(metadata.description).length).toBeGreaterThan(0)
+  })
+})

package/templates/site/src/app/page.tsx

@@ -0,0 +1,17 @@
+import type { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Site',
+  description: 'Replace this with one sentence that tells a search result what this site is.',
+}
+
+export default function HomePage() {
+  return (
+    <main className="mx-auto flex min-h-svh max-w-2xl flex-col justify-center gap-4 p-6">
+      <h1 className="text-4xl font-semibold tracking-tight">Site</h1>
+      <p className="text-lg text-muted-foreground">
+        This page is rendered once, at build time, and served as static HTML.
+      </p>
+    </main>
+  )
+}

package/templates/site/src/lib/utils.ts

@@ -0,0 +1 @@
+export { cn } from 'cn'

package/templates/site/tsconfig.json

@@ -0,0 +1,34 @@
+{
+  "compilerOptions": {
+    "target": "ES2023",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noUncheckedIndexedAccess": true,
+    "noFallthroughCasesInSwitch": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "react-jsx",
+    "incremental": true,
+    "plugins": [{ "name": "next" }],
+    "paths": {
+      "@/*": ["./src/*"]
+    },
+    "types": ["vitest/globals"]
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts",
+    "**/*.mts"
+  ],
+  "exclude": ["node_modules"]
+}

package/templates/site/vitest.config.mts

@@ -0,0 +1,8 @@
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  plugins: [react()],
+  resolve: { alias: { '@': `${import.meta.dirname}/src` } },
+  test: { globals: true, include: ['src/**/*.spec.{ts,tsx}'] },
+})

package/templates/web/.env.example

@@ -0,0 +1 @@
+VITE_API_URL=http://localhost:3000

package/templates/web/.githooks/install.mjs

@@ -0,0 +1,18 @@
+import { execFileSync } from 'node:child_process'
+
+function insideRepository() {
+  try {
+    execFileSync('git', ['rev-parse', '--git-dir'], { stdio: 'ignore' })
+    return true
+  } catch (error) {
+    // No git, or no repository: an install from an archive or inside a container, where hooks have no use.
+    if (error.code === 'ENOENT' || error.status === 128) {
+      return false
+    }
+    throw error
+  }
+}
+
+if (insideRepository()) {
+  execFileSync('git', ['config', 'core.hooksPath', '.githooks'], { stdio: 'inherit' })
+}

package/templates/web/.githooks/pre-commit

@@ -0,0 +1,2 @@
+#!/bin/sh
+pnpm biome check --staged --write

package/templates/web/.githooks/pre-push

@@ -0,0 +1,2 @@
+#!/bin/sh
+pnpm typecheck

package/templates/web/README.md

@@ -0,0 +1,29 @@
+# web
+
+## Requirements
+
+Node 22.17 or later, pnpm, and the API running.
+
+## Running it
+
+```sh
+pnpm install
+cp .env.example .env        # VITE_API_URL points at the API
+pnpm dev
+```
+
+The app runs on `http://localhost:5173`, which is the origin the API trusts by default (`WEB_ORIGIN`).
+
+## Everyday commands
+
+| Command | What it does |
+|---|---|
+| `pnpm test` | Renders components against a fake transport; no API needed |
+| `pnpm lint` | Biome |
+| `pnpm typecheck` | `tsc --noEmit`, also run before every push |
+| `pnpm build` | Production build into `dist/`; `pnpm preview` serves it |
+
+## Conventions
+
+The rules this project follows live in `.prumo/`, and `AGENTS.md` points to them. Read those before
+changing how something is done.

package/templates/web/biome.jsonc

@@ -0,0 +1,24 @@
+{
+  "$schema": "https://biomejs.dev/schemas/2.5.13/schema.json",
+  "vcs": { "enabled": true, "clientKind": "git", "useIgnoreFile": true },
+  "files": { "includes": ["**", "!dist", "!coverage", "!src/routeTree.gen.ts"] },
+  "formatter": { "indentStyle": "space", "indentWidth": 2, "lineWidth": 100 },
+  "linter": { "rules": { "preset": "recommended" } },
+  "javascript": { "formatter": { "quoteStyle": "single", "semicolons": "asNeeded" } },
+  "css": { "parser": { "tailwindDirectives": true } },
+  "overrides": [
+    {
+      "includes": ["src/components/ui/**"],
+      "linter": {
+        "rules": {
+          "a11y": {
+            // A shadcn primitive forwards htmlFor through props, which the rule cannot see.
+            "noLabelWithoutControl": "off",
+            // shadcn's Field uses role="group" on purpose; a fieldset would change layout and semantics.
+            "useSemanticElements": "off"
+          }
+        }
+      }
+    }
+  ]
+}

package/templates/web/components.json

@@ -0,0 +1,25 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "base-nova",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "src/index.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "rtl": false,
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  },
+  "menuColor": "default",
+  "menuAccent": "subtle",
+  "registries": {}
+}

package/templates/web/gitignore

@@ -0,0 +1,6 @@
+node_modules
+dist
+coverage
+*.tsbuildinfo
+.env
+.env.local

package/templates/web/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Web</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/templates/web/package.json

@@ -0,0 +1,55 @@
+{
+  "name": "web",
+  "version": "0.0.1",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "lint": "biome check",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:cov": "vitest run --coverage",
+    "prepare": "node .githooks/install.mjs"
+  },
+  "dependencies": {
+    "@base-ui/react": "1.8.0",
+    "@fontsource-variable/geist": "5.3.0",
+    "@hookform/resolvers": "5.9.1",
+    "@tanstack/react-query": "5.102.8",
+    "@tanstack/react-router": "1.170.36",
+    "better-auth": "1.7.4",
+    "class-variance-authority": "0.7.1",
+    "cn": "0.3.0",
+    "lucide-react": "1.45.0",
+    "react": "19.2.3",
+    "react-dom": "19.2.3",
+    "react-hook-form": "7.88.0",
+    "shadcn": "4.21.0",
+    "tw-animate-css": "1.4.0",
+    "zod": "4.6.4"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "2.5.13",
+    "@tailwindcss/vite": "4.3.3",
+    "@tanstack/router-plugin": "1.168.38",
+    "@testing-library/jest-dom": "7.0.1",
+    "@testing-library/react": "16.3.3",
+    "@testing-library/user-event": "14.6.7",
+    "@types/node": "24.13.4",
+    "@types/react": "19.2.18",
+    "@types/react-dom": "19.2.7",
+    "@vitejs/plugin-react": "6.1.1",
+    "@vitest/coverage-v8": "4.1.11",
+    "jsdom": "30.0.1",
+    "tailwindcss": "4.3.3",
+    "typescript": "6.0.3",
+    "vite": "8.3.0",
+    "vitest": "4.1.11"
+  },
+  "engines": {
+    "node": ">=22.17.0"
+  }
+}

package/templates/web/src/api-contract/api-error.ts

@@ -0,0 +1,51 @@
+export type FieldErrors = Record<string, string[]>
+
+type ProblemDocument = {
+  title?: string
+  status?: number
+  detail?: string
+  requestId?: string
+  errors?: FieldErrors
+}
+
+type AuthClientError = {
+  status: number
+  statusText: string
+  message?: string
+  code?: string
+}
+
+export class ApiError extends Error {
+  constructor(
+    readonly status: number,
+    readonly title: string,
+    readonly detail: string | undefined,
+    readonly requestId: string | undefined,
+    readonly errors: FieldErrors,
+  ) {
+    super(detail ?? title)
+  }
+
+  static async fromResponse(response: Response): Promise<ApiError> {
+    const requestId = response.headers.get('x-request-id') ?? undefined
+    const isProblem = response.headers.get('content-type')?.includes('application/problem+json')
+
+    if (!isProblem) {
+      return new ApiError(response.status, response.statusText, undefined, requestId, {})
+    }
+
+    const problem = (await response.json()) as ProblemDocument
+
+    return new ApiError(
+      response.status,
+      problem.title ?? response.statusText,
+      problem.detail,
+      problem.requestId ?? requestId,
+      problem.errors ?? {},
+    )
+  }
+
+  static fromAuthError(error: AuthClientError): ApiError {
+    return new ApiError(error.status, error.code ?? error.statusText, error.message, undefined, {})
+  }
+}

package/templates/web/src/api-contract/client.ts

@@ -0,0 +1,26 @@
+import { ApiError } from './api-error'
+
+export type Transport = typeof fetch
+
+export type ApiClient = ReturnType<typeof createClient>
+
+export function createClient({ baseUrl, fetch }: { baseUrl: string; fetch: Transport }) {
+  async function request<T>(method: string, path: string, body?: unknown): Promise<T> {
+    const response = await fetch(`${baseUrl}/api/v1${path}`, {
+      method,
+      headers: body === undefined ? undefined : { 'content-type': 'application/json' },
+      body: body === undefined ? undefined : JSON.stringify(body),
+    })
+
+    if (!response.ok) {
+      throw await ApiError.fromResponse(response)
+    }
+
+    return (await response.json()) as T
+  }
+
+  return {
+    get: <T>(path: string) => request<T>('GET', path),
+    patch: <T>(path: string, body: unknown) => request<T>('PATCH', path, body),
+  }
+}

package/templates/web/src/api-contract/index.ts

@@ -0,0 +1,10 @@
+export { ApiError, type FieldErrors } from './api-error'
+export { type ApiClient, createClient, type Transport } from './client'
+export {
+  LOCALES,
+  type Locale,
+  type Profile,
+  profileQuery,
+  type UpdateProfileRequest,
+  updateProfile,
+} from './profile'

package/templates/web/src/api-contract/profile.ts

@@ -0,0 +1,27 @@
+import { queryOptions } from '@tanstack/react-query'
+import type { ApiClient } from './client'
+
+export const LOCALES = ['en', 'pt-BR'] as const
+
+export type Locale = (typeof LOCALES)[number]
+
+export type Profile = {
+  id: string
+  userId: string
+  displayName: string
+  locale: Locale
+  timezone: string
+  createdAt: string
+  updatedAt: string
+}
+
+export type UpdateProfileRequest = Partial<Pick<Profile, 'displayName' | 'locale' | 'timezone'>>
+
+export const profileQuery = (client: ApiClient) =>
+  queryOptions({
+    queryKey: ['profile', 'me'],
+    queryFn: () => client.get<Profile>('/users/me'),
+  })
+
+export const updateProfile = (client: ApiClient, changes: UpdateProfileRequest) =>
+  client.patch<Profile>('/users/me', changes)

package/templates/web/src/app.spec.tsx

@@ -0,0 +1,12 @@
+import { screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+import { fakeTransport, json } from '../test/fake-transport'
+import { renderApp } from '../test/render-app'
+
+describe('App', () => {
+  it('sends a visitor without a session to sign in', async () => {
+    renderApp('/', fakeTransport({ 'GET /api/auth/get-session': () => json(200, null) }))
+
+    expect(await screen.findByRole('heading', { name: 'Sign in' })).toBeInTheDocument()
+  })
+})

package/templates/web/src/app.tsx

@@ -0,0 +1,14 @@
+import { QueryClientProvider } from '@tanstack/react-query'
+import { type RouterHistory, RouterProvider } from '@tanstack/react-router'
+import { useState } from 'react'
+import { createAppRouter, type RouterContext } from './router'
+
+export function App({ context, history }: { context: RouterContext; history?: RouterHistory }) {
+  const [router] = useState(() => createAppRouter(context, history))
+
+  return (
+    <QueryClientProvider client={context.queryClient}>
+      <RouterProvider router={router} />
+    </QueryClientProvider>
+  )
+}

package/templates/web/src/components/ui/button.tsx

@@ -0,0 +1,57 @@
+import { Button as ButtonPrimitive } from '@base-ui/react/button'
+import { cva, type VariantProps } from 'class-variance-authority'
+import { cn } from 'cn'
+
+const buttonVariants = cva(
+  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground hover:bg-primary/80',
+        outline:
+          'border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50',
+        secondary:
+          'bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
+        ghost:
+          'hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50',
+        destructive:
+          'bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+      size: {
+        default:
+          'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+        lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
+        icon: 'size-8',
+        'icon-xs':
+          "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+        'icon-sm':
+          'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',
+        'icon-lg': 'size-9',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  },
+)
+
+function Button({
+  className,
+  variant = 'default',
+  size = 'default',
+  ...props
+}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {
+  return (
+    <ButtonPrimitive
+      data-slot="button"
+      className={cn(buttonVariants({ variant, size, className }))}
+      {...props}
+    />
+  )
+}
+
+export { Button, buttonVariants }