/harden
Production-readiness pass — audits and implements the full non-happy-path matrix: loading skeletons, empty states, error messages, partial data, i18n, offline, permissions, and first-run guidance. Use when preparing a surface for production or when the user says "it crashes on
One skill from ui-craft.
shell
$ npx -y skills add educlopez/ui-craft --skill harden --agent claude-codeInstalls just this skill. Get the whole plugin for auto-invocation.
How it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfClaude auto-loads it when your prompt matches the work.
- You can call itInvoke it directly when you want it.
- Slash command
/harden
Context preview
The summary Claude sees to decide when to auto-load this skill.
Production-readiness pass — audits and implements the full non-happy-path matrix: loading skeletons, empty states, error messages, partial data, i18n, offline, permissions, and first-run guidance. Use when preparing a surface for production or when the user says "it crashes on
Stats
Stars209
Forks9
LanguageGo
LicenseMIT
Ships with ui-craft
SKILL.md
harden.SKILL.md
--- name: harden description: "Production-readiness pass — audits and implements the full non-happy-path matrix: loading skeletons, empty states, error messages, partial data, i18n, offline, permissions, and first-run guidance. Use when preparing a surface for production or when the user says "it crashes on empty data" / "there's no loading state" / "harden this". Invoke when the user asks for harden on their UI, or mentions 'harden' alongside design / UI / frontend work." --- <!-- HARNESS MIRROR — do not edit here. Canonical source: skills/ or commands/. After editing source, copy into cli/assets/<harness>/ and repo-root harness mirrors. --> **Context:** this sub-skill is one lens of the broader `ui-craft` skill. If the `ui-craft` skill is also installed, read its SKILL.md first for Discovery + Anti-Slop + Craft Test, then apply the specific lens below. Harden the UI at the target the user described for production. Load the `ui-craft` skill. **Coverage matrix — check every key surface:** 1. **Loading** — skeletons match the final layout (no CLS on resolve), shown after ~200ms to avoid flash on fast responses. Never a generic centered spinner when a skeleton is possible. 2. **Empty** — purposeful: one line explaining why it's empty + one clear primary action. Illustration optional, CTA mandatory. 3. **Error** — inline, actionable. "Save failed. Try again / Copy error / Contact support" — never just "Something went wrong." Surface the *what* and the *next step*. 4. **Partial data** — `—` (em dash) for missing metrics, never `N/A` or `null` or `0` when the value is truly unknown. 5. **Long content** — truncation with `title` tooltip, `text-overflow: ellipsis`, container queries for constrained regions. Test with a 120-character name.
