Agent skill · Data & Analytics

store-data-structures

LobeHub Zustand store data-shape patterns. Use when designing store state, list/detail splits, normalized maps, reducers, messagesMap, topicsMap, or choosing shared type sources.

LobeHub80,937★ · +310/wk · 1 repos on radarProfile →
claude-codeNOASSERTION
Install
npx skills add lobehub/lobehub --skill store-data-structures --agent claude-code

Same command for any agent — swap --agent for codex, cursor, copilot.

Facts
Files in the skill folder: 3
SKILL.md size: 9 KB
Bundled scripts: none
Path: .agents/skills/store-data-structures/SKILL.md
Open the folder on GitHub →
Where it comes from
Stars: 81,252 · +315 this week
Language: TypeScript
Read our review of the source →

Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.

From the SKILL.md

# LobeHub Store Data Structures How to structure data in Zustand stores for fast list rendering, multi-detail caching, and ergonomic optimistic updates. ## Core Principles ### ✅ DO 1. **Separate List and Detail** — different structures for list pages and detail pages 2. **Use Map for Details** — cache multiple detail pages with `Record<string, Detail>` 3. **Use Array for Lists** — simple arrays for list display 4. **Types from `@lobechat/types`** — never use `@lobechat/database` types in stores 5. **Distinguish List and Detail types** — List types may have computed UI fields ### ❌ DON'T 1. **Don't use a single detail object** — can't cache multiple pages 2. **Don't mix List and Detail types** — they have different purposes 3. **Don't use database types** — use types from `@lobechat/types` 4. **Don't use Map for lists** — simple arrays are sufficient --- ## Type Definitions Each entity gets its own file under `@lobechat/types/`. Each file exports two types: - **Detail type** — full entity, including heavy fields (rubrics, content, editor state, …) - **List item type** — a **subset** that excludes heavy fields, may add computed UI fields (counts, timestamps formatted for display) **I

What's inside
Steps it walks through
  1. Core Principles
  2. ✅ DO
  3. ❌ DON'T
  4. Type Definitions
  5. When to Use Map vs Array
  6. Use Map + Reducer — for Detail Data
  7. Use Simple Array — for List Data
  8. State Structure Pattern
  9. Reducer Pattern (for Detail Map)
  10. Data Structure Comparison
  11. ❌ WRONG — Single Detail Object
  12. ✅ CORRECT — Separate List and Detail
  13. Component Usage
  14. Accessing List Data
Ships with 2 files
  • references/reducer.md
  • references/types.md
More from lobehub
All skills →
About this skill
What does the store-data-structures skill do?

LobeHub Zustand store data-shape patterns. Use when designing store state, list/detail splits, normalized maps, reducers, messagesMap, topicsMap, or choosing shared type sources.

How do I install it?

Run `npx skills add lobehub/lobehub --skill store-data-structures --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.

Where does this skill come from?

From lobehub/lobehub, a repository with 81,252 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.

Is a popular skill a good skill?

Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.

Keep going