State Management

Philosophy

• Server State → TanStack Query
• Client State → Zustand
• Form State → React Hook Form + Zod
• URL State → nuqs or searchParams

TanStack Query

Query Keys Factory

export const userKeys = {
  all: ['users'] as const,
  lists: () => [...userKeys.all, 'list'] as const,
  list: (filters: Filters) => [...userKeys.lists(), filters] as const,
  details: () => [...userKeys.all, 'detail'] as const,
  detail: (id: string) => [...userKeys.details(), id] as const,