/state-management

Manage client and server state with Zustand stores and React Query patterns.

BOOST

redpanda-data@redpanda-data

GitHub

From plugin

console

4.3k11 skills4 agents2 commands2 MCP

Install

$ npx -y skills add redpanda-data/console --skill state-management --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.
You can call itInvoke it directly when you want it.
Slash command/state-management

Context preview

The summary Claude sees to decide when to auto-load this skill.

Manage client and server state with Zustand stores and React Query patterns.

SKILL.md

state-management.SKILL.md

name: state-management
description: Manage client and server state with Zustand stores and React Query patterns.

State Management

Choose the right state solution for each use case.

Activation Conditions

Managing global state
Persisting state across navigation
Cross-component data sharing
Questions about Zustand vs React Query

Quick Reference

| Action | Rule | |--------|------| | Read from store | `use-zustand-selectors.md` | | Persist state | `use-zustand-persist.md` | | Fetch server data | `use-react-query-for-server.md` |

Decision Tree

Is it server data (API response)?
├── Yes → React Query / Connect Query
│         (caching, refetching, invalidation)
└── No → Is it URL state?
    ├── Yes → React Router
    │         (search params, path params)
    └── No → Is it form state?
        ├── Yes → React Hook Form
        │         (validation, submission)
        └── No → Is it shared across components?
            ├── Yes → Zustand
            │         (global, persisted)
            └── No → useState / useReducer
                      (local component state)