fix(agent): correct image attachment positioning and prevent disappearance after task completion

web/src/components/agent/agent-chat-message.tsx

@@ -54,7 +54,7 @@ export function AgentChatMessage({ item, theme, user, onRejectTool, onApproveToo
                 ) : (
                     <Streamdown animated isAnimating={!!item.streamId}>{item.text}</Streamdown>
                 )}
-                {item.attachments?.length ? <AgentMessageAttachments attachments={item.attachments} /> : null}
+                {item.attachments?.length ? <AgentMessageAttachments attachments={item.attachments} alignRight={isUser} /> : null}
                 {item.meta ? <div className={`mt-1 text-[11px] tabular-nums opacity-55 ${isUser ? "text-right" : ""}`}>{item.meta}</div> : null}
             </div>
             {isUser ? <AgentUserAvatar user={user} theme={theme} /> : null}
@@ -239,11 +239,11 @@ function AgentUserAvatar({ user, theme }: { user: LocalUser | null; theme: (type
     );
 }
 
-function AgentMessageAttachments({ attachments }: { attachments: AgentChatAttachment[] }) {
+function AgentMessageAttachments({ attachments, alignRight }: { attachments: AgentChatAttachment[]; alignRight?: boolean }) {
     return (
-        <div className="mt-2 grid grid-cols-3 gap-1.5">
+        <div className={`mt-2 flex flex-wrap gap-2 ${alignRight ? "justify-end" : "justify-start"}`}>
             {attachments.map((item) => (
-                <img key={item.id} src={item.url} alt={item.name} className="aspect-square w-full rounded-lg object-cover" />
+                <img key={item.id} src={item.url} alt={item.name} className="max-h-72 max-w-[280px] rounded-xl object-contain" />
             ))}
         </div>
     );

web/src/components/agent/agent-event-formatters.ts

@@ -473,3 +473,16 @@ export function normalizeHistoryMessages(messages: AgentChatItem[]) {
         }))
         .filter((item) => item.text);
 }
+
+export function mergeHistoryAttachments(messages: AgentChatItem[], currentMessages: AgentChatItem[]) {
+    const currentUsers = currentMessages.filter((item) => item.role === "user").reverse();
+    let userIndex = 0;
+    return [...messages]
+        .reverse()
+        .map((item) => {
+            if (item.role !== "user") return item;
+            const current = currentUsers[userIndex++];
+            return current?.attachments?.length ? { ...item, id: current.id, text: current.text, attachments: current.attachments } : item;
+        })
+        .reverse();
+}

web/src/components/agent/local-agent-panel.tsx

@@ -36,6 +36,7 @@ import {
     isCanvasWriteTool,
     isConnectionErrorMessage,
     isCurrentThreadEvent,
+    mergeHistoryAttachments,
     mergeAgentText,
     normalizeHistoryMessages,
     normalizeText,
@@ -127,7 +128,7 @@ export function LocalAgentPanel({ embedded, headless, autoConnect }: { embedded?
             if (currentThreadId && !skipHistory) {
                 let thread = await currentThreadRequest;
                 thread ||= await fetchAgentJson<AgentThreadResponse>(endpoint, token, `/agent/codex/threads/${encodeURIComponent(currentThreadId)}`);
-                nextMessages = normalizeHistoryMessages(thread.messages || []);
+                nextMessages = mergeHistoryAttachments(normalizeHistoryMessages(thread.messages || []), useAgentStore.getState().messages);
             }
             if (sequence !== loadThreadsSequenceRef.current) return;
             setAgentState({ threads: data.data || [], workspacePath: data.workspace?.workspacePath || "", ...(skipHistory ? {} : { messages: nextMessages }) });