hwc-ux-feedback
Implement cross-cutting Hotwire UX feedback patterns: loading states, busy indicators, progress bars, optimistic UI, render interception, and view/page transitions. Prefer this skill when the core goal is perceived performance and user feedback, independent of a single feature domain. Use hwc-forms-validation for form correctness and validation behavior, hwc-navigation-content for navigation/history/cache mechanics, hwc-realtime-streaming for push/stream orchestration, hwc-media-content for media-specific behavior, and hwc-stimulus-fundamentals for base Stimulus API questions.
How do I install this agent skill?
npx skills add https://github.com/thehotwireclub/hotwire_club-skills --skill hwc-ux-feedbackIs this agent skill safe to install?
- Gen Agent Trust Hubpass
The skill is a collection of educational resources and code patterns for implementing Hotwire (Turbo and Stimulus) user experience features such as loading indicators, optimistic UI, and view transitions. No malicious behavior or security risks were detected.
- Socketpass
No alerts
- Snykpass
Risk: LOW · No issues
- Runlayerwarn
10/10 files flagged
- ZeroLeakspass
Score: 93/100 · 2 sections analyzed
What does this agent skill do?
User Experience & Feedback
Implement cross-cutting feedback and perceived-performance patterns in Hotwire.
Core Workflow
- Identify feedback need: loading, submit activity, progress reporting, optimistic updates, or transitions.
- Prefer built-in Turbo semantics first (
busy, progress bar hooks, submit/render lifecycle events). - Add optimistic updates only with a clear reconciliation strategy.
- Keep transition logic bounded to explicit lifecycle events and cache/preview-safe paths.
- Verify UX behavior on slow network, back/forward cache restores, and submission failures.
Guardrails
- Do not use fixed timeouts as a proxy for network or render completion.
- Gate animations/transitions for previews and cache restores.
- Keep submit locking/unlocking symmetric between start and end events.
- Separate UX feedback logic from domain-specific form/media/navigation implementations.
Load References Selectively
Open only the file needed for the current request.
- Turbo progress bar reuse:
references/2023-07-18-turbo-drive-progress-bar.md - Form activity indicators:
references/2023-06-06-turbo-drive-form-activity-indicators.md - Render interception and page transitions:
references/2023-04-25-turbo-drive-render-interception.md - Swiper-like transition behavior:
references/2024-11-19-turbo-drive-swiper-view-transitions.md - Frame busy spinner patterns:
references/2026-01-20-turbo-frames-loading-spinner.md - Optimistic UI with Turbo morph reconciliation:
references/2024-03-26-optimistic-ui-with-turbo-8-morphs.md - ULID-based optimistic identity strategy:
references/2024-08-13-turbo-drive-ulid.md - Form submission loading states:
references/2026-03-10-turbo-frames-form-loading-states.md - Frame error boundaries and retry:
references/2026-04-28-turbo-frames-error-boundaries.md - Shared element view transitions:
references/2026-05-12-turbo-drive-shared-element-view-transitions.md - Optimistic toast notifications for auto-save:
references/2026-05-26-stimulus-optimistic-toast-auto-save.md
Use references/INDEX.md for the full catalog.
Escalate to Neighbor Skills
- Form validation and submit correctness concerns: use
hwc-forms-validation - Navigation/history/cache flow concerns: use
hwc-navigation-content - Real-time push updates and stream actions: use
hwc-realtime-streaming - Media-specific playback/upload concerns: use
hwc-media-content - General Stimulus API/controller fundamentals: use
hwc-stimulus-fundamentals
How can the creator link this skill?
Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.
<a href="https://skillzs.dev/skills/thehotwireclub/hotwire_club-skills/hwc-ux-feedback">View hwc-ux-feedback on skillZs</a>