debug-async-uilisted

# Debug Async UI Use this skill before changing visuals for async interaction bugs. Prove which layer owns the failure: event, state, data, lifecycle, or render. ## Workflow 1. Reproduce the original symptom first. Capture the user action, the immediate UI state, and the final UI state after async work completes. 2. Add a slow-request regression test before the fix. Simulate 200-500 ms API, database, provider, or store delay. Assert: - the immediate intermediate state is visible after the action; - the final returned state/content is visible after resolution; - the target component was not incorrectly unmounted; - global loading did not replace a local interaction surface. For startup or splash gates, also add a regression where the readiness future never completes. The app must leave the splash/loading route through a bounded timeout or an explicit fallback instead of waiting forever. 3. Trace the layers in order: - Event: click, hover, keyboard, wheel, or submit handler fires exactly once. - State: selectedId, detailId, expandedId, edit state, pending state, and result state are written where expected. - Data: API/database/provider/store refreshes do not overwrite the target state. - Lifecycle: route changes, keys, conditional rendering, AnimatedSwitcher-like components, and loading branches do not unmount the owner of interaction state. - Render: UI actually binds to the correct state after the previous layers are proven. 4. Fix the r