fix: robust chat parsing and visibility fixes

frontend/index.html

@@ -604,7 +604,7 @@
         </div>
     </div>
 
-    <script src="js/alt_app.js"></script>
+    <script src="js/alt_app.js?v=0317e"></script>
 </body>
 
 </html>

frontend/js/alt_app.js

@@ -952,16 +952,38 @@ async function sendChatMessage() {
 
         // chat output expects: [updated_history, clean_input, currentSystemCtx]
         const updatedHistory = responseData[0];
+        console.log('[Chat] Updated history:', JSON.stringify(updatedHistory));
+        
         // Gradio 6.x messages format: [{role: "user", content: "..."}, {role: "assistant", content: "..."}]
-        const lastMsg = updatedHistory[updatedHistory.length - 1];
-        console.log('[Chat] Last message structure:', lastMsg);
-        const lastBotMsg = lastMsg.content || lastMsg[1] || '';
+        // Gradio 5.x messages format: [[user, assistant], [user, assistant]]
+        
+        let lastBotMsg = '';
+        if (Array.isArray(updatedHistory) && updatedHistory.length > 0) {
+            const lastMsg = updatedHistory[updatedHistory.length - 1];
+            console.log('[Chat] Last message entry:', JSON.stringify(lastMsg));
+            
+            if (lastMsg && typeof lastMsg === 'object' && lastMsg.role === 'assistant') {
+                lastBotMsg = lastMsg.content || '';
+            } else if (Array.isArray(lastMsg)) {
+                // tuple format [user, assistant]
+                lastBotMsg = lastMsg[1] || '';
+            }
+        }
+        
+        console.log('[Chat] Extracted bot message:', lastBotMsg);
         chatHistory = updatedHistory;
 
+        if (!lastBotMsg) {
+            console.warn('[Chat] Warning: Bot message is empty after extraction');
+        }
+
+        // Assistant Bubble
         chatContainer.innerHTML += `
-            <div class="chat-message assistant" style="text-align:left; margin:10px 0; max-width:80%;">
-                <i class="fa-solid fa-robot" style="margin-right:10px;"></i>
-                <span style="background:rgba(255,255,255,0.1); padding:8px 12px; border-radius:15px; display:inline-block;">${escHtml(lastBotMsg)}</span>
+            <div class="chat-message assistant" style="text-align:left; margin:10px 0; max-width:85%; display:flex; align-items:start;">
+                <i class="fa-solid fa-robot" style="margin-right:10px; margin-top:10px; color: var(--accent);"></i>
+                <div style="background:rgba(255,255,255,0.15); border:1px solid rgba(0,0,0,0.1); padding:10px 15px; border-radius:18px; color: #000; font-weight: 500; font-size: 0.95rem; line-height:1.5;">
+                    ${escHtml(lastBotMsg) || '<i style="color:red;">(Empty Response)</i>'}
+                </div>
             </div>
         `;
         chatContainer.scrollTop = chatContainer.scrollHeight;