Add loading, empty, error, and success states to data-driven UI components.
npx skills add https://github.com/izzoa/polyrouter --skill ss-feedback
Please help me install this Agent Skill. Skill: ss-feedback Source: https://github.com/izzoa/polyrouter/tree/main/.agents/skills/ss-feedback Command: npx skills add https://github.com/izzoa/polyrouter --skill ss-feedback
This Skill helps you turn plain, data-driven components into polished user experiences by adding the right feedback states for loading, empty results, failures, and successful actions.
Apply the ss-feedback skill to the target component file and implement loading, empty, error, and success states for each data-dependent area.
High-intent search queries and answers about installing and using this skill.
You add loading skeletons and empty states by applying layout-matched placeholders for loading and centered guidance with next actions for empty results, ensuring reduced-motion-safe animations throughout the interface.
The best way to handle error recovery in data-driven UI pages is to present plain-language failure messages with retry actions, managing both partial and full-page errors gracefully so users can recover without leaving the page.
To show success feedback and undo support after user actions in a dashboard, use confirmation toasts that appear after asynchronous updates, allowing users to immediately react to or reverse their triggered actions.
Yes, you can use toast notifications and skeleton loaders for forms that depend on async data. This approach covers loading, empty, error, and success states specifically tailored for asynchronous interfaces and user-triggered updates.
Loading states need to respect reduced-motion preferences to ensure accessibility. Skeleton placeholders must be designed with reduced-motion-safe animations so users with motion sensitivities are not negatively impacted during data fetching.
Yes, you need existing layout components to implement matching skeleton placeholders. The feedback states require layout-matched placeholders, meaning your final UI structure must exist to generate accurate loading skeletons for the data-driven areas.
algusaemCodify loading, error, and empty state patterns for React components.
stratagaOptimize popup and modal trigger strategies for conversions and user experience.
HDeiblerAudit UI markup for semantic HTML and correct ARIA usage.
syncfusionProvides Blazor UI notification primitives Toast, Message and Skeleton components with APIs, events, templates and styling for common UX patterns.
