Update audio debug drawer

This commit is contained in:
Xin Wang
2026-02-09 18:10:36 +08:00
parent 2b7e3dd499
commit a140e3a599

View File

@@ -1995,10 +1995,15 @@ export const DebugDrawer: React.FC<{
</div>
) : callStatus === 'calling' ? (
mode === 'voice' ? (
<div className="flex-1 min-h-0 overflow-hidden animate-in fade-in">
<div className="h-[68vh] min-h-[420px] max-h-[68vh] w-full flex flex-col min-h-0 overflow-hidden">
<TranscriptionLog scrollRef={scrollRef} messages={messages} isLoading={isLoading} className="flex-1 min-h-0 h-full" />
<div className="flex-1 flex flex-col items-center justify-center space-y-6">
<div className="h-24 w-24 rounded-full bg-primary/20 flex items-center justify-center animate-bounce">
<Mic className="h-10 w-10 text-primary" />
</div>
<div className="text-center">
<p className="text-primary font-mono text-sm tracking-widest animate-pulse">CONNECTING...</p>
<p className="text-xs text-muted-foreground mt-2"></p>
</div>
<Button onClick={handleHangup} variant="destructive" className="rounded-full h-10 px-8"></Button>
</div>
) : (
<div className="flex-1 flex flex-col items-center justify-center space-y-6">
@@ -2045,6 +2050,7 @@ export const DebugDrawer: React.FC<{
<div className={mode === 'text' && textSessionStarted ? 'shrink-0 mt-3 px-1 mb-3' : mode === 'voice' ? 'shrink-0 space-y-3 mt-3 px-1 mb-3' : 'shrink-0 space-y-2 mt-2 px-1 mb-3'}>
{mode === 'voice' && (
<div className="w-full flex items-center gap-2 pb-1">
<span className="text-xs text-muted-foreground shrink-0"></span>
<select
className="flex-1 text-xs rounded-md border border-white/10 bg-white/5 px-2 py-1 text-foreground appearance-none cursor-pointer focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary/50 [&>option]:bg-card [&>option]:text-foreground"
value={selectedMic}
@@ -2054,26 +2060,6 @@ export const DebugDrawer: React.FC<{
<option key={d.deviceId} value={d.deviceId}>{d.label || 'Mic'}</option>
))}
</select>
<div
className={`px-2 py-1 rounded border text-[11px] inline-flex items-center gap-1.5 whitespace-nowrap ${
callStatus === 'active'
? 'border-green-500/40 bg-green-500/10 text-green-300'
: callStatus === 'calling'
? 'border-amber-500/40 bg-amber-500/10 text-amber-200'
: 'border-white/10 bg-black/20 text-muted-foreground'
}`}
>
<span
className={`h-1.5 w-1.5 rounded-full ${
callStatus === 'active'
? 'bg-green-400 animate-pulse'
: callStatus === 'calling'
? 'bg-amber-300 animate-pulse'
: 'bg-muted-foreground/60'
}`}
/>
{callStatus === 'active' ? '通话中' : callStatus === 'calling' ? '连接中...' : '未开始'}
</div>
</div>
)}
<div className="w-full flex items-center gap-2 min-w-0">