Voice Lifecycle

const [voiceState, setVoiceState] = useState<
  'disconnected' | 'connecting' | 'listening' | 'thinking' | 'speaking'
>('disconnected');

socket.on('event', (event) => {
  switch (event.type) {
    case 'voice-status':
      if (event.status === 'joined') setVoiceState('listening');
      if (event.status === 'left') setVoiceState('disconnected');
      if (event.status === 'error') setVoiceState('disconnected');
      break;

    case 'transcript':
      if (event.isFinal) setVoiceState('thinking');
      break;

    case 'speak-status':
      if (event.status === 'started') setVoiceState('speaking');
      if (event.status === 'finished') setVoiceState('listening');
      if (event.status === 'interrupted') setVoiceState('listening');
      break;
  }
});

// Render based on state
function VoiceIndicator() {
  switch (voiceState) {
    case 'listening':  return "animate-pulse" />;
    case 'thinking':   return ;
    case 'speaking':   return "animate-pulse" />;
    default:           return ;
  }
}