Back to Skills

zustand

LobeHub Zustand store conventions: public/internal/dispatch action layers, optimistic update pattern, slice composition via `flattenActions`, and class-based action migration. Use whenever working under `src/store/**`, adding a `createXxxSlice`, writing `internal_*` or `internal_dispatch*` actions, designing `messagesMap`/`topicsMap` reducers, refactoring a `StateCreator` object slice into a `XxxActionImpl` class, or debugging stale store reads. Triggers on `useChatStore`/`useUserStore`/`useGlob

77,992stars15,338forksUpdated 5/31/2026

Security Assessment

Safe(100/100)
Security Score100/100

About zustand

The `zustand` AI skill provides a structured approach to state management within LobeHub projects, particularly for applications under the `src/store/**` directory. It standardizes how actions, dispatch methods, and state slices are defined and interacted with, aiming to simplify the complexities of managing shared application state. By implementing clear conventions for public, internal, and dispatch actions, it ensures a consistent and maintainable architecture that reduces errors such as stale store reads and inconsistent state updates. The skill emphasizes patterns such as optimistic updates, slice composition, and class-based action migration, offering developers a reliable framework for evolving large-scale stores.

FAQ

What types of actions does the zustand skill support?

It supports three action layers: public actions for UI interaction, internal actions prefixed with `internal_` for core business logic, and dispatch methods prefixed with `internal_dispatch` for state updates.

Can I use optimistic updates for all state changes?

Optimistic updates are recommended for creating or updating objects like topics or messages but should be avoided for destructive operations like deletions, due to complex recovery requirements.

How does class-based action migration work?

Slices can be migrated from plain `StateCreator` objects to class-based actions. Developers define a class that encapsulates actions, uses private fields for `set` and `get`, and export a `create*Slice` helper that returns an instance. Methods can be composed using `flattenActions`.

Which patterns determine whether to use a reducer or simple `set`?

Reducers are suited for managing object lists/maps, handling optimistic updates, and complex state transitions. Simple `set` is ideal for toggling booleans, updating simple values, or setting single state fields.

Is this skill meant to be called directly by UI components?

No. Public actions are the main interface for UI components. Internal and dispatch actions should not be invoked directly by UI code.

All Files

3 files
SKILL.md7.6 KB
View
references/action-patterns.md2.9 KB
View
references/slice-organization.md3.1 KB
View

Install zustand

Download and extract the skill files to your .claude/skills/ directory.

Quick Setup:

  1. Copy the skill folder to .claude/skills/
  2. Claude will automatically detect and use the skill

Repository

lobehub/lobehub