Generator Error UX Improvements

[GeorgeBPrice]

Generator Error UX Improvements

Summary

This branch polishes the error messaging experience, derived from the hardened prompt security measures previously implemented:

1. Friendly, status-aware error messages — a single mapper turns the structured error / reason / field payloads from /api/generate into user-readable copy that doesn't leak which specific filter fired.
2. Inline hardening alert above the Generate button — prompt-security rejections (400 jailbreak/off-topic, 422 off-topic refusal, 429 concurrency cap, etc.) now render in-card next to the user's input rather than as a transient toast. The alert has an error icon, an always-visible title, and a click-to-expand description; the user can dismiss it explicitly.

---

Friendly error mapper

Why. The route returns structured fields (error, reason, field, details) but the UI was previously reading only errorData.message and falling back to status text. That meant our new 400/422/429 responses surfaced as Error 422: Unprocessable Entity — useless to the user.

Implementation (lib/generator-errors.ts):

• Single function friendlyGenerationError(status, body) → { title, description, kind }.
• kind: "hardening" | "limit" | "other" lets the UI decide where to show the message:
  • hardening → inline alert above the Generate button (component below).
  • limit → toast (daily-quota / auth, where the user typically expects a transient notification).
  • other → toast (server errors, network, unknown).
• Messages are deliberately generic — they tell the user which field is wrong (Examples, Additional Instructions) without echoing the matched phrase or naming the heuristic. Maintainers see the precise reason in server logs.

Status / reason coverage:

Status / reason	Kind	Title
422 off_topic_refusal	hardening	Request not recognised as a mock-data ask
422 sql_dangerous_statement	hardening	Generated SQL was rejected
422 (other)	hardening	Generation refused
429 concurrency_limit	hardening	Too many concurrent generations
429 (other)	limit	Daily limit reached
403	limit	Daily limit reached
400 jailbreak_phrase / off_topic	hardening	Request looks off-topic
400 byo_key_required	hardening	Additional Instructions need your own key
400 with details	hardening	Invalid request
400 (other)	hardening	Request rejected
401	limit	Sign-in required
5xx	other	Service problem
fallback	other	Generation Failed (<status>)

Inline hardening alert

Why. Toasts are wrong for hardening errors because:

• They disappear after a few seconds, so the user can't easily re-read what they need to fix.
• They appear in the corner, away from the input field they need to edit.
• They get drowned out if the user retries and triggers a second toast.

A persistent, dismissible inline alert next to the Generate button keeps the user's attention on the field they need to change and stays visible until they fix it or dismiss it.

Implementation (components/generator/hardening-alert.tsx):

Files added

File	Purpose
lib/generator-errors.ts	friendlyGenerationError(status, body) → { title, description, kind } mapper
components/generator/hardening-alert.tsx	Inline collapsible alert for prompt-hardening rejections

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
ai-mocker	Ignored		May 6, 2026 0:23am