updated code UI ✅✅

mediSync/app.py

@@ -544,6 +544,18 @@ def create_interface():
                 elem_id="appointment_id_input"
             )
 
+        # Populate appointment id from URL on initial load using server-side request (robust, no JS dependency)
+        def _populate_appointment_id_on_load(request: gr.Request):
+            try:
+                params = getattr(request, "query_params", {}) or {}
+                appointment_id = params.get("appointment_id", "")
+                if appointment_id:
+                    return gr.update(value=appointment_id)
+                return gr.update()
+            except Exception as e:
+                logger.warning(f"Could not populate appointment_id from URL: {e}")
+                return gr.update()
+
         with gr.Tab("🧬 Multimodal Analysis"):
             with gr.Row():
                 with gr.Column():
@@ -729,7 +741,7 @@ def create_interface():
             outputs=[end_consultation_status]
         )
 
-        # --- BRUTAL JS: forcibly set the appointment id textbox from URL param, every 500ms, forever ---
+        # --- Client-side fallback: update the underlying input/textarea inside the Gradio container ---
         gr.HTML("""
         <script>
         function getUrlParameter(name) {
@@ -738,26 +750,36 @@ def create_interface():
             var results = regex.exec(window.location.search);
             return results === null ? '' : decodeURIComponent(results[1].replace(/\\+/g, ' '));
         }
-        function setAppointmentIdBrutal() {
+        function setAppointmentIdFallback() {
             var appointmentId = getUrlParameter('appointment_id');
-            var input = document.getElementById('appointment_id_input');
-            if (input && appointmentId && input.value !== appointmentId) {
+            var container = document.getElementById('appointment_id_input');
+            if (!container || !appointmentId) return;
+            var input = container.querySelector('input, textarea');
+            if (!input && container.shadowRoot) {
+                input = container.shadowRoot.querySelector('input, textarea');
+            }
+            if (input && input.value !== appointmentId) {
                 input.value = appointmentId;
-                // For Gradio >=3.41, fire input event and change event
-                var event = new Event('input', { bubbles: true });
-                input.dispatchEvent(event);
-                var event2 = new Event('change', { bubbles: true });
-                input.dispatchEvent(event2);
+                input.dispatchEvent(new Event('input', { bubbles: true }));
+                input.dispatchEvent(new Event('change', { bubbles: true }));
             }
         }
-        // Run every 500ms, forever, to brutally force the value
-        setInterval(setAppointmentIdBrutal, 500);
-        // Also run immediately on load
-        window.addEventListener('DOMContentLoaded', setAppointmentIdBrutal);
-        window.addEventListener('load', setAppointmentIdBrutal);
+        // Try to apply once on load and occasionally afterward in case Gradio re-renders
+        const fallbackInterval = setInterval(setAppointmentIdFallback, 1000);
+        window.addEventListener('DOMContentLoaded', setAppointmentIdFallback);
+        window.addEventListener('load', setAppointmentIdFallback);
+        // Stop after some time to avoid running forever (10s)
+        setTimeout(() => clearInterval(fallbackInterval), 10000);
         </script>
         """)
 
+        # Server-side load event to populate appointment id reliably
+        interface.load(
+            _populate_appointment_id_on_load,
+            inputs=None,
+            outputs=appointment_id_input
+        )
+
     interface.launch()
 
 if __name__ == "__main__":