React (Components, Hooks, State)

Reusable patterns for scalable React codebases, including Zustand state management.

When to Use

Use this skill when:

• Writing or refactoring .tsx components
• Extracting hooks into hooks/<area>/useXxx.ts
• Removing helpers from components/hooks into utils/
• Removing inline types into types/
• Implementing global UI state (modals, progress indicators)
• Managing shared data across components or avoiding prop drilling
• Setting up cross-component communication with Zustand

Non-Negotiables (MUST)