Update app.py

app.py

@@ -16,6 +16,7 @@ import torch
 import gc
 from diskcache import Cache
 from transformers import AutoTokenizer
+from datetime import datetime
 
 # ==================== CONFIGURATION ====================
 # Configure logging
@@ -313,12 +314,18 @@ class ClinicalOversightApp:
                         cleaned = self.text_processor.clean_response(message.content)
                         if cleaned:
                             full_response += cleaned + " "
-                            yield {"role": "assistant", "content": full_response}
+                            yield {
+                                "role": "assistant",
+                                "content": f"✅ {cleaned} [{datetime.now().strftime('%H:%M:%S')}]"
+                            }
             elif isinstance(chunk, str) and chunk.strip():
                 cleaned = self.text_processor.clean_response(chunk)
                 if cleaned:
                     full_response += cleaned + " "
-                    yield {"role": "assistant", "content": full_response}
+                    yield {
+                        "role": "assistant",
+                        "content": f"✅ {cleaned} [{datetime.now().strftime('%H:%M:%S')}]"
+                    }
 
     def analyze(self, message: str, history: List[dict], files: List) -> Generator[tuple, None, None]:
         """Main analysis pipeline with proper output formatting"""
@@ -329,11 +336,13 @@ class ClinicalOversightApp:
         
         try:
             # Add user message to history
-            chatbot_output.append({"role": "user", "content": message})
+            chatbot_output.append({
+                "role": "user",
+                "content": f"{message} [{datetime.now().strftime('%H:%M:%S')}]"
+            })
             yield (chatbot_output, download_output, final_summary, progress_text)
             
             # Process uploaded files
-.ArrayIndexOutOfBoundsException: Index -1 out of bounds for length 0
             extracted = []
             file_hash_value = ""
             
@@ -354,7 +363,10 @@ class ClinicalOversightApp:
                             extracted.append({"error": f"Error processing file: {str(e)}"})
                 
                 file_hash_value = get_file_hash(files[0].name) if files else ""
-                chatbot_output.append({"role": "assistant", "content": "✅ File processing complete"})
+                chatbot_output.append({
+                    "role": "assistant",
+                    "content": f"✅ File processing complete [{datetime.now().strftime('%H:%M:%S')}]"
+                })
                 progress_text = self._update_progress(len(files), len(files), "Files processed")
                 yield (chatbot_output, download_output, final_summary, progress_text)
 
@@ -373,7 +385,7 @@ are found, state 'No missed diagnoses identified'.
 Patient Record (Chunk {chunk_idx}/{len(chunks)}):
 {chunk[:1200]}
 """
-                chatbot_output.append({"role": "assistant", "content": ""})
+                chatbot_output.append({"role": "assistant", "content": "⏳ Analyzing..."})
                 progress_text = self._update_progress(chunk_idx, len(chunks), "Analyzing")
                 yield (chatbot_output, download_output, final_summary, progress_text)
                 
@@ -403,10 +415,16 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
 
         except Exception as e:
             logger.error(f"Analysis error: {e}")
-            chatbot_output.append({"role": "assistant", "content": f"❌ Error: {str(e)}"})
+            chatbot_output.append({
+                "role": "assistant",
+                "content": f"❌ Error: {str(e)} [{datetime.now().strftime('%H:%M:%S')}]"
+            })
             final_summary = f"Error occurred: {str(e)}"
             progress_text = {"visible": False}
             yield (chatbot_output, download_output, final_summary, progress_text)
+        finally:
+            torch.cuda.empty_cache()
+            gc.collect()
 
     def _update_progress(self, current: int, total: int, stage: str = "") -> Dict[str, Any]:
         """Format progress update for UI"""
@@ -414,7 +432,7 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
         return {"value": progress, "visible": True}
 
     def create_interface(self):
-        """Create Gradio interface with ChatGPT-like design"""
+        """Create Gradio interface with refined ChatGPT-like design"""
         css = """
         body, .gradio-container {
             font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
@@ -428,18 +446,23 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
         }
         .chat-container {
             background: var(--chat-bg);
-            border-radius: 12px;
-            padding: 20px;
+            border-radius: 16px;
+            padding: 24px;
             height: 80vh;
             overflow-y: auto;
-            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+            box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+            position: relative;
         }
         .message {
-            margin: 10px 0;
+            margin: 12px 0;
             padding: 12px 16px;
             border-radius: 12px;
             max-width: 80%;
-            transition: all 0.2s ease;
+            transition: all 0.3s ease;
+            position: relative;
+        }
+        .message:hover {
+            transform: translateY(-2px);
         }
         .message.user {
             background: #007bff;
@@ -450,14 +473,22 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
             background: var(--message-bg);
             color: var(--text-color);
         }
+        .message-timestamp {
+            font-size: 0.75em;
+            opacity: 0.7;
+            margin-top: 4px;
+            text-align: right;
+        }
         .input-container {
             display: flex;
             align-items: center;
             margin-top: 20px;
             background: var(--chat-bg);
-            padding: 10px 20px;
-            border-radius: 25px;
-            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+            padding: 12px 24px;
+            border-radius: 30px;
+            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+            position: sticky;
+            bottom: 0;
         }
         .input-textbox {
             flex-grow: 1;
@@ -465,31 +496,39 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
             background: transparent;
             color: var(--text-color);
             outline: none;
+            font-size: 1em;
         }
         .send-btn {
             background: #007bff;
             color: white;
             border: none;
             border-radius: 20px;
-            padding: 8px 16px;
-            margin-left: 10px;
+            padding: 10px 20px;
+            margin-left: 12px;
+            transition: background 0.2s ease;
         }
         .send-btn:hover {
             background: #0056b3;
         }
         .sidebar {
             background: var(--sidebar-bg);
-            padding: 20px;
-            border-radius: 12px;
+            padding: 24px;
+            border-radius: 16px;
             margin-top: 20px;
-            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+            box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+            transition: transform 0.3s ease;
+            transform: translateX(0);
         }
         .sidebar-hidden {
-            display: none;
+            transform: translateX(100%);
+            position: absolute;
+            right: 0;
+            top: 100px;
+            width: 300px;
         }
         .header {
             text-align: center;
-            margin-bottom: 20px;
+            margin-bottom: 24px;
         }
         .theme-toggle {
             position: absolute;
@@ -500,13 +539,28 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
             border: none;
             border-radius: 20px;
             padding: 8px 16px;
+            display: flex;
+            align-items: center;
+            gap: 8px;
+        }
+        .loading-spinner {
+            position: absolute;
+            bottom: 80px;
+            left: 50%;
+            transform: translateX(-50%);
+            font-size: 1.2em;
+            animation: spin 1s linear infinite;
+        }
+        @keyframes spin {
+            0% { transform: translateX(-50%) rotate(0deg); }
+            100% { transform: translateX(-50%) rotate(360deg); }
         }
         :root {
             --background: #ffffff;
             --text-color: #333333;
-            --chat-bg: #f7f7f8;
+            --chat-bg: #f9fafb;
             --message-bg: #e5e5ea;
-            --sidebar-bg: #f1f1f1;
+            --sidebar-bg: #f1f3f5;
         }
         @media (prefers-color-scheme: dark) {
             :root {
@@ -519,19 +573,26 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
         }
         @media (max-width: 600px) {
             .gradio-container {
-                padding: 10px;
+                padding: 12px;
             }
             .chat-container {
                 height: 70vh;
             }
             .input-container {
                 flex-direction: column;
-                gap: 10px;
+                gap: 12px;
+                padding: 12px;
             }
             .send-btn {
                 width: 100%;
                 margin-left: 0;
             }
+            .sidebar {
+                width: 100%;
+            }
+            .sidebar-hidden {
+                transform: translateX(100%);
+            }
         }
         """
         
@@ -541,10 +602,11 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
             const isDark = root.style.getPropertyValue('--background') === '#1e2a44';
             root.style.setProperty('--background', isDark ? '#ffffff' : '#1e2a44');
             root.style.setProperty('--text-color', isDark ? '#333333' : '#ffffff');
-            root.style.setProperty('--chat-bg', isDark ? '#f7f7f8' : '#2d3b55');
+            root.style.setProperty('--chat-bg', isDark ? '#f9fafb' : '#2d3b55');
             root.style.setProperty('--message-bg', isDark ? '#e5e5ea' : '#3e4c6a');
-            root.style.setProperty('--sidebar-bg', isDark ? '#f1f1f1' : '#2a3650');
+            root.style.setProperty('--sidebar-bg', isDark ? '#f1f3f5' : '#2a3650');
             localStorage.setItem('theme', isDark ? 'light' : 'dark');
+            document.querySelector('.theme-toggle').innerHTML = isDark ? '🌙 Dark Mode' : '☀️ Light Mode';
         }
 
         function toggleSidebar() {
@@ -556,6 +618,7 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
             const savedTheme = localStorage.getItem('theme');
             if (savedTheme === 'dark') toggleTheme();
             document.querySelector('.sidebar').classList.add('sidebar-hidden');
+            document.querySelector('.theme-toggle').innerHTML = savedTheme === 'dark' ? '☀️ Light Mode' : '🌙 Dark Mode';
         });
         """
 
@@ -568,7 +631,7 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
                 </p>
             </div>
             """)
-            gr.Button("Toggle Light/Dark Mode", elem_classes="theme-toggle").click(
+            gr.Button("🌙 Dark Mode", elem_classes="theme-toggle").click(
                 None, None, None, _js="toggleTheme"
             )
             
@@ -578,27 +641,30 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
                     height="100%",
                     show_copy_button=True,
                     type="messages",
-                    elem_classes="chatbot"
+                    elem_classes="chatbot",
+                    render_markdown=True
                 )
+                gr.HTML("<div class='loading-spinner' style='display: none;'>⏳</div>")
             
             with gr.Row():
-                gr.Button("Show/Hide Tools", variant="secondary").click(
+                gr.Button("📂 Tools", variant="secondary").click(
                     None, None, None, _js="toggleSidebar"
                 )
             
             with gr.Column(elem_classes="sidebar"):
+                gr.Markdown("### 📎 Upload Records")
                 file_upload = gr.File(
                     file_types=[".pdf", ".csv", ".xls", ".xlsx"],
                     file_count="multiple",
-                    label="Upload Patient Records"
+                    label="Patient Records"
                 )
-                gr.Markdown("### 📝 Summary of Findings")
+                gr.Markdown("### 📝 Analysis Summary")
                 final_summary = gr.Markdown(
                     "Analysis results will appear here..."
                 )
-                gr.Markdown("### 📂 Report Download")
+                gr.Markdown("### 📄 Full Report")
                 download_output = gr.File(
-                    label="Full Report",
+                    label="Download Report",
                     visible=False,
                     interactive=False
                 )
@@ -623,18 +689,40 @@ Patient Record (Chunk {chunk_idx}/{len(chunks)}):
                 interactive=False
             )
 
+            def show_loading_spinner():
+                return gr.update(value="<div class='loading-spinner'>⏳</div>", visible=True)
+
+            def hide_loading_spinner():
+                return gr.update(value="<div class='loading-spinner' style='display: none;'>⏳</div>", visible=False)
+
             send_btn.click(
+                show_loading_spinner,
+                outputs=[chatbot],
+                _js="() => { document.querySelector('.loading-spinner').style.display = 'block'; }"
+            ).then(
                 self.analyze,
                 inputs=[msg_input, chatbot, file_upload],
                 outputs=[chatbot, download_output, final_summary, progress_text],
                 show_progress="hidden"
+            ).then(
+                hide_loading_spinner,
+                outputs=[chatbot],
+                _js="() => { document.querySelector('.loading-spinner').style.display = 'none'; }"
             )
             
             msg_input.submit(
+                show_loading_spinner,
+                outputs=[chatbot],
+                _js="() => { document.querySelector('.loading-spinner').style.display = 'block'; }"
+            ).then(
                 self.analyze,
                 inputs=[msg_input, chatbot, file_upload],
                 outputs=[chatbot, download_output, final_summary, progress_text],
                 show_progress="hidden"
+            ).then(
+                hide_loading_spinner,
+                outputs=[chatbot],
+                _js="() => { document.querySelector('.loading-spinner').style.display = 'none'; }"
             )
             
             app.load(