1{
2  "skill_name": "clerk-nextjs-patterns",
3  "evals": [
4    {
5      "id": 1,
6      "prompt": "my dashboard page uses useAuth and useUser hooks with useEffect for redirect. this causes a flash of unauthenticated content. convert it to a server component using auth() from @clerk/nextjs/server instead.",
7      "expected_output": "Converts dashboard from client component with hooks to server component with auth(), removes useEffect redirect pattern",
8      "scaffold": "nextjs-basic-auth",
9      "assertions": [
10        "Removes 'use client' directive from dashboard page",
11        "Replaces useAuth/useUser hooks with auth() from @clerk/nextjs/server",
12        "Uses server-side redirect() from next/navigation instead of useEffect + router.push",
13        "Removes useEffect, useRouter, isLoaded checks",
14        "Page still displays user data (userId from auth or currentUser)"
15      ]
16    },
17    {
18      "id": 2,
19      "prompt": "my api route at app/api/data/route.ts has no auth protection. anyone can access the data. add clerk auth to this api route so only authenticated users can get the data, and return 401 for unauthenticated requests.",
20      "expected_output": "Adds auth() check to API route, returns 401 for unauthenticated requests",
21      "scaffold": "nextjs-basic-auth",
22      "assertions": [
23        "Imports auth from @clerk/nextjs/server",
24        "Calls auth() at the top of the GET handler",
25        "Returns 401 status when userId is null",
26        "Only returns data when user is authenticated",
27        "Does NOT use client-side hooks in the API route"
28      ]
29    },
30    {
31      "id": 3,
32      "prompt": "my homepage is a client component that uses useUser to check if the user is signed in. convert it to use clerk's Show component pattern instead so it can be a server component with conditional rendering.",
33      "expected_output": "Converts home page to use Show (preferred in Core 3) or SignedIn/SignedOut (Core 2) components instead of useUser hook",
34      "scaffold": "nextjs-basic-auth",
35      "assertions": [
36        "Removes 'use client' directive from home page",
37        "Removes useUser hook import and usage",
38        "Uses Show with when='signed-in' (preferred) OR SignedIn/SignedOut components from @clerk/nextjs for conditional rendering",
39        "Preserves the same visual output (welcome message when signed in, sign-in prompt when not)",
40        "Page works as a server component"
41      ]
42    },
43    {
44      "id": 4,
45      "prompt": "i need to protect all routes under /dashboard with clerk middleware instead of checking auth in each page component. update the middleware to use createRouteMatcher so only / and /sign-in are public.",
46      "expected_output": "Updates middleware.ts to use createRouteMatcher with public routes, protecting /dashboard and all sub-routes",
47      "scaffold": "nextjs-basic-auth",
48      "assertions": [
49        "Imports createRouteMatcher from @clerk/nextjs/server",
50        "Defines public routes array including / and /sign-in",
51        "Uses auth.protect() for non-public routes inside clerkMiddleware callback",
52        "Middleware protects /dashboard, /profile, and /api routes",
53        "Does NOT remove the clerkMiddleware wrapper"
54      ]
55    },
56    {
57      "id": 5,
58      "prompt": "i need to call an external API (Hasura GraphQL) from my Next.js server component. get a custom JWT using a template called 'hasura' and pass it in the Authorization header.",
59      "expected_output": "Uses getToken with template parameter from auth() server-side, passes as Bearer token to external API",
60      "scaffold": "nextjs-basic-auth",
61      "assertions": [
62        "Uses getToken with a template parameter (e.g. 'hasura') to get a custom JWT",
63        "Uses either auth() server-side or useAuth() client-side to access getToken",
64        "Passes the token as Authorization Bearer header to the external API call",
65        "Handles the case where getToken returns null (user not authenticated)"
66      ]
67    },
68    {
69      "id": 6,
70      "prompt": "i have a standalone Node.js API server that receives requests with a Clerk session token in the Authorization header. i need to verify the JWT signature and check if the user is authenticated. i don't want to use Clerk middleware, just manual verification.",
71      "expected_output": "Manually verifies Clerk JWT using jsonwebtoken or @clerk/backend verifyToken, checks claims",
72      "scaffold": "nextjs-basic-auth",
73      "assertions": [
74        "Extracts the token from the Authorization Bearer header",
75        "Verifies the token using either jsonwebtoken with CLERK_PEM_PUBLIC_KEY or @clerk/backend verifyToken",
76        "Checks token expiration (exp claim) and not-before (nbf claim)",
77        "Returns 401 for invalid or expired tokens",
78        "Returns the decoded claims or user data on successful verification"
79      ]
80    }
81  ]
82}
83