manohar/tia
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix AI chat UX

Browse source 
- 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:
Manohar Gupta 2026-05-11 01:57:03 +05:30
parent e51853f335
commit 8d74656ecc
1 changed files with 23 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/app/ai/page.tsx
View file

@ -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,10 +177,18 @@ 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="text-sm font-medium truncate">{session.title}</div>
<div className="text-xs text-gray-400">{new Date(session.updatedAt).toLocaleDateString()}</div>
<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>