Fix AI chat UX
- Show user message immediately while waiting for AI - Add delete button for each conversation Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
e51853f335
commit
8d74656ecc
1 changed files with 23 additions and 4 deletions
|
|
@ -77,6 +77,17 @@ export default function AIChatPage() {
|
|||
const userContent = input.trim();
|
||||
setInput("");
|
||||
|
||||
// Show user message immediately in UI
|
||||
const tempUserMsg = { id: "temp-" + Date.now(), role: "user" as const, content: userContent, createdAt: new Date().toISOString() };
|
||||
if (currentSessionId) {
|
||||
const sessionIdx = sessions.findIndex(s => s.id === currentSessionId);
|
||||
if (sessionIdx >= 0) {
|
||||
const updatedSessions = [...sessions];
|
||||
updatedSessions[sessionIdx] = { ...updatedSessions[sessionIdx], messages: [...(updatedSessions[sessionIdx].messages || []), tempUserMsg] };
|
||||
setSessions(updatedSessions);
|
||||
}
|
||||
}
|
||||
|
||||
// Auto-create session if none selected
|
||||
let sessionId = currentSessionId;
|
||||
if (!sessionId && childId) {
|
||||
|
|
@ -89,7 +100,7 @@ export default function AIChatPage() {
|
|||
const data = await res.json();
|
||||
if (data.session) {
|
||||
sessionId = data.session.id;
|
||||
const newSession = { ...data.session, messages: [] };
|
||||
const newSession = { ...data.session, messages: [tempUserMsg] };
|
||||
setSessions([newSession, ...sessions]);
|
||||
setCurrentSessionId(sessionId);
|
||||
}
|
||||
|
|
@ -166,11 +177,19 @@ export default function AIChatPage() {
|
|||
<div
|
||||
key={session.id}
|
||||
onClick={() => setCurrentSessionId(session.id)}
|
||||
className={`p-2 rounded-lg cursor-pointer ${session.id === currentSessionId ? "bg-rose-100" : ""}`}
|
||||
className={`p-2 rounded-lg cursor-pointer flex justify-between items-center ${session.id === currentSessionId ? "bg-rose-100" : ""}`}
|
||||
>
|
||||
<div className="flex-1">
|
||||
<div className="text-sm font-medium truncate">{session.title}</div>
|
||||
<div className="text-xs text-gray-400">{new Date(session.updatedAt).toLocaleDateString()}</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={(e) => { e.stopPropagation(); deleteSession(session.id); }}
|
||||
className="text-red-400 p-1"
|
||||
>
|
||||
🗑️
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue