Adds the desktop web assistant app (Vite + React) with OpenClaw bridge proxy and exposes it on the local network (host: 0.0.0.0, port 5174). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
36 lines
1.2 KiB
JavaScript
36 lines
1.2 KiB
JavaScript
import { useEffect, useRef } from 'react'
|
|
import MessageBubble from './MessageBubble'
|
|
import ThinkingIndicator from './ThinkingIndicator'
|
|
|
|
export default function ChatPanel({ messages, isLoading, onReplay }) {
|
|
const bottomRef = useRef(null)
|
|
|
|
useEffect(() => {
|
|
bottomRef.current?.scrollIntoView({ behavior: 'smooth' })
|
|
}, [messages, isLoading])
|
|
|
|
if (messages.length === 0 && !isLoading) {
|
|
return (
|
|
<div className="flex-1 flex items-center justify-center">
|
|
<div className="text-center">
|
|
<div className="w-16 h-16 rounded-full bg-indigo-600/20 flex items-center justify-center mx-auto mb-4">
|
|
<span className="text-indigo-400 text-2xl">AI</span>
|
|
</div>
|
|
<h2 className="text-xl font-medium text-gray-200 mb-2">Hi, I'm Aria</h2>
|
|
<p className="text-gray-500 text-sm">Type a message or press the mic to talk</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div className="flex-1 overflow-y-auto py-4">
|
|
{messages.map((msg) => (
|
|
<MessageBubble key={msg.id} message={msg} onReplay={onReplay} />
|
|
))}
|
|
{isLoading && <ThinkingIndicator />}
|
|
<div ref={bottomRef} />
|
|
</div>
|
|
)
|
|
}
|