Improve debug drawer
This commit is contained in:
@@ -1598,8 +1598,8 @@ export const DebugDrawer: React.FC<{
|
|||||||
setResolvedConfigView(JSON.stringify(localResolved, null, 2));
|
setResolvedConfigView(JSON.stringify(localResolved, null, 2));
|
||||||
}, [isOpen, assistant, voices, llmModels, asrModels]);
|
}, [isOpen, assistant, voices, llmModels, asrModels]);
|
||||||
|
|
||||||
const TranscriptionLog = () => (
|
const TranscriptionLog = ({ className = '' }: { className?: string }) => (
|
||||||
<div ref={scrollRef} className="flex-1 overflow-y-auto space-y-4 p-2 border border-white/5 rounded-md bg-black/20 min-h-0">
|
<div ref={scrollRef} className={`overflow-y-auto space-y-4 p-2 border border-white/5 rounded-md bg-black/20 min-h-0 ${className}`}>
|
||||||
{messages.length === 0 && <div className="text-center text-muted-foreground text-xs py-4">暂无转写记录</div>}
|
{messages.length === 0 && <div className="text-center text-muted-foreground text-xs py-4">暂无转写记录</div>}
|
||||||
{messages.map((m, i) => (
|
{messages.map((m, i) => (
|
||||||
<div key={i} className={`flex ${m.role === 'user' ? 'justify-end' : 'justify-start'}`}>
|
<div key={i} className={`flex ${m.role === 'user' ? 'justify-end' : 'justify-start'}`}>
|
||||||
@@ -1699,8 +1699,10 @@ export const DebugDrawer: React.FC<{
|
|||||||
<div className={`flex-1 overflow-hidden flex flex-col min-h-0 ${mode === 'text' && textSessionStarted ? 'mb-0' : 'mb-4'}`}>
|
<div className={`flex-1 overflow-hidden flex flex-col min-h-0 ${mode === 'text' && textSessionStarted ? 'mb-0' : 'mb-4'}`}>
|
||||||
{mode === 'text' ? (
|
{mode === 'text' ? (
|
||||||
textSessionStarted ? (
|
textSessionStarted ? (
|
||||||
<div className="flex-1 flex min-h-0 overflow-hidden animate-in fade-in">
|
<div className="flex-1 min-h-0 overflow-hidden animate-in fade-in">
|
||||||
<TranscriptionLog />
|
<div className="h-[48vh] min-h-[320px] max-h-[48vh] w-full overflow-hidden">
|
||||||
|
<TranscriptionLog className="h-full" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
) : wsStatus === 'connecting' ? (
|
) : wsStatus === 'connecting' ? (
|
||||||
<div className="flex-1 flex flex-col items-center justify-center space-y-6">
|
<div className="flex-1 flex flex-col items-center justify-center space-y-6">
|
||||||
@@ -1772,7 +1774,7 @@ export const DebugDrawer: React.FC<{
|
|||||||
<p className="text-sm relative z-10">通话中...</p>
|
<p className="text-sm relative z-10">通话中...</p>
|
||||||
</div>
|
</div>
|
||||||
<h4 className="text-xs font-medium text-muted-foreground px-1 mb-1 uppercase tracking-tight">转写日志</h4>
|
<h4 className="text-xs font-medium text-muted-foreground px-1 mb-1 uppercase tracking-tight">转写日志</h4>
|
||||||
<TranscriptionLog />
|
<TranscriptionLog className="flex-1 min-h-0" />
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="flex flex-col h-full space-y-2 animate-in fade-in">
|
<div className="flex flex-col h-full space-y-2 animate-in fade-in">
|
||||||
@@ -1791,7 +1793,7 @@ export const DebugDrawer: React.FC<{
|
|||||||
<button className="absolute top-2 right-2 z-20 h-8 w-8 rounded-full bg-black/50 backdrop-blur flex items-center justify-center text-white border border-white/10 hover:bg-primary/80" onClick={() => setIsSwapped(!isSwapped)}><ArrowLeftRight className="h-3.5 w-3.5" /></button>
|
<button className="absolute top-2 right-2 z-20 h-8 w-8 rounded-full bg-black/50 backdrop-blur flex items-center justify-center text-white border border-white/10 hover:bg-primary/80" onClick={() => setIsSwapped(!isSwapped)}><ArrowLeftRight className="h-3.5 w-3.5" /></button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<TranscriptionLog />
|
<TranscriptionLog className="flex-1 min-h-0" />
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<Button variant="destructive" size="sm" className="w-full h-10 font-bold" onClick={handleHangup}>
|
<Button variant="destructive" size="sm" className="w-full h-10 font-bold" onClick={handleHangup}>
|
||||||
@@ -1801,7 +1803,7 @@ export const DebugDrawer: React.FC<{
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className={mode === 'text' && textSessionStarted ? 'shrink-0 mt-2' : 'shrink-0 space-y-2 mt-2'}>
|
<div className={mode === 'text' && textSessionStarted ? 'shrink-0 mt-3 px-1' : 'shrink-0 space-y-2 mt-2 px-1'}>
|
||||||
<div className="w-full flex items-center gap-2 min-w-0">
|
<div className="w-full flex items-center gap-2 min-w-0">
|
||||||
{mode === 'text' && textSessionStarted && (
|
{mode === 'text' && textSessionStarted && (
|
||||||
<Button
|
<Button
|
||||||
|
|||||||
Reference in New Issue
Block a user