fix(desktop): fix Try It step UI overflow and missing chat input
Add min-w-0 to SamplePrompt text container so truncate works in flex layout. Always show ChatView when agent is ready so the message input is visible (ChatView has its own empty state). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
e9c91ccc66
commit
5c5bf46a95
2 changed files with 2 additions and 16 deletions
|
|
@ -13,7 +13,7 @@ export function SamplePrompt({ title, prompt, onClick }: SamplePromptProps) {
|
|||
onClick={onClick}
|
||||
className="w-full text-left p-4 rounded-xl border border-border bg-card hover:bg-accent/50 transition-colors group flex items-center justify-between"
|
||||
>
|
||||
<div className="space-y-0.5 pr-4">
|
||||
<div className="space-y-0.5 pr-4 min-w-0">
|
||||
<p className="font-medium text-sm">{title}</p>
|
||||
<p className="text-xs text-muted-foreground truncate">{prompt}</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -54,8 +54,6 @@ export default function TryItStep() {
|
|||
navigate('/onboarding/connect')
|
||||
}
|
||||
|
||||
const hasMessages = messages.length > 0
|
||||
|
||||
return (
|
||||
<div className="h-full flex">
|
||||
{/* Left column — prompts */}
|
||||
|
|
@ -109,19 +107,7 @@ export default function TryItStep() {
|
|||
<Loading />
|
||||
Initializing agent...
|
||||
</div>
|
||||
) : !hasMessages && !isLoading ? (
|
||||
<div className="flex-1 flex items-center justify-center px-12">
|
||||
<div className="max-w-sm text-center space-y-3">
|
||||
<h3 className="text-lg font-medium">Agent ready</h3>
|
||||
<p className="text-sm text-muted-foreground leading-relaxed">
|
||||
Click a prompt on the left to start a conversation, or type
|
||||
your own message below.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
{agentId && (hasMessages || isLoading) && (
|
||||
) : (
|
||||
<ChatView
|
||||
messages={messages}
|
||||
streamingIds={streamingIds}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue