CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl-labs/nextjs-api-patterns

Next.js App Router API patterns — Route Handlers, Server Actions, middleware, validation, caching, error handling

92

1.58x
Quality

90%

Does it follow best practices?

Impact

95%

1.58x

Average score across 5 eval scenarios

SecuritybySnyk

Passed

No known issues

Overview
Quality
Evals
Security
Files

criteria.jsonevals/scenario-3/

{
  "context": "Tests Server Action patterns: 'use server' directive, zod validation with field-level errors returned as state, revalidation after mutation, useActionState hook usage, and proper 'use client' on form components. The task describes a form -- the agent should use Server Actions (not a Route Handler) since this is an internal UI mutation.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "Server Action used (not Route Handler)",
      "description": "Form submission is handled by a Server Action ('use server' function) rather than a client-side fetch to an API Route Handler. The action is in a separate file or clearly marked with 'use server'.",
      "max_score": 15
    },
    {
      "name": "Zod validation with safeParse",
      "description": "The Server Action validates form fields using zod (or equivalent) with safeParse -- checking name length, email format, subject presence, message length -- not manual if-checks or unvalidated FormData",
      "max_score": 14
    },
    {
      "name": "Field-level errors returned as state",
      "description": "Validation errors are returned as structured state (e.g. { errors: { name: [...], email: [...] } }) that the form component can map to individual fields -- not thrown as exceptions or returned as a single generic string",
      "max_score": 13
    },
    {
      "name": "useActionState hook used",
      "description": "The form component uses useActionState (or useFormState) to integrate with the Server Action, providing state management and pending status for the form",
      "max_score": 10
    },
    {
      "name": "Revalidation after mutation",
      "description": "The Server Action calls revalidatePath('/contact/messages') or similar after successfully saving a message so the messages page shows the new entry",
      "max_score": 12
    },
    {
      "name": "'use client' on form component",
      "description": "The form component that uses hooks (useActionState, useState, etc.) is correctly marked with 'use client' directive",
      "max_score": 10
    },
    {
      "name": "Loading/pending state",
      "description": "The form shows a loading/pending state while the Server Action is executing -- using isPending from useActionState or useFormStatus",
      "max_score": 8
    },
    {
      "name": "Error boundary",
      "description": "An error.tsx with 'use client' directive exists for the contact route segment",
      "max_score": 8
    },
    {
      "name": "Functional implementation",
      "description": "The form submits correctly, validation errors display inline, success message shows after submission, and the messages page lists submitted contacts",
      "max_score": 10
    }
  ]
}

evals

tile.json