fix(messages): force markdown re-render on stream completion

Author: jacobjmc

src/features/messages/components/MessageRows.tsx

@@ -360,6 +360,7 @@ export const MessageRow = memo(function MessageRow({
         )}
         {hasText && (
           <Markdown
+            key={`${item.id}-${item.renderVersion ?? 0}`}
             value={item.text}
             className="markdown"
             codeBlockStyle="message"

src/features/threads/hooks/threadReducer/common.ts

@@ -115,12 +115,6 @@ export function mergeStreamingText(existing: string, delta: string) {
   if (existing.startsWith(delta)) {
     return existing;
   }
-  const maxOverlap = Math.min(existing.length, delta.length);
-  for (let length = maxOverlap; length > 0; length -= 1) {
-    if (existing.endsWith(delta.slice(0, length))) {
-      return `${existing}${delta.slice(length)}`;
-    }
-  }
   return `${existing}${delta}`;
 }
 

src/features/threads/hooks/threadReducer/threadItemsSlice.ts

@@ -71,16 +71,20 @@ export function reduceThreadItems(state: ThreadState, action: ThreadAction): Thr
       const index = list.findIndex((msg) => msg.id === action.itemId);
       if (index >= 0 && list[index].kind === "message") {
         const existing = list[index];
+        const prevVersion =
+          "renderVersion" in existing ? (existing.renderVersion ?? 0) : 0;
         list[index] = {
           ...existing,
           text: action.text || existing.text,
+          renderVersion: prevVersion + 1,
         };
       } else {
         list.push({
           id: action.itemId,
           kind: "message",
           role: "assistant",
           text: action.text,
+          renderVersion: 1,
         });
       }
       const updatedItems = prepareThreadItems(list);

src/styles/messages.css

@@ -1188,6 +1188,34 @@
   font-size: 0.97em;
 }
 
+.markdown table {
+  border-collapse: collapse;
+  width: 100%;
+  margin: 8px 0;
+  font-size: 0.92em;
+}
+
+.markdown th,
+.markdown td {
+  padding: 8px 12px;
+  text-align: left;
+  border: 1px solid var(--border-subtle);
+}
+
+.markdown th {
+  background: var(--surface-control);
+  font-weight: 600;
+  color: var(--text-stronger);
+}
+
+.markdown td {
+  color: var(--text-muted);
+}
+
+.markdown tbody tr:hover {
+  background: var(--surface-hover);
+}
+
 /* ----- Todo inline ----- */
 
 .todo-inline .tool-inline-bar-toggle {

src/types.ts

@@ -78,6 +78,8 @@ export type ConversationItem =
       role: "user" | "assistant";
       text: string;
       images?: string[];
+      /** Incremented when streaming completes to force markdown re-render */
+      renderVersion?: number;
     }
   | { id: string; kind: "reasoning"; summary: string; content: string }
   | { id: string; kind: "diff"; title: string; diff: string; status?: string }