ui-states-and-feedback
Enforces the non-happy paths every screen owes the user — loading/empty/error/content resolved in ONE switch over an AsyncValue or sealed view state, never an isLoading+error+data bool triple; a delayed skeleton shaped like the result instead of a spinner that flashes; a refresh that keeps stale content on screen; "nothing yet" distinguished from "nothing matches this filter", each with its own action; error text from a typed Failure code (never e.toString()) plus a retry that invalidates the provider; the surface ladder inline, snackbar, banner, dialog, with a modal earned only by a decision that must resolve now; soft-delete + Undo over a confirmation; showDialog's null dismissal handled as its own outcome; ScaffoldMessenger captured before an await; and announcements for eye-only changes. Use when writing loading, empty, error, or offline UI, calling AsyncValue.when, showDialog, showModalBottomSheet, showSnackBar or showMaterialBanner, or adding a confirmation, Undo, or retry.
Install
With your agent
Install OMGSkills skill "zakariaf/flutter-skills:skills/ui-states-and-feedback" into this agent's normal skills directory: call the OMGSkills MCP get_install_plan tool for your agent and run the script it returns (it installs only the pinned commit and verifies SKILL.md), and stop if MCP or the pin is unavailable. Do not overwrite or change existing skills without asking me.
Manual command
git clone https://github.com/zakariaf/Flutter-Skills /tmp/Flutter-Skills && ln -s /tmp/Flutter-Skills/skills/ui-states-and-feedback ~/.claude/skills/ui-states-and-feedback
From README
UI states and feedback Most of a screen's code is the happy path; most of its defects are not. This skill governs everything a screen shows when there is no data yet, no data at all, no data matching the filter, a failure, or a write that just returned — and which surface each of those is allowed to use. The first-frame/cold-start path belongs to app-startup-and-bootstrap; the error values belong to error-handling-typed-results. This skill is only about how they are rendered and announced. Non-negotiable rules One state, resolved in one place. A screen renders exactly one of loading / empty / error / content, chosen by a single switch over an AsyncValue or a sealed view state. Never a triple of isLoading, error, items booleans. WHY: separate flags make impossible states representable — loading and error, empty and loading — and every such combination eventually renders. The ViewModel decides the state; the View renders it.
More from this repo
accessibility-as-code
Enforces accessibility as a correctness property authored into each widget — Semantics(button/label) or...
adaptive-layout
Enforces adapting layout by available CONSTRAINTS/size, never device or platform checks — LayoutBuilder +...
ads-and-iap-monetization
Enforces opt-in, rewarded-first monetization over the service seam — a rewarded view grants exactly one benefit and...
