Update src/streamlit_app.py

src/streamlit_app.py

@@ -5,20 +5,22 @@ import streamlit.components.v1 as components
 from audiorecorder import audiorecorder  # NEW
 from audio_recorder_streamlit import audio_recorder
 
-import shutil
 from pydub import AudioSegment
 
 AudioSegment.ffmpeg = shutil.which("ffmpeg") or "ffmpeg"
 AudioSegment.ffprobe = shutil.which("ffprobe") or "ffprobe"
 
-
 # --- 0. PAGE CONFIG ---
-st.set_page_config(page_title="Clinical Portal", layout="wide", initial_sidebar_state="expanded")
+st.set_page_config(
+    page_title="Clinical Portal",
+    layout="wide",
+    initial_sidebar_state="expanded"
+)
 API_KEY = os.environ.get("OPENROUTER_API_KEY") or st.secrets.get("OPENROUTER_API_KEY")
 
-
-# --- 1. JAVASCRIPT ERROR SUPPRESSOR (kept; harmless now) ---
-components.html("""
+# --- 1. JAVASCRIPT ERROR SUPPRESSOR ---
+components.html(
+    """
     <script>
     const hideAudioErrors = () => {
         const selectors = [
@@ -45,11 +47,13 @@ components.html("""
     observer.observe(document.body, { childList: true, subtree: true });
     window.addEventListener('message', hideAudioErrors);
     </script>
-""", height=0)
+    """,
+    height=0,
+)
 
-
-# --- 2. PHYSICIAN-OPTIMIZED CSS (unchanged; audio_input selectors now irrelevant) ---
-st.markdown("""
+# --- 2. PHYSICIAN-OPTIMIZED CSS ---
+st.markdown(
+    """
     <style>
     /* Global App Theme */
     .stApp { 
@@ -57,7 +61,8 @@ st.markdown("""
         font-family: 'Inter', 'Segoe UI', sans-serif;
         color: #2c3e50;
     }
-    /* AGGRESSIVE ERROR HIDING - Multi-layered approach */
+
+    /* AGGRESSIVE ERROR HIDING */
     [data-testid="stAudioInput"] [data-testid="stNotification"],
     [data-testid="stAudioInput"] [role="alert"],
     [data-testid="stAudioInput"] div[class*="error"],
@@ -87,7 +92,8 @@ st.markdown("""
         padding: 25px 20px;
         box-shadow: 4px 0 12px rgba(0,0,0,0.08);
     }
-    
+
+    /* Make sidebar text white by default (for dark gradient) */
     [data-testid="stSidebar"] * {
         color: #ffffff !important;
     }
@@ -266,12 +272,33 @@ st.markdown("""
         border-radius: 6px;
         font-weight: 600;
     }
-    </style>
-    """, unsafe_allow_html=True)
 
+    /* === NEW: Fix text visibility in file uploader, inputs, checkboxes === */
+    /* File uploader text inside sidebar (label + dropzone) */
+    [data-testid="stSidebar"] [data-testid="stFileUploader"] * {
+        color: #1f2933 !important;  /* dark text on white uploader background */
+    }
+
+    /* Text inputs and password fields */
+    [data-testid="stSidebar"] input,
+    [data-testid="stSidebar"] textarea {
+        color: #1f2933 !important;
+    }
+
+    /* Checkbox labels (e.g., Use Sample, Use Voice) */
+    [data-testid="stSidebar"] .stCheckbox label {
+        color: #1f2933 !important;
+    }
+    /* === END NEW === */
+
+    </style>
+    """,
+    unsafe_allow_html=True,
+)
 
 # --- 3. HEADER BANNER ---
-st.markdown("""
+st.markdown(
+    """
 <div class="banner-container">
     <h1>🏥 Clinical Intelligence Portal</h1>
     <p>AI-Powered SOAP Note Generation & Quality Assurance System</p>
@@ -279,7 +306,9 @@ st.markdown("""
         ⚠️ This system uses a free-tier AI model; performance may vary depending on API availability.
     </p>
 </div>
-""", unsafe_allow_html=True)
+""",
+    unsafe_allow_html=True,
+)
 
 # --- 4. PHYSICIAN-FRIENDLY SIDEBAR ---
 with st.sidebar:
@@ -287,7 +316,7 @@ with st.sidebar:
         '<div style="margin-bottom: 18px;">'
         '<h2 style="color:#ffffff; font-size:1.6rem; text-align:center;">Workflow</h2>'
         '</div>',
-        unsafe_allow_html=True
+        unsafe_allow_html=True,
     )
 
     # Access Control (card)
@@ -299,7 +328,7 @@ with st.sidebar:
         API_KEY = st.text_input("Enter API Key", type="password", help="OpenRouter or similar API key")
     st.markdown('</div>', unsafe_allow_html=True)
 
-    # Voice Consultation (card) - keeps preview + checkbox in SAME card
+    # Voice Consultation (card)
     st.markdown('<div class="sb-card">', unsafe_allow_html=True)
     st.markdown('<div class="sb-title">🎤 Voice Consultation</div>', unsafe_allow_html=True)
 
@@ -311,7 +340,7 @@ with st.sidebar:
         icon_size="3x",
         energy_threshold=(-1.0, 1.0),
         pause_threshold=300.0,
-        key="voice_recorder_main"
+        key="voice_recorder_main",
     )
 
     audio_data = None
@@ -334,7 +363,12 @@ with st.sidebar:
 
     if "voice_transcript" in st.session_state:
         st.text_area("📋 Preview", st.session_state.voice_transcript, height=100, disabled=True)
-        st.download_button("💾 Download", st.session_state.voice_transcript, "transcript.txt", use_container_width=True)
+        st.download_button(
+            "💾 Download",
+            st.session_state.voice_transcript,
+            "transcript.txt",
+            use_container_width=True,
+        )
         st.checkbox("✓ Use Voice for Analysis", value=True, key="use_voice")
 
     st.markdown('</div>', unsafe_allow_html=True)
@@ -343,20 +377,35 @@ with st.sidebar:
     st.markdown('<div class="sb-card">', unsafe_allow_html=True)
     st.markdown('<div class="sb-title">📂 Clinical Documents</div>', unsafe_allow_html=True)
 
-    files = st.file_uploader("Upload Records", accept_multiple_files=True, type=["pdf", "docx", "txt"])
+    files = st.file_uploader(
+        "Upload Records",
+        accept_multiple_files=True,
+        type=["pdf", "docx", "txt"],
+    )
 
     sample_path = "src/sample_transcript.docx"
     if os.path.exists(sample_path):
         with open(sample_path, "rb") as f:
-            st.download_button("📥 Sample Template", f, "Sample_Template.docx", use_container_width=True)
+            st.download_button(
+                "📥 Sample Template",
+                f,
+                "Sample_Template.docx",
+                use_container_width=True,
+            )
         st.checkbox("📄 Use Sample", value=False, key="use_sample")
 
     st.markdown('</div>', unsafe_allow_html=True)
 
-    # Execute Analysis (final green-glow card)
+    # Execute Analysis (final card)
     st.markdown('<div class="sb-card sb-execute">', unsafe_allow_html=True)
-    st.markdown('<div class="sb-title">🚀 Execute Analysis <span class="sb-arrow">→</span></div>', unsafe_allow_html=True)
-    st.markdown('<div class="sb-subtitle">Ready? Hit Execute Below!</div>', unsafe_allow_html=True)
+    st.markdown(
+        '<div class="sb-title">🚀 Execute Analysis <span class="sb-arrow">→</span></div>',
+        unsafe_allow_html=True,
+    )
+    st.markdown(
+        '<div class="sb-subtitle">Ready? Hit Execute Below!</div>',
+        unsafe_allow_html=True,
+    )
 
     if st.button(
         "🩺 Generate SOAP Note",
@@ -365,7 +414,6 @@ with st.sidebar:
         help="Combines voice + docs for full analysis",
         key="btn_generate_soap",
     ) and API_KEY:
-        # Your existing generate logic (unchanged)
         status_label = st.empty()
         progress_bar = st.progress(0)
 
@@ -379,8 +427,14 @@ with st.sidebar:
 
         if st.session_state.get("use_voice") and "voice_transcript" in st.session_state:
             from langchain_core.documents import Document
+
             docs = process_docs_from_list(paths)
-            docs.append(Document(page_content=st.session_state.voice_transcript, metadata={"source": "Voice Transcript"}))
+            docs.append(
+                Document(
+                    page_content=st.session_state.voice_transcript,
+                    metadata={"source": "Voice Transcript"},
+                )
+            )
         else:
             docs = process_docs_from_list(paths)
 
@@ -397,7 +451,9 @@ with st.sidebar:
             status_label.info("✅ Auditing...")
             progress_bar.progress(90)
             st.session_state.eval = evaluate_clinical_output(
-                st.session_state.raw_text, str(st.session_state.soap), API_KEY
+                st.session_state.raw_text,
+                str(st.session_state.soap),
+                API_KEY,
             )
 
             progress_bar.progress(100)
@@ -407,7 +463,6 @@ with st.sidebar:
 
     st.markdown('</div>', unsafe_allow_html=True)
 
-
 # --- 5. MAIN WORKSPACE ---
 if "soap" in st.session_state:
     col_l, col_r = st.columns([1.75, 1.25])
@@ -418,42 +473,49 @@ if "soap" in st.session_state:
 
         for sec, data in st.session_state.soap.items():
             st.markdown(f'<div class="soap-header">{sec}</div>', unsafe_allow_html=True)
-            st.markdown(f'<div class="soap-content">{data["content"]}</div>', unsafe_allow_html=True)
+            st.markdown(f'<div class="soap-content">{data['content']}</div>', unsafe_allow_html=True)
 
-            # FIXED: Indented to stay within the 'for' loop and 'col_l' container
             with st.expander(f"🔍 View Supporting Evidence for {sec}"):
                 if data.get("evidence"):
                     for i, snippet in enumerate(data["evidence"]):
-                        # Redact PHI from evidence chunks locally
                         redacted_snippet = redact_phi(snippet)
-                        
-                        # Truncate long chunks (show first 300 chars)
+
                         max_display_length = 300
                         display_snippet = redacted_snippet[:max_display_length]
                         if len(redacted_snippet) > max_display_length:
                             display_snippet += "... [truncated]"
                         
-                        st.markdown(f"""
-                        <div style="background: #f8f9fa; padding: 12px; border-radius: 6px; border-left: 3px solid #667eea; margin-bottom: 10px;">
-                            <p style="color: #1e3c72; font-weight: 600; font-size: 0.9rem; margin: 0 0 8px 0;">
-                                📄 Source Chunk {i+1}
-                            </p>
-                            <p style="color: #555; font-size: 0.95rem; line-height: 1.6; margin: 0;">
-                                {display_snippet}
-                            </p>
-                        </div>
-                        """, unsafe_allow_html=True)
+                        st.markdown(
+                            f"""
+                            <div style="background: #f8f9fa; padding: 12px; border-radius: 6px;
+                                        border-left: 3px solid #667eea; margin-bottom: 10px;">
+                                <p style="color: #1e3c72; font-weight: 600; font-size: 0.9rem; margin: 0 0 8px 0;">
+                                    📄 Source Chunk {i+1}
+                                </p>
+                                <p style="color: #555; font-size: 0.95rem; line-height: 1.6; margin: 0;">
+                                    {display_snippet}
+                                </p>
+                            </div>
+                            """,
+                            unsafe_allow_html=True,
+                        )
                 else:
                     st.info("No direct transcript evidence found for this section.")
 
         st.divider()
 
-       # Export Section Header
-        st.markdown('<div style="text-align: center; margin: 20px 0 15px 0;"><h4 style="color: #1e3c72; font-weight: 700;">📥 Export Clinical Note</h4></div>', unsafe_allow_html=True)
+        # Export Section Header
+        st.markdown(
+            '<div style="text-align: center; margin: 20px 0 15px 0;">'
+            '<h4 style="color: #1e3c72; font-weight: 700;">📥 Export Clinical Note</h4>'
+            "</div>",
+            unsafe_allow_html=True,
+        )
         
         col1, col2 = st.columns(2)
         with col1:
-            st.markdown("""
+            st.markdown(
+                """
                 <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 
                             padding: 15px; border-radius: 10px; text-align: center; 
                             box-shadow: 0 4px 12px rgba(102,126,234,0.3); margin-bottom: 10px;">
@@ -464,17 +526,20 @@ if "soap" in st.session_state:
                         Interoperable JSON for EHR systems
                     </p>
                 </div>
-            """, unsafe_allow_html=True)
+                """,
+                unsafe_allow_html=True,
+            )
             st.download_button(
-                "⬇️ Download FHIR", 
-                export_as_fhir(st.session_state.soap), 
-                "clinical_note.json", 
+                "⬇️ Download FHIR",
+                export_as_fhir(st.session_state.soap),
+                "clinical_note.json",
                 use_container_width=True,
-                type="primary"
+                type="primary",
             )
         
         with col2:
-            st.markdown("""
+            st.markdown(
+                """
                 <div style="background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%); 
                             padding: 15px; border-radius: 10px; text-align: center; 
                             box-shadow: 0 4px 12px rgba(17,153,142,0.3); margin-bottom: 10px;">
@@ -485,13 +550,15 @@ if "soap" in st.session_state:
                         Human-readable documentation
                     </p>
                 </div>
-            """, unsafe_allow_html=True)
+                """,
+                unsafe_allow_html=True,
+            )
             st.download_button(
-                "⬇️ Download Text", 
-                str(st.session_state.soap), 
-                "soap_note.txt", 
+                "⬇️ Download Text",
+                str(st.session_state.soap),
+                "soap_note.txt",
                 use_container_width=True,
-                type="secondary"
+                type="secondary",
             )
 
     with col_r:
@@ -500,24 +567,33 @@ if "soap" in st.session_state:
 
         for metric, details in st.session_state.eval.items():
             if isinstance(details, dict):
-                score = details.get('score', 0)
+                score = details.get("score", 0)
                 color = "metric-good" if score >= 4 else "metric-bad"
 
-                st.markdown(f'<div class="metric-card {color}">{metric}: {score}/5 ⭐</div>', unsafe_allow_html=True)
-                st.markdown(f'<div class="metric-reason">💡 {details.get("reason", "Analysis verified.")}</div>', unsafe_allow_html=True)
+                st.markdown(
+                    f'<div class="metric-card {color}">{metric}: {score}/5 ⭐</div>',
+                    unsafe_allow_html=True,
+                )
+                st.markdown(
+                    f'<div class="metric-reason">💡 {details.get("reason", "Analysis verified.")}</div>',
+                    unsafe_allow_html=True,
+                )
 
                 if metric != list(st.session_state.eval.keys())[-1]:
                     st.divider()
 
-        st.markdown('</div>', unsafe_allow_html=True)
+        st.markdown("</div>", unsafe_allow_html=True)
 
 else:
-    st.markdown("""
-    <div class="empty-state">
-        <h3>🏥 Ready to Assist</h3>
-        <p>Upload clinical documents or record a consultation to begin automated SOAP note generation.</p>
-        <p style="font-size: 0.95rem; color: #95a5a6; margin-top: 15px;">
-            👈 Use the sidebar to get started
-        </p>
-    </div>
-    """, unsafe_allow_html=True)
+    st.markdown(
+        """
+        <div class="empty-state">
+            <h3>🏥 Ready to Assist</h3>
+            <p>Upload clinical documents or record a consultation to begin automated SOAP note generation.</p>
+            <p style="font-size: 0.95rem; color: #95a5a6; margin-top: 15px;">
+                👈 Use the sidebar to get started
+            </p>
+        </div>
+        """,
+        unsafe_allow_html=True,
+    )