scaffold-zustand-slicelisted
Install: claude install-skill anchit-choudhry/gryffin-calorai
# New Zustand Slice Scaffold
You are adding a new Zustand slice to Gryffin Calorai's composed store.
The argument is the domain name in camelCase (e.g. `notifications` -> slice file
`notificationsSlice.ts`, type `NotificationsSlice`, creator `createNotificationsSlice`).
If no argument was given, ask: "What domain should the new slice cover (e.g. 'notifications', '
achievements')?"
---
## Step 1 - Read AppState.ts first
Read `apps/web/src/state/AppState.ts` to understand current slice composition before making any
changes. There are currently 8 slices: `CoreSlice`, `FoodSlice`, `RecipeSlice`, `TrackerSlice`,
`BodySlice`, `ActivitySlice`, `SettingsSlice`, `SyncSlice`.
---
## Step 2 - Create the slice file
Output: `apps/web/src/state/slices/<domain>Slice.ts`
```ts
import type {StateCreator} from "zustand";
import type {AppState} from "../AppState";
export interface
<Domain>Slice
{
// State fields - name them after the domain, not generic names
<domain>Items
:
<ItemType>[];
<domain>IsLoading
:
boolean;
<domain>Error
:
string | null;
// Actions - verb + domain noun
set < Domain > Items
:
(items: <ItemType>[]) => void;
add < Domain > Item
:
(item: <ItemType>) => Promise<void>;
delete <Domain>Item
:
(id: <ItemType>Id) => Promise<void>;
clear < Domain > Error
:
() => void;
}
export const create
<Domain>Slice
:
StateCreator < AppState, [], [], <Domain>Slice > = (set, get) => ({
< domain > Items
:
[],
<domain>IsLoading
:
false,
<domai