Update to Clerk

{
  "description": "TanStack React Start auth patterns with @clerk/tanstack-react-start - createServerFn, beforeLoad guards, loaders, Vite plugin, server middleware. Triggers on: TanStack auth, createServerFn clerk, beforeLoad protection, TanStack Start middleware.",
  "included_files": [
    {
      "relative_path": "evals/evals.json",
      "size_in_bytes": 5268
    },
    {
      "relative_path": "references/loaders.md",
      "size_in_bytes": 1793
    },
    {
      "relative_path": "references/router-guards.md",
      "size_in_bytes": 2057
    },
    {
      "relative_path": "references/server-functions.md",
      "size_in_bytes": 2152
    },
    {
      "relative_path": "references/server-setup.md",
      "size_in_bytes": 2676
    },
    {
      "relative_path": "templates/tanstack-basic-auth/package.json",
      "size_in_bytes": 513
    },
    {
      "relative_path": "templates/tanstack-basic-auth/src/router.tsx",
      "size_in_bytes": 488
    },
    {
      "relative_path": "templates/tanstack-basic-auth/src/routes/__root.tsx",
      "size_in_bytes": 808
    },
    {
      "relative_path": "templates/tanstack-basic-auth/src/routes/index.tsx",
      "size_in_bytes": 496
    },
    {
      "relative_path": "templates/tanstack-basic-auth/src/start.ts",
      "size_in_bytes": 372
    },
    {
      "relative_path": "templates/tanstack-basic-auth/tsconfig.json",
      "size_in_bytes": 531
    },
    {
      "relative_path": "templates/tanstack-basic-auth/vite.config.ts",
      "size_in_bytes": 383
    }
  ],
  "name": "clerk-tanstack-patterns",
  "skill_md_contents": "---\nname: clerk-tanstack-patterns\ndescription: 'TanStack React Start auth patterns with @clerk/tanstack-react-start\n  - createServerFn, beforeLoad guards, loaders, Vite plugin, server middleware. Triggers on: TanStack\n  auth, createServerFn clerk, beforeLoad protection, TanStack Start middleware.'\nlicense: MIT\nallowed-tools: WebFetch\nmetadata:\n  author: clerk\n  version: 1.0.0\n---\n\n# TanStack React Start Patterns\n\n## What Do You Need?\n\n| Task | Reference |\n|------|-----------|\n| Protect routes with beforeLoad | references/router-guards.md |\n| Auth in createServerFn | references/server-functions.md |\n| Pass auth to loaders | references/loaders.md |\n| Configure Vite + Clerk middleware | references/server-setup.md |\n\n## References\n\n| Reference | Description |\n|-----------|-------------|\n| `references/router-guards.md` | beforeLoad auth redirect |\n| `references/server-functions.md` | createServerFn with auth() |\n| `references/loaders.md` | Auth context in loaders |\n| `references/server-setup.md` | Vite and request middleware setup |\n\n## Setup\n\n```\nnpm install @clerk/tanstack-react-start\n```\n\n`.env`:\n```\nVITE_CLERK_PUBLISHABLE_KEY=pk_...\nCLERK_SECRET_KEY=sk_...\n```\n\n`src/start.ts` (request middleware):\n```typescript\nimport { clerkMiddleware } from '@clerk/tanstack-react-start/server'\nimport { createCsrfMiddleware, createStart } from '@tanstack/react-start'\n\nconst csrfMiddleware = createCsrfMiddleware({\n  filter: (ctx) => ctx.handlerType === 'serverFn',\n})\n\nexport const startInstance = createStart(() => {\n  return {\n    requestMiddleware: [csrfMiddleware, clerkMiddleware()],\n  }\n})\n```\n\n`src/routes/__root.tsx` — wrap with `<ClerkProvider>`:\n```tsx\nimport { ClerkProvider } from '@clerk/tanstack-react-start'\n\nfunction RootDocument({ children }: { children: React.ReactNode }) {\n  return (\n    <html lang=\"en\">\n      <body>\n        <ClerkProvider>\n          {children}\n        </ClerkProvider>\n      </body>\n    </html>\n  )\n}\n```\n\n## Mental Model\n\nTanStack Start uses the `tanstackStart()` Vite plugin. Register CSRF protection before Clerk request middleware in `src/start.ts`; auth then flows through two layers:\n\n1. **Server layer** — `createServerFn` + `auth()` from `@clerk/tanstack-react-start/server`\n2. **Router layer** — `beforeLoad` on route definitions, throws `redirect` for unauthenticated\n\nBoth layers are server-executed. Client hooks (`useAuth`, `useUser`) are React hooks for the browser side.\n\n## Minimal Pattern\n\n```typescript\nimport { createFileRoute, redirect } from '@tanstack/react-router'\nimport { createServerFn } from '@tanstack/react-start'\nimport { auth } from '@clerk/tanstack-react-start/server'\n\nconst authStateFn = createServerFn().handler(async () => {\n  const { isAuthenticated, userId } = await auth()\n  if (!isAuthenticated) {\n    throw redirect({ to: '/sign-in' })\n  }\n  return { userId }\n})\n\nexport const Route = createFileRoute('/dashboard')({\n  beforeLoad: async () => await authStateFn(),\n})\n```\n\n## Common Pitfalls\n\n| Symptom | Cause | Fix |\n|---------|-------|-----|\n| `auth()` throws \"without configuring the middleware\" | Missing `clerkMiddleware` in start.ts | Add it after CSRF middleware in `requestMiddleware` |\n| `redirect` not thrown | Using `return` instead of `throw` | `throw redirect(...)` in TanStack |\n| Wrong import for `auth` | Mixing client/server imports | Server: `@clerk/tanstack-react-start/server` |\n| Loader context missing userId | Not passing from beforeLoad | Return from beforeLoad, access via `context` |\n| `ClerkProvider` missing | Forgot root wrapping | Add to `__root.tsx` shell component |\n\n## See Also\n\n- `clerk-setup` - Initial Clerk install\n- `clerk-custom-ui` - Custom flows & appearance\n- `clerk-orgs` - B2B organizations\n\n## Docs\n\n[TanStack React Start SDK](https://clerk.com/docs/tanstack-react-start/getting-started/quickstart)\n"
}