@getjack/jack 0.1.32 → 0.1.34

package/templates/cron/schema.sql

@@ -0,0 +1,24 @@
+CREATE TABLE IF NOT EXISTS jobs (
+  id TEXT PRIMARY KEY,
+  type TEXT NOT NULL,
+  payload TEXT NOT NULL DEFAULT '{}',
+  status TEXT NOT NULL DEFAULT 'pending',
+  attempts INTEGER NOT NULL DEFAULT 0,
+  max_attempts INTEGER NOT NULL DEFAULT 3,
+  last_error TEXT,
+  run_at INTEGER NOT NULL DEFAULT (unixepoch()),
+  created_at INTEGER NOT NULL DEFAULT (unixepoch()),
+  updated_at INTEGER NOT NULL DEFAULT (unixepoch())
+);
+
+CREATE TABLE IF NOT EXISTS webhook_events (
+  id TEXT PRIMARY KEY,
+  source TEXT NOT NULL DEFAULT 'unknown',
+  event_type TEXT,
+  payload TEXT NOT NULL,
+  status TEXT NOT NULL DEFAULT 'received',
+  created_at INTEGER NOT NULL DEFAULT (unixepoch())
+);
+
+CREATE INDEX IF NOT EXISTS idx_jobs_status_run_at ON jobs(status, run_at);
+CREATE INDEX IF NOT EXISTS idx_webhook_events_created ON webhook_events(created_at);

package/templates/cron/src/index.ts

@@ -0,0 +1,117 @@
+import { Hono } from "hono";
+import { cors } from "hono/cors";
+import { createJob, getPendingJobs, processJob, retryFailedJobs } from "./jobs";
+import { logWebhookEvent, verifyWebhookSignature } from "./webhooks";
+
+type Bindings = {
+	DB: D1Database;
+	WEBHOOK_SECRET: string;
+};
+
+const app = new Hono<{ Bindings: Bindings }>();
+
+app.use("/*", cors());
+
+app.get("/", (c) => {
+	return c.json({
+		message: "Background worker running",
+		name: "jack-template",
+	});
+});
+
+app.get("/health", (c) => {
+	return c.json({ status: "ok", timestamp: Date.now() });
+});
+
+// Cron handler - called by scheduler on POST /__scheduled
+app.post("/__scheduled", async (c) => {
+	const db = c.env.DB;
+
+	// Retry failed jobs that haven't exceeded max attempts
+	const retried = await retryFailedJobs(db);
+
+	// Get pending jobs that are ready to run
+	const jobs = await getPendingJobs(db, 10);
+	let processed = 0;
+
+	for (const job of jobs) {
+		await processJob(db, job);
+		processed++;
+	}
+
+	return c.json({ processed, retried });
+});
+
+// Webhook ingestion endpoint
+app.post("/webhook", async (c) => {
+	const db = c.env.DB;
+	const body = await c.req.text();
+	const signature = c.req.header("X-Signature") || "";
+
+	// Verify webhook signature
+	const valid = await verifyWebhookSignature(
+		body,
+		signature,
+		c.env.WEBHOOK_SECRET,
+	);
+	if (!valid) {
+		return c.json({ error: "Invalid signature" }, 401);
+	}
+
+	// Parse and log the event
+	let parsed: Record<string, unknown>;
+	try {
+		parsed = JSON.parse(body);
+	} catch {
+		return c.json({ error: "Invalid JSON body" }, 400);
+	}
+
+	const eventType = (parsed.event as string) || "unknown";
+	const source = (parsed.source as string) || "unknown";
+
+	const eventId = await logWebhookEvent(db, {
+		source,
+		eventType,
+		payload: body,
+	});
+
+	// Create a job from the webhook event for async processing
+	await createJob(db, {
+		type: `webhook.${eventType}`,
+		payload: { webhookEventId: eventId, data: parsed.data || {} },
+	});
+
+	return c.json({ received: true, id: eventId });
+});
+
+// List recent jobs
+app.get("/jobs", async (c) => {
+	const db = c.env.DB;
+
+	const { results } = await db
+		.prepare(
+			"SELECT * FROM jobs ORDER BY created_at DESC LIMIT 50",
+		)
+		.all();
+
+	return c.json({ jobs: results });
+});
+
+// Get a single job by ID
+app.get("/jobs/:id", async (c) => {
+	const db = c.env.DB;
+	const id = c.req.param("id");
+
+	const job = await db
+		.prepare("SELECT * FROM jobs WHERE id = ?")
+		.bind(id)
+		.first();
+
+	if (!job) {
+		return c.json({ error: "Job not found" }, 404);
+	}
+
+	return c.json({ job });
+});
+
+export default app;

package/templates/cron/src/jobs.ts

@@ -0,0 +1,139 @@
+export interface Job {
+	id: string;
+	type: string;
+	payload: string;
+	status: string;
+	attempts: number;
+	max_attempts: number;
+	last_error: string | null;
+	run_at: number;
+	created_at: number;
+	updated_at: number;
+}
+
+export interface CreateJobInput {
+	type: string;
+	payload?: Record<string, unknown>;
+	runAt?: number;
+}
+
+// Create a new job in the queue
+export async function createJob(
+	db: D1Database,
+	input: CreateJobInput,
+): Promise<string> {
+	const id = crypto.randomUUID();
+	const now = Math.floor(Date.now() / 1000);
+	const runAt = input.runAt || now;
+	const payload = JSON.stringify(input.payload || {});
+
+	await db
+		.prepare(
+			"INSERT INTO jobs (id, type, payload, status, attempts, max_attempts, run_at, created_at, updated_at) VALUES (?, ?, ?, 'pending', 0, 3, ?, ?, ?)",
+		)
+		.bind(id, input.type, payload, runAt, now, now)
+		.run();
+
+	return id;
+}
+
+// Get pending jobs that are ready to run
+export async function getPendingJobs(
+	db: D1Database,
+	limit = 10,
+): Promise<Job[]> {
+	const now = Math.floor(Date.now() / 1000);
+
+	const { results } = await db
+		.prepare(
+			"SELECT * FROM jobs WHERE status = 'pending' AND run_at <= ? ORDER BY run_at ASC LIMIT ?",
+		)
+		.bind(now, limit)
+		.all<Job>();
+
+	return results;
+}
+
+// Process a single job
+// Add your own processing logic in the switch statement below
+export async function processJob(db: D1Database, job: Job): Promise<void> {
+	const now = Math.floor(Date.now() / 1000);
+
+	try {
+		// Mark as running
+		await db
+			.prepare(
+				"UPDATE jobs SET status = 'running', attempts = attempts + 1, updated_at = ? WHERE id = ?",
+			)
+			.bind(now, job.id)
+			.run();
+
+		// Process based on job type
+		const payload = JSON.parse(job.payload);
+
+		switch (job.type) {
+			case "example-task":
+				// Replace with your own logic
+				console.log(`Processing example task: ${JSON.stringify(payload)}`);
+				break;
+
+			default:
+				// Webhook-created jobs and other types
+				if (job.type.startsWith("webhook.")) {
+					console.log(`Processing webhook job: ${job.type}`, payload);
+				} else {
+					console.log(`Unknown job type: ${job.type}`);
+				}
+				break;
+		}
+
+		// Mark as completed
+		await db
+			.prepare(
+				"UPDATE jobs SET status = 'completed', updated_at = ? WHERE id = ?",
+			)
+			.bind(Math.floor(Date.now() / 1000), job.id)
+			.run();
+	} catch (err) {
+		const errorMessage = err instanceof Error ? err.message : String(err);
+
+		// Mark as failed
+		await db
+			.prepare(
+				"UPDATE jobs SET status = 'failed', last_error = ?, updated_at = ? WHERE id = ?",
+			)
+			.bind(errorMessage, Math.floor(Date.now() / 1000), job.id)
+			.run();
+	}
+}
+
+// Retry failed jobs that haven't exceeded max attempts
+// Uses exponential backoff: 2^attempts * 60 seconds
+export async function retryFailedJobs(db: D1Database): Promise<number> {
+	const now = Math.floor(Date.now() / 1000);
+
+	const { results } = await db
+		.prepare(
+			"SELECT id, attempts FROM jobs WHERE status = 'failed' AND attempts < max_attempts",
+		)
+		.all<{ id: string; attempts: number }>();
+
+	let retried = 0;
+
+	for (const job of results) {
+		// Exponential backoff: 2^attempts * 60 seconds
+		const backoffSeconds = Math.pow(2, job.attempts) * 60;
+		const nextRunAt = now + backoffSeconds;
+
+		await db
+			.prepare(
+				"UPDATE jobs SET status = 'pending', run_at = ?, updated_at = ? WHERE id = ?",
+			)
+			.bind(nextRunAt, now, job.id)
+			.run();
+
+		retried++;
+	}
+
+	return retried;
+}

package/templates/cron/src/webhooks.ts

@@ -0,0 +1,95 @@
+// Convert an ArrayBuffer to hex string
+function bufferToHex(buffer: ArrayBuffer): string {
+	const bytes = new Uint8Array(buffer);
+	const hexChars: string[] = [];
+	for (const byte of bytes) {
+		hexChars.push(byte.toString(16).padStart(2, "0"));
+	}
+	return hexChars.join("");
+}
+
+// Verify HMAC-SHA256 webhook signature
+// Expected header format: sha256=<hex-encoded-signature>
+export async function verifyWebhookSignature(
+	payload: string,
+	signatureHeader: string,
+	secret: string,
+): Promise<boolean> {
+	if (!signatureHeader || !secret) {
+		return false;
+	}
+
+	// Parse the signature header
+	const parts = signatureHeader.split("=");
+	if (parts.length !== 2 || parts[0] !== "sha256") {
+		return false;
+	}
+
+	const receivedSignature = parts[1];
+	if (!receivedSignature) {
+		return false;
+	}
+
+	// Import the secret as a CryptoKey
+	const encoder = new TextEncoder();
+	const key = await crypto.subtle.importKey(
+		"raw",
+		encoder.encode(secret),
+		{ name: "HMAC", hash: "SHA-256" },
+		false,
+		["sign"],
+	);
+
+	// Sign the payload
+	const signatureBuffer = await crypto.subtle.sign(
+		"HMAC",
+		key,
+		encoder.encode(payload),
+	);
+
+	// Convert to hex and compare
+	const expectedSignature = bufferToHex(signatureBuffer);
+
+	// Constant-time comparison
+	if (receivedSignature.length !== expectedSignature.length) {
+		return false;
+	}
+
+	let mismatch = 0;
+	for (let i = 0; i < receivedSignature.length; i++) {
+		mismatch |=
+			receivedSignature.charCodeAt(i) ^ expectedSignature.charCodeAt(i);
+	}
+
+	return mismatch === 0;
+}
+
+export interface WebhookEventInput {
+	source?: string;
+	eventType?: string;
+	payload: string;
+}
+
+// Log a webhook event to D1
+export async function logWebhookEvent(
+	db: D1Database,
+	input: WebhookEventInput,
+): Promise<string> {
+	const id = crypto.randomUUID();
+	const now = Math.floor(Date.now() / 1000);
+
+	await db
+		.prepare(
+			"INSERT INTO webhook_events (id, source, event_type, payload, status, created_at) VALUES (?, ?, ?, ?, 'received', ?)",
+		)
+		.bind(
+			id,
+			input.source || "unknown",
+			input.eventType || null,
+			input.payload,
+			now,
+		)
+		.run();
+
+	return id;
+}

package/templates/cron/tsconfig.json

@@ -0,0 +1,17 @@
+{
+	"compilerOptions": {
+		"target": "ESNext",
+		"module": "ESNext",
+		"moduleResolution": "bundler",
+		"lib": ["ESNext"],
+		"types": ["@cloudflare/workers-types"],
+		"strict": true,
+		"esModuleInterop": true,
+		"skipLibCheck": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"isolatedModules": true
+	},
+	"include": ["src/**/*.ts"],
+	"exclude": ["node_modules"]
+}

package/templates/cron/wrangler.jsonc

@@ -0,0 +1,11 @@
+{
+	"name": "jack-template",
+	"main": "src/index.ts",
+	"compatibility_date": "2024-12-01",
+	"d1_databases": [
+		{
+			"binding": "DB",
+			"database_name": "jack-template-db"
+		}
+	]
+}

package/templates/miniapp/.jack.json

@@ -16,7 +16,7 @@
 		"examples": ["simple dashboard", "farcaster miniapp"]
 	},
 	"agentContext": {
-		"summary": "A Farcaster miniapp using React + Vite frontend, Hono API on Cloudflare Workers, with D1 SQLite database and AI capabilities.",
+		"summary": "A Farcaster miniapp using React + Vite frontend, Hono API backend, with D1 SQLite database and AI capabilities.",
 		"full_text": "## Project Structure\n\n- `src/App.tsx` - React application entry point\n- `src/worker.ts` - Hono API routes for backend\n- `src/hooks/useAI.ts` - AI generation hook\n- `src/components/` - React components\n- `schema.sql` - D1 database schema\n- `wrangler.jsonc` - Cloudflare Workers configuration\n\n## Conventions\n\n- API routes are defined with Hono in `src/worker.ts`\n- Frontend uses Vite for bundling and is served as static assets\n- Database uses D1 prepared statements for queries\n- Secrets are managed via jack and pushed to Cloudflare\n- Wrangler is installed globally by jack, not in project dependencies\n\n## AI Feature\n\nThe template includes a `useAI()` hook for AI text generation.\n\n### Usage\n```tsx\nconst { generate, isLoading, error } = useAI();\nconst result = await generate('Your prompt here');\n// result.result = AI response text\n// result.provider = 'openai' | 'workers-ai'\n```\n\n### Providers\n- **Workers AI** (default): Free, uses Llama 3.1 8B. No API key needed.\n- **OpenAI** (optional): Better quality with gpt-4o-mini. Requires OPENAI_API_KEY.\n\n### Costs\n- **Workers AI**: Free (included in Cloudflare Workers)\n- **OpenAI gpt-4o-mini**: ~$0.0001 per request (~$0.15/1M input + $0.60/1M output tokens)\n- Typical usage (10 requests/day): ~$0.03/month\n\n### Rate Limiting\n- 10 requests per minute per IP address\n- Returns 429 with Retry-After header when exceeded\n- Rate limit headers: X-RateLimit-Limit, X-RateLimit-Remaining\n\n## Resources\n\n- [Farcaster Miniapp Docs](https://miniapps.farcaster.xyz)\n- [Hono Documentation](https://hono.dev)\n- [Cloudflare D1 Docs](https://developers.cloudflare.com/d1)\n- [Workers AI Models](https://developers.cloudflare.com/workers-ai/models/)"
 	},
 	"hooks": {

package/templates/nextjs/.jack.json

@@ -9,7 +9,7 @@
 	},
 	"agentContext": {
 		"summary": "A Next.js app deployed with jack. Supports SSR, SSG, and React Server Components.",
-		"full_text": "## Project Structure\n\n- `app/` - Next.js App Router pages and layouts\n- `public/` - Static assets\n- `open-next.config.ts` - OpenNext configuration\n- `wrangler.jsonc` - Worker configuration\n\n## Commands\n\n- `bun run dev` - Local development\n- `jack ship` - Deploy to production\n- `bun run preview` - Preview production build locally\n\n## Conventions\n\n- Uses App Router (not Pages Router)\n- SSR and SSG work out of the box\n- Server Components supported\n\n## Resources\n\n- [OpenNext Docs](https://opennext.js.org/cloudflare)\n- [Next.js App Router](https://nextjs.org/docs/app)"
+		"full_text": "## Project Structure\n\n- `app/` - Next.js App Router pages and layouts\n- `public/` - Static assets\n- `open-next.config.ts` - OpenNext configuration\n- `wrangler.jsonc` - Worker configuration\n\n## Commands\n\n- `bun run dev` - Local development\n- `jack ship` - Deploy to production\n- `bun run preview` - Preview production build locally\n\n## Conventions\n\n- Uses App Router (not Pages Router)\n- SSR and SSG work out of the box\n- Server Components supported\n\n## OpenNext on Cloudflare — Important Rules\n\nThis app runs via OpenNext on Cloudflare Workers. Follow these rules to avoid runtime errors:\n\n### Use window.location.href instead of router.push() for full-page transitions\nOpenNext has a broken webpack chunk URL resolver. Client-side navigation via `router.push()` to pages whose chunks aren't already loaded fails with `ChunkLoadError`. Use `window.location.href` for navigations that change auth state or cross major app sections. `<Link>` components work fine because Next.js prefetches their chunks.\n\n```tsx\n// BAD — may cause ChunkLoadError\nrouter.push('/dashboard');\nrouter.refresh();\n\n// GOOD — full reload, always works\nwindow.location.href = '/dashboard';\n```\n\n### Add `export const dynamic = 'force-dynamic'` to pages using getCloudflareContext()\nWithout this, Next.js tries to statically prerender the page at build time, which fails because `getCloudflareContext()` is only available at request time.\n\n### Edge middleware cannot use Node.js APIs\nNext.js middleware runs in the edge runtime. Do not import or call anything that requires Node.js built-in modules (e.g., `perf_hooks`, `fs`, `crypto` beyond Web Crypto).\n\n### nodejs_compat flag is required\nThe `wrangler.jsonc` must include `\"compatibility_flags\": [\"nodejs_compat\"]` and a recent `compatibility_date`.\n\n## Resources\n\n- [OpenNext Docs](https://opennext.js.org/cloudflare)\n- [Next.js App Router](https://nextjs.org/docs/app)"
 	},
 	"hooks": {
 		"postDeploy": [

package/templates/nextjs-auth/.jack.json

@@ -0,0 +1,44 @@
+{
+	"name": "nextjs-auth",
+	"description": "Next.js + Better Auth (self-hosted auth with D1)",
+	"secrets": ["BETTER_AUTH_SECRET"],
+	"capabilities": ["db"],
+	"requires": ["DB"],
+	"intent": {
+		"keywords": ["auth", "login", "signup", "better-auth", "authentication", "session", "nextjs"],
+		"examples": ["app with self-hosted auth", "login system", "authenticated app"]
+	},
+	"agentContext": {
+		"summary": "A Next.js app with Better Auth self-hosted authentication, email/password login, optional GitHub/Google OAuth, and D1 database.",
+		"full_text": "## Project Structure\n\n- `app/layout.tsx` - Root layout\n- `app/page.tsx` - Landing page with sign-in CTA\n- `app/login/page.tsx` - Login page with email/password form\n- `app/signup/page.tsx` - Sign up page\n- `app/dashboard/page.tsx` - Protected dashboard\n- `app/api/auth/[...all]/route.ts` - Better Auth API handler\n- `middleware.ts` - Edge-safe cookie-based auth middleware\n- `lib/auth.ts` - Better Auth server configuration\n- `lib/auth-client.ts` - Better Auth client for client components\n- `schema.sql` - D1 database schema\n\n## Authentication\n\nUses Better Auth with email/password. Auth routes are handled at `/api/auth/*`.\nWorks immediately with zero external dependencies — just email/password.\n\n### Client-side\n```tsx\nimport { authClient } from '@/lib/auth-client';\n\n// Sign up\nawait authClient.signUp.email({ email, password, name });\n\n// Sign in\nawait authClient.signIn.email({ email, password });\n\n// Get session\nconst { data: session } = authClient.useSession();\n\n// Sign out\nawait authClient.signOut();\n```\n\n### Server-side\n```tsx\nimport { getAuth } from '@/lib/auth';\nimport { headers } from 'next/headers';\n\nconst auth = await getAuth();\nconst session = await auth.api.getSession({ headers: await headers() });\n```\n\n## Optional Social Login (Add Later)\n\nSocial providers are pre-wired but disabled by default. Add keys via `jack secrets` to enable:\n\n**GitHub** (easiest — 30 second setup):\n1. Go to github.com/settings/developers → New OAuth App\n2. Set callback URL to `https://your-app.workers.dev/api/auth/callback/github`\n3. Run: `jack secrets` and add `GITHUB_CLIENT_ID` + `GITHUB_CLIENT_SECRET`\n\n**Google**:\n1. Go to console.cloud.google.com/apis/credentials\n2. Create OAuth 2.0 Client ID\n3. Run: `jack secrets` and add `GOOGLE_CLIENT_ID` + `GOOGLE_CLIENT_SECRET`\n\nThe login form automatically shows buttons for configured providers.\n\n## Database\n\nD1 SQLite via Kysely. Tables: user, session, account, verification.\n\n## Environment Variables\n\n- `BETTER_AUTH_SECRET` - Auth token signing secret (auto-generated)\n- `GITHUB_CLIENT_ID` - GitHub OAuth client ID (optional)\n- `GITHUB_CLIENT_SECRET` - GitHub OAuth client secret (optional)\n- `GOOGLE_CLIENT_ID` - Google OAuth client ID (optional)\n- `GOOGLE_CLIENT_SECRET` - Google OAuth client secret (optional)\n\n## Cloudflare Workers Compatibility Notes\n\nBetter Auth has known compatibility issues with Cloudflare Workers. These are already handled in this template, but be aware when modifying:\n\n### NEVER call auth.api.getSession() in middleware\nNext.js edge middleware cannot use Node.js `perf_hooks` module. The middleware.ts uses cookie-only checks instead. Full session validation happens in server components.\n\n### Auth must be created per-request, not as a singleton\nD1 bindings are only available inside request handlers. The `getAuth()` helper in lib/auth.ts calls `getCloudflareContext()` on each invocation to get the D1 binding. Do NOT try to create a top-level auth instance.\n\n### Required wrangler.jsonc flags\n- `nodejs_compat` compatibility flag is required\n- Use a recent `compatibility_date` (2024-12-30 or later)\n\n### Version pinning\nBetter Auth v1.4+ had `createRequire` and `runWithRequestState` errors on Workers. If you hit module errors, try pinning to the latest working version or using `better-auth@beta`.\n\n### Do NOT use Drizzle adapter directly\nThis template uses Kysely + kysely-d1 for the database adapter. The Drizzle ORM adapter (`drizzleAdapter`) requires `drizzle-orm/d1` which has build-time initialization issues with OpenNext. Kysely works reliably with D1 in this setup.\n\n## OpenNext Navigation Rules\n\nOpenNext on Cloudflare Workers has a broken webpack chunk URL resolver (`r.u` is empty). This means dynamic chunk loading during client-side navigation can fail with `ChunkLoadError: Loading chunk X failed`.\n\n### NEVER use router.push() after auth state changes\nAfter sign-in, sign-up, or sign-out, always use `window.location.href` instead of `router.push()` + `router.refresh()`. Auth state changes need a full page reload so middleware and server components re-evaluate with the new session.\n\n```tsx\n// BAD - causes ChunkLoadError on OpenNext\nawait authClient.signOut();\nrouter.push('/');\nrouter.refresh();\n\n// GOOD - full reload ensures clean auth state\nawait authClient.signOut();\nwindow.location.href = '/';\n```\n\n### Use <Link> for in-app navigation\nNext.js `<Link>` components work because they prefetch chunks via `<script>` tags in the HTML. Only `router.push()` to pages whose chunks aren't already loaded will fail.\n\n### Add `export const dynamic = 'force-dynamic'` to pages using getCloudflareContext\nWithout this, Next.js tries to statically prerender the page at build time, which fails because `getCloudflareContext()` is only available at runtime.\n\n## Resources\n\n- [Better Auth Docs](https://www.betterauth.com/docs)\n- [Better Auth Cloudflare package](https://github.com/zpg6/better-auth-cloudflare)\n- [Hono + Better Auth on Cloudflare](https://hono.dev/examples/better-auth-on-cloudflare)\n- [OpenNext Docs](https://opennext.js.org/cloudflare)"
+	},
+	"hooks": {
+		"preCreate": [
+			{
+				"action": "require",
+				"source": "secret",
+				"key": "BETTER_AUTH_SECRET",
+				"message": "Generating authentication secret...",
+				"onMissing": "generate",
+				"generateCommand": "openssl rand -base64 32"
+			}
+		],
+		"postDeploy": [
+			{
+				"action": "clipboard",
+				"text": "{{url}}",
+				"message": "Deploy URL copied to clipboard"
+			},
+			{
+				"action": "box",
+				"title": "Auth ready: {{name}}",
+				"lines": [
+					"{{url}}",
+					"",
+					"Email/password login works out of the box.",
+					"Social login requires OAuth credentials (run jack secrets to add later)."
+				]
+			}
+		]
+	}
+}

package/templates/nextjs-auth/app/api/auth/[...all]/route.ts

@@ -0,0 +1,11 @@
+import { getAuth } from "@/lib/auth";
+
+export const dynamic = "force-dynamic";
+
+async function handler(request: Request) {
+	const auth = await getAuth();
+	return auth.handler(request);
+}
+
+export const GET = handler;
+export const POST = handler;

package/templates/nextjs-auth/app/dashboard/loading.tsx

@@ -0,0 +1,53 @@
+export default function DashboardLoading() {
+	return (
+		<div className="min-h-screen">
+			<header className="border-b border-gray-200 bg-white">
+				<div className="mx-auto flex h-14 max-w-3xl items-center justify-between px-6">
+					<div className="h-5 w-28 animate-pulse rounded bg-gray-200" />
+					<div className="h-8 w-20 animate-pulse rounded bg-gray-200" />
+				</div>
+			</header>
+
+			<main className="mx-auto max-w-3xl px-6 py-12">
+				<div className="mb-8">
+					<div className="h-8 w-40 animate-pulse rounded bg-gray-200" />
+					<div className="mt-2 h-5 w-56 animate-pulse rounded bg-gray-200" />
+				</div>
+
+				<div className="grid gap-6 sm:grid-cols-2">
+					<div className="rounded-xl border border-gray-200 bg-white p-6">
+						<div className="h-5 w-16 animate-pulse rounded bg-gray-200" />
+						<div className="mt-4 space-y-3">
+							<div>
+								<div className="h-3 w-12 animate-pulse rounded bg-gray-200" />
+								<div className="mt-1.5 h-5 w-32 animate-pulse rounded bg-gray-200" />
+							</div>
+							<div>
+								<div className="h-3 w-12 animate-pulse rounded bg-gray-200" />
+								<div className="mt-1.5 h-5 w-44 animate-pulse rounded bg-gray-200" />
+							</div>
+						</div>
+					</div>
+
+					<div className="rounded-xl border border-gray-200 bg-white p-6">
+						<div className="h-5 w-16 animate-pulse rounded bg-gray-200" />
+						<div className="mt-4 space-y-3">
+							<div>
+								<div className="h-3 w-20 animate-pulse rounded bg-gray-200" />
+								<div className="mt-1.5 h-5 w-48 animate-pulse rounded bg-gray-200" />
+							</div>
+							<div>
+								<div className="h-3 w-16 animate-pulse rounded bg-gray-200" />
+								<div className="mt-1.5 h-5 w-36 animate-pulse rounded bg-gray-200" />
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<div className="mt-8">
+					<div className="h-10 w-28 animate-pulse rounded-lg bg-gray-200" />
+				</div>
+			</main>
+		</div>
+	);
+}

package/templates/nextjs-auth/app/dashboard/page.tsx

@@ -0,0 +1,73 @@
+import { Header } from "@/components/header";
+import { UserMenu } from "@/components/user-menu";
+import { getAuth } from "@/lib/auth";
+import { headers } from "next/headers";
+import { redirect } from "next/navigation";
+
+export const dynamic = "force-dynamic";
+
+export default async function DashboardPage() {
+	const auth = await getAuth();
+	const session = await auth.api.getSession({
+		headers: await headers(),
+	});
+
+	if (!session) {
+		redirect("/login");
+	}
+
+	return (
+		<div className="min-h-screen">
+			<Header user={session.user} />
+
+			<main className="mx-auto max-w-3xl px-6 py-12">
+				<div className="mb-8">
+					<h1 className="text-2xl font-bold">Dashboard</h1>
+					<p className="mt-1 text-gray-500">
+						Welcome back, {session.user.name || session.user.email}
+					</p>
+				</div>
+
+				<div className="grid gap-6 sm:grid-cols-2">
+					<div className="rounded-xl border border-gray-200 bg-white p-6">
+						<h2 className="font-semibold">Profile</h2>
+						<div className="mt-4 space-y-3">
+							<div>
+								<p className="text-xs font-medium uppercase tracking-wide text-gray-400">Name</p>
+								<p className="mt-0.5">{session.user.name || "Not set"}</p>
+							</div>
+							<div>
+								<p className="text-xs font-medium uppercase tracking-wide text-gray-400">Email</p>
+								<p className="mt-0.5">{session.user.email}</p>
+							</div>
+						</div>
+					</div>
+
+					<div className="rounded-xl border border-gray-200 bg-white p-6">
+						<h2 className="font-semibold">Session</h2>
+						<div className="mt-4 space-y-3">
+							<div>
+								<p className="text-xs font-medium uppercase tracking-wide text-gray-400">
+									Session ID
+								</p>
+								<p className="mt-0.5 truncate font-mono text-sm text-gray-600">
+									{session.session.id}
+								</p>
+							</div>
+							<div>
+								<p className="text-xs font-medium uppercase tracking-wide text-gray-400">Expires</p>
+								<p className="mt-0.5 text-sm text-gray-600">
+									{new Date(session.session.expiresAt).toLocaleString()}
+								</p>
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<div className="mt-8">
+					<UserMenu />
+				</div>
+			</main>
+		</div>
+	);
+}

package/templates/nextjs-auth/app/error.tsx

@@ -0,0 +1,44 @@
+"use client";
+
+import { AlertCircle, RotateCcw } from "lucide-react";
+import Link from "next/link";
+
+// biome-ignore lint/suspicious/noShadowRestrictedNames: Next.js convention for error boundaries
+export default function Error({
+	error,
+	reset,
+}: {
+	error: Error & { digest?: string };
+	reset: () => void;
+}) {
+	return (
+		<div className="flex min-h-screen items-center justify-center px-4">
+			<div className="w-full max-w-sm text-center">
+				<div className="mx-auto mb-4 flex size-12 items-center justify-center rounded-full bg-red-100">
+					<AlertCircle className="size-6 text-red-600" />
+				</div>
+				<h1 className="text-xl font-bold">Something went wrong</h1>
+				<p className="mt-2 text-sm text-gray-500">
+					{error.message || "An unexpected error occurred."}
+				</p>
+				{error.digest && <p className="mt-1 text-xs text-gray-400">Error ID: {error.digest}</p>}
+				<div className="mt-6 flex items-center justify-center gap-3">
+					<button
+						type="button"
+						onClick={reset}
+						className="inline-flex items-center gap-2 rounded-lg bg-gray-900 px-4 py-2.5 text-sm font-medium text-white transition hover:bg-gray-800"
+					>
+						<RotateCcw className="size-4" />
+						Try again
+					</button>
+					<Link
+						href="/"
+						className="rounded-lg border border-gray-200 bg-white px-4 py-2.5 text-sm font-medium text-gray-700 transition hover:bg-gray-50"
+					>
+						Go home
+					</Link>
+				</div>
+			</div>
+		</div>
+	);
+}

package/templates/nextjs-auth/app/globals.css

@@ -0,0 +1 @@
+@import "tailwindcss";

package/templates/nextjs-auth/app/health/route.ts

@@ -0,0 +1,3 @@
+export function GET() {
+	return Response.json({ status: "ok", timestamp: Date.now() });
+}