Zustand vanilla store を使って通話ロジックを React から分離した話

この記事は みんなが知らないIVRy！ Advent Calendar 2025 の8日目の記事になります。昨日は堀田さんの「IVRy、エンジニア入りまくってるイメージ。実際いまどんな感じ？」2025年末編でした。明日は富士さんの記事が公開予定です。 株式会社IVRy（アイブリー）のエンジニアの kinashi です。 React の状態管理むずかしいですよね。複雑な状態遷移や外部 SDK を扱う場合、責務分離や、テストに悩んだことがある方も少なくないかと思います。 アイブリーでは電話という少し特殊なドメインを扱っています。Twilio を使ったブラウザ通話処理を @twilio/voice-sdk と React を組み合わせて実装しています。イベントの種類が多く、状態も mutable に変化するため、コンポーネントやフックが複雑化している問題がありました。 この記事では状態管理を Z