fix: render markdown tables and persist message sources after refresh

- Add preprocessMarkdown to fix concatenated table rows from AI responses
- Map sources field in loadRoomMessages so Sources footer survives page refresh
- Move ChatSource interface before RoomMessage and add sources field to RoomMessage

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/components/Main.tsx

@@ -52,6 +52,32 @@ interface ChatRoom {
   messagesLoaded: boolean;
 }
 
+// Preprocess markdown to ensure tables are properly separated from surrounding text
+function preprocessMarkdown(content: string): string {
+  // Step 1: Split concatenated table rows — "| val ||" means end of row + start of next
+  let result = content.replace(/\|\|/g, "|\n|");
+
+  // Step 2: Per-line — if a line has non-pipe text before a pipe table row, split them
+  const lines = result.split("\n");
+  const processed = lines.map((line) => {
+    const tableStart = line.indexOf("|");
+    if (tableStart > 0) {
+      const tableContent = line.slice(tableStart);
+      // Confirm it looks like a table row (at least 2 pipes)
+      if ((tableContent.match(/\|/g) ?? []).length >= 2) {
+        return line.slice(0, tableStart).trimEnd() + "\n\n" + tableContent;
+      }
+    }
+    return line;
+  });
+  result = processed.join("\n");
+
+  // Step 3: Ensure blank line before table rows preceded by non-table text (not another row ending with |)
+  result = result.replace(/([^|\n])\n(\|)/g, "$1\n\n$2");
+
+  return result;
+}
+
 // Markdown component overrides for clean rendering inside chat bubbles
 const markdownComponents: Components = {
   p: ({ children }) => (
@@ -254,6 +280,7 @@ export default function Main() {
         role: m.role,
         content: m.content,
         timestamp: new Date(m.created_at).getTime(),
+        sources: m.sources ?? [],
       }));
       setChats((prev) =>
         prev.map((chat) =>
@@ -654,7 +681,7 @@ export default function Main() {
                       rehypePlugins={[rehypeKatex]}
                       components={markdownComponents}
                     >
-                      {message.content}
+                      {preprocessMarkdown(message.content)}
                     </ReactMarkdown>
                   </div>
                 )}

src/services/api.ts

@@ -30,11 +30,18 @@ export interface CreateRoomResponse {
   data: Room;
 }
 
+export interface ChatSource {
+  document_id: string;
+  filename: string;
+  page_label: string | null;
+}
+
 export interface RoomMessage {
   id: string;
   role: "user" | "assistant";
   content: string;
   created_at: string;
+  sources?: ChatSource[];
 }
 
 export interface RoomDetail extends Room {
@@ -58,12 +65,6 @@ export interface UploadDocumentResponse {
   data: { id: string; filename: string; status: DocumentStatus };
 }
 
-export interface ChatSource {
-  document_id: string;
-  filename: string;
-  page_label: string | null;
-}
-
 // ─── Base Client ──────────────────────────────────────────────────────────────
 
 const BASE_URL = ((import.meta as unknown as { env: Record<string, string> }).env.VITE_API_BASE_URL) ?? "";