Hook 系统

100+ 个自定义 Hook，从状态管理到终端渲染，覆盖了 UI 层的方方面面。

核心 Hook

useAppState(selector)

选择性订阅全局状态：

const model = useAppState(s => s.model)
// 只有 model 变化时才重渲染

useSetAppState()

获取 setState 函数：

const setState = useSetAppState()
setState({ model: 'claude-sonnet-4-6' })

useCostSummary()

订阅费用数据：

const { cost, inputTokens, outputTokens } = useCostSummary()

useTerminalSize()

获取终端尺寸，窗口变化时自动更新。

useKeyboardShortcuts()

注册键盘快捷键：

useKeyboardShortcuts({
  'ctrl+k': () => clearScreen(),
  'ctrl+c': () => abort()
})

Hook 设计原则

• 用 useSyncExternalStore 而不是 Context 做状态订阅
• React Compiler 自动处理 memo，不需要手写
• Ref 缓存模式避免不必要的重渲染