fix(web): queued message UI flashes away before drain dispatches

transport-relay's onComplete emits session.state idle WITHOUT pending
message fields. The frontend was unconditionally clearing the queue on
idle, causing queued messages to visually disappear before the drain
event dispatches them (~100ms later).

Fix: only clear pending on idle when the event carries the
pendingMessages field (hasPendingMessagesField=true). transport-relay's
bare idle keeps existing pending; the subsequent runtime idle (with
pending=[]) or drain running event clears them authoritatively.

Applied to both main sessions (app.tsx) and sub-sessions
(useSubSessions.ts).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: IM.codes

web/src/app.tsx

@@ -1421,7 +1421,17 @@ export function App() {
           } else if (liveState === 'idle') {
             setSessions((prev) => prev.map((s) =>
               s.name === event.sessionId
-                ? { ...s, state: liveState as SessionInfo['state'], transportPendingMessages: [], transportPendingMessageEntries: [] }
+                ? {
+                    ...s,
+                    state: liveState as SessionInfo['state'],
+                    // Only clear pending when the event carries authoritative pending data.
+                    // transport-relay's onComplete emits idle WITHOUT pending fields — clearing
+                    // here would flash-remove queued messages before drain dispatches them.
+                    // The subsequent runtime idle (with pending=[]) or drain running event will clear.
+                    ...(hasPendingMessagesField
+                      ? { transportPendingMessages: extractTransportPendingMessages(event.payload.pendingMessages), transportPendingMessageEntries: normalizeTransportPendingEntries(event.payload.pendingMessageEntries, extractTransportPendingMessages(event.payload.pendingMessages), event.sessionId) }
+                      : {}),
+                  }
                 : s,
             ));
           }

web/src/hooks/useSubSessions.ts

@@ -318,9 +318,19 @@ export function useSubSessions(
           next[idx] = { ...next[idx], state: 'running' };
           return next;
         }
-        if (prev[idx].state === state && (prev[idx].transportPendingMessages?.length ?? 0) === 0 && (prev[idx].transportPendingMessageEntries?.length ?? 0) === 0) return prev;
+        // For idle: only clear pending when the event carries authoritative pending data.
+        // transport-relay's onComplete emits idle WITHOUT pending fields — clearing here
+        // would flash-remove queued messages before drain dispatches them.
+        const shouldClearPending = state !== 'idle' || hasPendingMessagesField;
+        if (prev[idx].state === state && !shouldClearPending && (prev[idx].transportPendingMessages?.length ?? 0) === 0 && (prev[idx].transportPendingMessageEntries?.length ?? 0) === 0) return prev;
         const next = [...prev];
-        next[idx] = { ...next[idx], state: state as SubSession['state'], transportPendingMessages: [], transportPendingMessageEntries: [] };
+        next[idx] = {
+          ...next[idx],
+          state: state as SubSession['state'],
+          ...(shouldClearPending
+            ? { transportPendingMessages: [], transportPendingMessageEntries: [] }
+            : {}),
+        };
         return next;
       });
     });