UI state is split into global state, local page state, and temporary component state.
-
Zustand (for global state: user, teams, chat)
-
React Context (for local context like theme)
-
React Query / SWR (for server state: fetching, caching)
-
Framer Motion (for animation states)
State |
Library |
Description |
auth |
Zustand |
Stores login session and user info |
activeTeam |
Zustand |
Stores current selected team |
notifications |
Zustand |
Stores toast/pop-up queue |
theme |
Context |
Light/Dark/Custom |
- All API data (teams, tasks, messages) are fetched with React Query.
- Caching, background updates, and optimistic updates supported.
Example |
State Type |
Modal open/close |
Component state |
Sidebar collapsed |
Zustand |
Active chat thread |
Page state |
Task being dragged |
Local state |