create-top-secret-starter 0.14.0 → 0.16.0

package/backend-overlay/remove.json

@@ -1,11 +1,6 @@
 [
   "src/mocks",
   "src/api/notes/schema.ts",
-  "src/api/orders/schema.ts",
-  "src/api/orders/orders.test.ts",
-  "src/api/live/schema.ts",
-  "src/api/live/feed.ts",
-  "src/api/live/live.test.ts",
   "src/api/notes/notes.test.ts",
   "src/routes/_authenticated/notes",
   "src/api/auth/schema.ts",

package/backend-overlay/web/src/api/index.ts

@@ -17,6 +17,10 @@ export const api = treaty<App>(baseUrl, {
 export const isNotFound = (error: unknown) =>
   error instanceof EdenFetchError && error.status === 404
 
+// a loader that outran the sign-out: the error boundary waits for the redirect instead of showing 500
+export const isUnauthorized = (error: unknown) =>
+  error instanceof EdenFetchError && error.status === 401
+
 // `throwHttpError` already turns failures into exceptions, so a null body is a contract break
 export const unwrap = <T>({ data }: { data: T | null }): T => {
   if (data === null) throw new Error('Empty response')

package/backend-overlay/web/src/routes/_authenticated/index.tsx

@@ -1,15 +1,8 @@
 import { createFileRoute } from '@tanstack/react-router'
 
 import { useSession } from '@/api/auth'
-// realtime:start
-import { liveSnapshotQuery } from '@/api/live'
-import { Dashboard } from '@/components/dashboard/dashboard'
-// realtime:end
 
 export const Route = createFileRoute('/_authenticated/')({
-  // realtime:start
-  loader: ({ context }) => context.queryClient.query({ ...liveSnapshotQuery, staleTime: 'static' }),
-  // realtime:end
   component: HomePage
 })
 
@@ -22,9 +15,6 @@ function HomePage() {
         <h1 className='text-2xl font-semibold'>PLACEHOLDER</h1>
         <p className='text-sm text-muted-foreground'>Signed in as {session?.user.email}</p>
       </div>
-      {/* realtime:start */}
-      <Dashboard />
-      {/* realtime:end */}
     </main>
   )
 }

package/backend-overlay/web-start/src/api/index.ts

@@ -20,6 +20,10 @@ export const api = treaty<App>(baseUrl, {
 export const isNotFound = (error: unknown) =>
   error instanceof EdenFetchError && error.status === 404
 
+// a loader that outran the sign-out: the error boundary waits for the redirect instead of showing 500
+export const isUnauthorized = (error: unknown) =>
+  error instanceof EdenFetchError && error.status === 401
+
 // `throwHttpError` already turns failures into exceptions, so a null body is a contract break
 export const unwrap = <T>({ data }: { data: T | null }): T => {
   if (data === null) throw new Error('Empty response')

package/index.js

@@ -4,7 +4,7 @@ import fs from 'node:fs'
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { parseArgs } from 'node:util'
-import { cancel, intro, isCancel, multiselect, outro, select, text } from '@clack/prompts'
+import { cancel, intro, isCancel, outro, select, text } from '@clack/prompts'
 
 import { writeGithubConfig } from './github-config.js'
 import { filesWithMarker, stripMarkers } from './markers.js'
@@ -20,17 +20,6 @@ const ROUTERS = Object.keys(ROUTER_LABELS)
 const NAME_RE = /^[a-z0-9][a-z0-9._-]*$/
 // web-side runtime deps the backend variant adds (the api types come in as a devDep)
 const BACKEND_WEB_DEPS = { '@elysia/eden': '^1.4.10', 'better-auth': '^1.7.3' }
-// optional example features; features.json lists what each one removes when it is off
-const FEATURES = {
-  sidebar: { label: 'Sidebar shell', hint: 'collapsible nav, ⌘B, state persisted' },
-  table: {
-    label: 'Orders table',
-    hint: 'TanStack Table, URL-synced sorting, pin and drag columns'
-  },
-  realtime: { label: 'Live dashboard', hint: 'WebSocket metrics feed, recharts' }
-}
-const FEATURE_IDS = Object.keys(FEATURES)
-
 // flags bypass prompts so the CLI works in CI
 const { values: flags, positionals } = parseArgs({
   args: process.argv.slice(2),
@@ -38,7 +27,6 @@ const { values: flags, positionals } = parseArgs({
   options: {
     pm: { type: 'string' },
     router: { type: 'string' },
-    features: { type: 'string' },
     backend: { type: 'boolean' },
     'no-backend': { type: 'boolean' },
     redis: { type: 'boolean' },
@@ -109,26 +97,6 @@ router ??= must(
   })
 )
 
-// `--features table,realtime` or `--features none`; no flag and no TTY means everything
-let features = flags.features
-  ?.split(',')
-  .map(f => f.trim())
-  .filter(f => f && f !== 'none')
-const unknownFeatures = features?.filter(f => !FEATURE_IDS.includes(f)) ?? []
-if (unknownFeatures.length > 0) {
-  cancel(`Unknown feature(s) ${unknownFeatures.join(', ')}. Expected: ${FEATURE_IDS.join(', ')}`)
-  process.exit(1)
-}
-if (features === undefined && !process.stdin.isTTY) features = FEATURE_IDS
-features ??= must(
-  await multiselect({
-    message: 'Example features? (space to toggle)',
-    required: false,
-    initialValues: FEATURE_IDS,
-    options: FEATURE_IDS.map(value => ({ value, ...FEATURES[value] }))
-  })
-)
-
 // Elysia runs on Bun, so the backend is only offered when bun is the package manager.
 const flagPair = (on, off) => {
   if (on) return true
@@ -248,11 +216,10 @@ const substitute = (file, pairs) =>
       return text.replaceAll(from, to)
     }, source)
   )
-// the project name lands in the document title/description and the demo home page
+// the project name lands in the document title/description and the sidebar brand
 const nameTargets = base => [
   path.join(base, 'index.html'),
   path.join(base, 'src', 'site.ts'),
-  path.join(base, 'src', 'routes', '_authenticated', 'index.tsx'),
   path.join(base, 'src', 'components', 'app-sidebar.tsx')
 ]
 const applyName = files => {
@@ -373,6 +340,11 @@ const applyBackendOverlay = () => {
     pkg.devDependencies.oxfmt = templatePkg.devDependencies.oxfmt
     pkg.devDependencies.oxlint = templatePkg.devDependencies.oxlint
     pkg.devDependencies['oxlint-tsgolint'] = templatePkg.devDependencies['oxlint-tsgolint']
+    // oxlint resolves JS plugins from the config's own directory
+    pkg.devDependencies['@shadcn/lint'] = templatePkg.devDependencies['@shadcn/lint']
+    pkg.devDependencies = Object.fromEntries(
+      Object.entries(pkg.devDependencies).sort(([a], [b]) => a.localeCompare(b))
+    )
   })
 
   applyName(nameTargets(path.join(targetDir, 'apps', 'web')))
@@ -416,27 +388,6 @@ if (backend) {
   }
 }
 
-// features: drop the files a deselected feature owns, then resolve its markers everywhere
-const featureSpecs = JSON.parse(fs.readFileSync(path.join(cliRoot, 'features.json'), 'utf8'))
-const rmAll = (base, files = []) => {
-  for (const file of files) fs.rmSync(path.join(base, file), { recursive: true, force: true })
-}
-for (const id of FEATURE_IDS) {
-  const on = features.includes(id)
-  const spec = featureSpecs[id][on ? 'on' : 'off'] ?? {}
-  rmAll(webDir, spec.remove)
-  if (backend) rmAll(path.join(targetDir, 'apps', 'api'), spec.apiRemove)
-  for (const [from, to] of Object.entries(spec.rename ?? {})) {
-    fs.renameSync(path.join(webDir, from), path.join(webDir, to))
-  }
-  if (spec.deps?.length) {
-    editJson(path.join(webDir, 'package.json'), pkg => {
-      for (const dep of spec.deps) delete pkg.dependencies[dep]
-    })
-  }
-  applyMarkersIn(targetDir, id, on)
-}
-
 if (router === 'start') {
   fs.appendFileSync(
     path.join(webDir, '.env.example'),
@@ -461,7 +412,7 @@ if (git) {
   }
 }
 
-const label = `${ROUTER_LABELS[router]}${backend ? ' + Elysia/Drizzle/Better Auth' : ''}${redis ? ' + Redis' : ''}${features.length > 0 ? ` · ${features.join(', ')}` : ''}`
+const label = `${ROUTER_LABELS[router]}${backend ? ' + Elysia/Drizzle/Better Auth' : ''}${redis ? ' + Redis' : ''}`
 const steps = backend
   ? [
       ...(inPlace ? [] : [`cd ${target}`]),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-top-secret-starter",
-  "version": "0.14.0",
+  "version": "0.16.0",
   "description": "Scaffold a Vite + React 19 + TypeScript + shadcn starter with TanStack Router",
   "keywords": [
     "create",

package/templates/template-api/CLAUDE.md

@@ -8,12 +8,6 @@ server needed.
   `src/modules/<feature>/{index,service,model}.ts` — controller / plain factory
   service / `t` schemas. Services never touch `Context`; one Elysia instance is one
   controller.
-- Optional example modules: `modules/orders` (server-side paging/sorting/filtering, between
-  `table` start/end markers) and `modules/live` (a WebSocket feed: `hub.ts` is a
-  per-process ring buffer + ticker, `index.ts` the `/api/live` socket and snapshot, between
-  `realtime` start/end markers). `create-cli` strips a deselected feature the same way
-  it strips Redis. Multi-instance deployments need a shared bus behind `hub.start`'s
-  broadcast function.
 - `src/app.ts` is the Eden boundary: no Bun globals, no `process.env`, deps injected
   via `createApp`.
 - Wire values are JSON-shaped (`createdAt` is an ISO string, not `Date`) so Eden's

package/templates/template-api/src/app.test.ts

@@ -6,9 +6,6 @@ import { beforeAll, describe, expect, it } from 'vitest'
 
 import { createApp, type App } from './app'
 import { createAuth } from './modules/auth/service'
-// realtime:start
-import { createLiveHub } from './modules/live/hub'
-// realtime:end
 import type { Db } from './db'
 import * as schema from './db/schema'
 
@@ -25,10 +22,7 @@ beforeAll(async () => {
   })
   app = createApp({
     db,
-    auth,
-    // realtime:start
-    hub: createLiveHub({ db })
-    // realtime:end
+    auth
   })
 })
 
@@ -60,13 +54,6 @@ const signUp = async (email: string) => {
     .join('; ')
 }
 
-// realtime:start
-const userId = async (cookie: string) => {
-  const res = await json('/api/auth/get-session', { cookie })
-  return ((await res.json()) as { user: { id: string } }).user.id
-}
-// realtime:end
-
 describe('app', () => {
   it('serves health without a session', async () => {
     const res = await json('/api/health')
@@ -91,10 +78,7 @@ describe('app', () => {
       auth: {
         handler: () => new Response(),
         api: { getSession: async () => ({ user: { id: 'u' }, session: {} }) }
-      } as never,
-      // realtime:start
-      hub: createLiveHub({ db: {} as never })
-      // realtime:end
+      } as never
     })
     const res = await broken.handle(new Request('http://localhost/api/notes'))
     expect(res.status).toBe(500)
@@ -141,155 +125,3 @@ describe('notes', () => {
     expect(res.status).toBe(422)
   })
 })
-
-// table:start
-describe('orders', () => {
-  it('pages, filters and sorts server-side, scoped to the owner', async () => {
-    const dave = await signUp('dave@example.com')
-    const erin = await signUp('erin@example.com')
-    const seed = [
-      { customer: 'Zed', email: 'zed@example.com', amountCents: 300 },
-      { customer: 'Amy', email: 'amy@example.com', amountCents: 100 },
-      { customer: 'Bob', email: 'bob@example.com', amountCents: 200 }
-    ]
-    const ids = await Promise.all(
-      seed.map(async body => {
-        const res = await json('/api/orders', {
-          method: 'POST',
-          cookie: dave,
-          body: JSON.stringify(body)
-        })
-        expect(res.status).toBe(201)
-        return ((await res.json()) as { id: string }).id
-      })
-    )
-
-    const sortedRes = await json('/api/orders?sort=amountCents&order=asc&pageSize=10', {
-      cookie: dave
-    })
-    expect(sortedRes.status, await sortedRes.clone().text()).toBe(200)
-    const sorted = (await sortedRes.json()) as { items: { amountCents: number }[]; total: number }
-    expect(sorted.total).toBe(3)
-    expect(sorted.items.map(o => o.amountCents)).toEqual([100, 200, 300])
-
-    const paged = (await (
-      await json('/api/orders?page=2&pageSize=10', { cookie: dave })
-    ).json()) as {
-      items: unknown[]
-    }
-    expect(paged.items).toEqual([])
-
-    await json(`/api/orders/${ids[0]}`, {
-      method: 'PATCH',
-      cookie: dave,
-      body: JSON.stringify({ status: 'paid' })
-    })
-    const paid = (await (await json('/api/orders?status=paid', { cookie: dave })).json()) as {
-      items: { id: string }[]
-    }
-    expect(paid.items.map(o => o.id)).toEqual([ids[0]])
-
-    const theirs = (await (await json('/api/orders', { cookie: erin })).json()) as { total: number }
-    expect(theirs.total).toBe(0)
-    const foreign = await json(`/api/orders/${ids[0]}`, { cookie: erin })
-    expect(foreign.status).toBe(404)
-  })
-
-  it('rejects an unknown sort column instead of guessing', async () => {
-    const cookie = await signUp('fay@example.com')
-    const res = await json('/api/orders?sort=password', { cookie })
-    expect(res.status).toBe(422)
-  })
-
-  it('rejects a fractional page instead of failing at the database', async () => {
-    const cookie = await signUp('gil@example.com')
-    const res = await json('/api/orders?page=1.5', { cookie })
-    expect(res.status).toBe(422)
-  })
-
-  it('searches for `_` as a character, not as a wildcard', async () => {
-    const cookie = await signUp('hana@example.com')
-    await Promise.all(
-      ['5_10 Ticket', '5A10 Ticket'].map(customer =>
-        json('/api/orders', {
-          method: 'POST',
-          cookie,
-          body: JSON.stringify({ customer, email: 'buyer@example.com', amountCents: 100 })
-        })
-      )
-    )
-
-    const res = await json('/api/orders?q=5_10', { cookie })
-    const found = (await res.json()) as { items: { customer: string }[] }
-    expect(found.items.map(o => o.customer)).toEqual(['5_10 Ticket'])
-  })
-})
-// table:end
-
-// realtime:start
-describe('live', () => {
-  it('serves the snapshot to a session and nobody else', async () => {
-    expect((await json('/api/live/snapshot')).status).toBe(401)
-
-    const cookie = await signUp('gus@example.com')
-    const res = await json('/api/live/snapshot', { cookie })
-    expect(res.status).toBe(200)
-    // the hub is shared across this file: other tests may already have posted activity
-    expect(await res.json()).toMatchObject({ metrics: [] })
-  })
-
-  it('a tick measures live sessions and broadcasts the frame', async () => {
-    const cookie = await signUp('hal@example.com')
-    const hub = createLiveHub({ db })
-    const frames: string[] = []
-    hub.join(await userId(cookie))
-
-    // stop before the first tick resolves: the interval must never add a second frame
-    const first = hub.start((_userId, frame) => frames.push(frame))
-    hub.stop()
-    await first
-
-    expect(frames).toHaveLength(1)
-    const event = JSON.parse(frames[0]!) as { type: string; data: { activeUsers: number } }
-    expect(event.type).toBe('metrics')
-    expect(event.data.activeUsers).toBeGreaterThan(0)
-    expect(hub.snapshot(await userId(cookie)).metrics).toEqual([event.data])
-  })
-
-  it('reports each viewer only their own revenue', async () => {
-    const seller = await signUp('ivy@example.com')
-    const bystander = await signUp('jo@example.com')
-    await json('/api/orders', {
-      method: 'POST',
-      cookie: seller,
-      body: JSON.stringify({ customer: 'Ivy Buyer', email: 'b@example.com', amountCents: 7_500 })
-    })
-
-    const hub = createLiveHub({ db })
-    const frames = new Map<string, { revenueCents: number; orders: number }>()
-    hub.join(await userId(seller))
-    hub.join(await userId(bystander))
-    const first = hub.start((id, frame) => {
-      frames.set(id, (JSON.parse(frame) as { data: { revenueCents: number; orders: number } }).data)
-    })
-    hub.stop()
-    await first
-
-    expect(frames.get(await userId(seller))).toMatchObject({ revenueCents: 7_500, orders: 1 })
-    expect(frames.get(await userId(bystander))).toMatchObject({ revenueCents: 0, orders: 0 })
-  })
-
-  it('keeps one tab open when a second one closes', async () => {
-    const cookie = await signUp('kit@example.com')
-    const hub = createLiveHub({ db })
-    const id = await userId(cookie)
-    hub.join(id)
-    hub.join(id)
-    hub.leave(id)
-
-    hub.activity(id, 'order', 'still watching')
-
-    expect(hub.snapshot(id).activity).toHaveLength(1)
-  })
-})
-// realtime:end

package/templates/template-api/src/app.ts

@@ -4,22 +4,12 @@ import { Elysia } from 'elysia'
 import type { Db } from './db'
 import { createAuthController } from './modules/auth'
 import type { Auth } from './modules/auth/service'
-// realtime:start
-import { createLiveController } from './modules/live'
-import type { LiveHub } from './modules/live/hub'
-// realtime:end
 import { createNotesController } from './modules/notes'
-// table:start
-import { createOrdersController } from './modules/orders'
-// table:end
 
 export type AppDeps = {
   db: Db
   auth: Auth
   corsOrigins?: string[]
-  // realtime:start
-  hub: LiveHub
-  // realtime:end
 }
 
 // no Bun globals or `process.env`: the web app imports this type via Eden
@@ -36,20 +26,6 @@ export const createApp = (deps: AppDeps) => {
     .use(createAuthController(auth))
     .get('/api/health', () => ({ ok: true }))
     .use(createNotesController({ db, auth }))
-    // table:start
-    .use(
-      createOrdersController({
-        db,
-        auth,
-        // realtime:start
-        hub: deps.hub
-        // realtime:end
-      })
-    )
-    // table:end
-    // realtime:start
-    .use(createLiveController({ hub: deps.hub, auth }))
-  // realtime:end
   return app
 }
 

package/templates/template-api/src/db/schema.ts

@@ -1,7 +1,4 @@
 import { index, pgTable, text, timestamp } from 'drizzle-orm/pg-core'
-// table:start
-import { integer, pgEnum } from 'drizzle-orm/pg-core'
-// table:end
 
 import { user } from './auth-schema'
 
@@ -22,36 +19,3 @@ export const note = pgTable(
   },
   table => [index('note_user_id_idx').on(table.userId)]
 )
-
-// table:start
-export const orderStatus = pgEnum('order_status', [
-  'pending',
-  'paid',
-  'shipped',
-  'refunded',
-  'cancelled'
-])
-
-// Demo resource for the orders table: server-side paging, sorting and filtering.
-export const order = pgTable(
-  'order',
-  {
-    id: text('id')
-      .primaryKey()
-      .$defaultFn(() => crypto.randomUUID()),
-    userId: text('user_id')
-      .notNull()
-      .references(() => user.id, { onDelete: 'cascade' }),
-    customer: text('customer').notNull(),
-    email: text('email').notNull(),
-    amountCents: integer('amount_cents').notNull(),
-    currency: text('currency').notNull().default('USD'),
-    status: orderStatus('status').notNull().default('pending'),
-    createdAt: timestamp('created_at').defaultNow().notNull()
-  },
-  table => [
-    index('order_user_id_idx').on(table.userId),
-    index('order_created_at_idx').on(table.createdAt)
-  ]
-)
-// table:end

package/templates/template-api/src/index.ts

@@ -2,10 +2,6 @@ import { createApp } from './app'
 import { createDb } from './db'
 import { env } from './env'
 import { createAuth } from './modules/auth/service'
-// realtime:start
-import { liveTopic } from './modules/live'
-import { createLiveHub } from './modules/live/hub'
-// realtime:end
 // redis:start
 import { createRedis } from './redis'
 // redis:end
@@ -24,29 +20,17 @@ const auth = createAuth({
   // redis:end
 })
 
-// realtime:start
-const hub = createLiveHub({ db })
-// realtime:end
 const app = createApp({
   db,
   auth,
-  corsOrigins: env.CORS_ORIGINS,
-  // realtime:start
-  hub
-  // realtime:end
+  corsOrigins: env.CORS_ORIGINS
 }).listen(env.PORT)
-// realtime:start
-void hub.start((userId, frame) => app.server?.publish(liveTopic(userId), frame))
-// realtime:end
 
 console.log(`api listening on http://${app.server?.hostname}:${app.server?.port}`)
 
 // SIGTERM on redeploy: drain in-flight requests, then release the pool
 const shutdown = async (signal: string) => {
   console.log(`${signal} received, shutting down`)
-  // realtime:start
-  hub.stop()
-  // realtime:end
   await app.stop()
   await db.$client.end({ timeout: 5 })
   // redis:start

package/templates/template-router/.claude/settings.json

@@ -17,7 +17,7 @@
             "type": "command",
             "statusMessage": "Formatting & linting changed file...",
             "timeout": 30,
-            "command": "f=$(jq -r '.tool_input.file_path // .tool_response.filePath // empty'); cd \"$CLAUDE_PROJECT_DIR\" 2>/dev/null || exit 0; case \"$f\" in *.ts|*.tsx|*.js|*.mjs|*.cjs) node_modules/.bin/oxfmt \"$f\" >/dev/null 2>&1; node_modules/.bin/oxlint --fix \"$f\" >/dev/null 2>&1;; *.json|*.jsonc|*.md|*.css|*.html|*.yml|*.yaml) node_modules/.bin/oxfmt \"$f\" >/dev/null 2>&1;; esac; exit 0"
+            "command": "command -v jq >/dev/null || exit 0; f=$(jq -r '.tool_input.file_path // .tool_response.filePath // empty'); cd \"$CLAUDE_PROJECT_DIR\" 2>/dev/null || exit 0; case \"$f\" in *.ts|*.tsx|*.js|*.mjs|*.cjs) node_modules/.bin/oxfmt \"$f\" >/dev/null 2>&1; node_modules/.bin/oxlint --fix \"$f\" >/dev/null 2>&1;; *.json|*.jsonc|*.md|*.css|*.html|*.yml|*.yaml) node_modules/.bin/oxfmt \"$f\" >/dev/null 2>&1;; esac; exit 0"
           }
         ]
       }

package/templates/template-router/.claude/skills/project-conventions/SKILL.md

@@ -83,6 +83,10 @@ primitives. `routes/sign-in.tsx` is the reference implementation;
 Reuse the request schema from the feature's `schema.ts` as the form schema where the
 shapes match; two schemas for one payload drift apart.
 
+A component that calls `reset()` needs `'use no memo'`: the React Compiler memoizes
+`register()`, so RHF never re-attaches the fields it dropped and the next submit sees
+empty values.
+
 ## Routes
 
 File-based under `src/routes/`.