Jeden Skill in Manus ausführen
mit einem Klick

Jeden Skill in Manus mit einem Klick ausführen

Loslegen

loading-empty-error-states

Sterne2

Forks0

Aktualisiert12. Juli 2026 um 12:09

Design the three states every data UI forgets. Use for any component that fetches or lists data.

Installation

Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.

In Manus ausführen

Quelle

YaoYinYing

YaoYinYing/REvoDesign

GitHub-Repository öffnen Creator-Repositorys ansehen

Download

In Manus ausführen

Verwandte BerufeSOC

Basierend auf der SOC-Berufsklassifikation

Web- und digitale SchnittstellendesignerInformatik- und Mathematikberufe·SOC 15-1255

SKILL.md

readonly

name	loading-empty-error-states
description	Design the three states every data UI forgets. Use for any component that fetches or lists data.
when_to_use	a list, a fetch, a dashboard, anything async in the UI

Loading / Empty / Error States

AI-built UIs handle the happy path and crash on the other three. Design all four:

Loading — skeletons that match the final layout (not a centered spinner that shifts everything).
Empty — a real first-run state: what it is, and the one action to fill it. Not a blank box.
Error — what failed, in human terms, plus a retry. Never a raw stack trace or silent nothing.
Partial — slow/streaming data, optimistic updates that can roll back. For each fetch in the diff, confirm all four exist. The empty and error states are where products feel broken.

Mehr aus diesem Repository

gleiches Repository

adversarial-verify

YaoYinYing/REvoDesign

Review a diff against the goal spec assuming the code is BROKEN. The reviewer that lives in the maker's head always agrees with itself — this pulls review into a hostile, separate pass. Invoke after every code change before marking work done.

2026-07-122

authz-check

YaoYinYing/REvoDesign

Verify that an endpoint checks ownership, not just authentication. Use on any handler that reads or mutates user data.

2026-07-122

bisect-regression

YaoYinYing/REvoDesign

Find the exact commit that introduced a bug. Use when something worked before and broke, and you don't know which change did it.

2026-07-122

changelog-from-diff

YaoYinYing/REvoDesign

Turn a set of commits or a diff into a clean, user-facing changelog entry. Use before a release or PR description.

2026-07-122

clean-commits

YaoYinYing/REvoDesign

Turn messy WIP into clean, atomic commits with messages that explain why. Use before opening a PR.

2026-07-122

context-budget

YaoYinYing/REvoDesign

Keep the agent's context lean so accuracy doesn't collapse. Use on long sessions, big files, or when the agent starts hallucinating.

2026-07-122

name	loading-empty-error-states
description	Design the three states every data UI forgets. Use for any component that fetches or lists data.
when_to_use	a list, a fetch, a dashboard, anything async in the UI

Loading / Empty / Error States

AI-built UIs handle the happy path and crash on the other three. Design all four:

Loading — skeletons that match the final layout (not a centered spinner that shifts everything).
Empty — a real first-run state: what it is, and the one action to fill it. Not a blank box.
Error — what failed, in human terms, plus a retry. Never a raw stack trace or silent nothing.
Partial — slow/streaming data, optimistic updates that can roll back. For each fetch in the diff, confirm all four exist. The empty and error states are where products feel broken.