Update app.py

app.py

@@ -135,69 +135,58 @@ def update_image_display(image_url):
 with gr.Blocks(theme=gr.themes.Soft()) as app:
     gr.Markdown("# 📄 Document AI Assistant")
 
-    gr.HTML("""
-    <style>
-    .big-btn {
-        font-size: 18px !important;
-        padding: 14px 28px !important;
-        border-radius: 8px !important;
-        width: 100% !important;
-        margin-top: 10px;
-        white-space: nowrap;
-    }
-    .toggle-btn { margin-bottom: 8px; }
-    </style>
-    """)
+    with gr.Row():
+        toggle_left = gr.Checkbox(label="📄 Show Document Panel", value=True)
+        toggle_right = gr.Checkbox(label="🎙️ Show Voice Panel", value=True)
 
     chat_state = gr.State([])
     thread_state = gr.State()
     image_state = gr.State()
     client_id = gr.State()
 
-    with gr.Row():
-        toggle_left = gr.Button("📄 Toggle Document Panel", elem_classes="toggle-btn")
-        toggle_right = gr.Button("🎙️ Toggle Voice Panel", elem_classes="toggle-btn")
-
     with gr.Row(equal_height=True) as layout_row:
-        with gr.Column(scale=1, visible=True) as left_col:
+        left_col = gr.Column(visible=True)
+        with left_col:
             image_display = gr.Image(label="🖼️ Document", type="filepath", show_download_button=False, height=480)
 
-        with gr.Column(scale=2, visible=True) as center_col:
+        center_col = gr.Column(scale=2)
+        with center_col:
             chat = gr.Chatbot(label="💬 Chat", height=480)
             with gr.Row():
                 user_prompt = gr.Textbox(placeholder="Ask your question...", show_label=False, scale=8)
                 send_btn = gr.Button("Send", variant="primary", scale=2)
             with gr.Row():
-                clear_chat_btn = gr.Button("🗑️ Clear Chat", elem_classes="big-btn")
+                clear_chat_btn = gr.Button("🗑️ Clear Chat")
 
-        with gr.Column(scale=1, visible=True) as right_col:
+        right_col = gr.Column(visible=True)
+        with right_col:
             gr.Markdown("### 🎙️ Voice Input")
             voice_input = gr.Audio(label="Tap to Record", streaming=True, type="numpy", show_label=True)
             voice_transcript = gr.Textbox(label="Transcript", lines=2, interactive=False)
-            with gr.Row(equal_height=True):
-                with gr.Column(scale=1):
-                    voice_send_btn = gr.Button("🟢 Send Voice to Assistant", elem_classes="big-btn")
-                with gr.Column(scale=1):
-                    clear_transcript_btn = gr.Button("🧹 Clear Transcript", elem_classes="big-btn")
+            with gr.Row():
+                voice_send_btn = gr.Button("🟢 Send Voice to Assistant")
+                clear_transcript_btn = gr.Button("🧹 Clear Transcript")
 
-    def toggle_column_visibility(current_vis):
-        return gr.update(visible=not current_vis)
+    def update_layout(show_left, show_right):
+        new_layout = {
+            left_col: gr.update(visible=show_left),
+            right_col: gr.update(visible=show_right),
+            center_col: gr.update(scale=2 if (show_left and show_right) else (3 if (show_left or show_right) else 4))
+        }
+        return new_layout
 
-    toggle_left.click(lambda v: toggle_column_visibility(v), inputs=[left_col], outputs=[left_col])
-    toggle_right.click(lambda v: toggle_column_visibility(v), inputs=[right_col], outputs=[right_col])
+    toggle_left.change(fn=update_layout, inputs=[toggle_left, toggle_right], outputs=[left_col, right_col, center_col])
+    toggle_right.change(fn=update_layout, inputs=[toggle_left, toggle_right], outputs=[left_col, right_col, center_col])
 
     send_btn.click(fn=handle_chat, inputs=[user_prompt, chat_state, thread_state, image_state],
                    outputs=[user_prompt, chat, thread_state, image_state])
-
-    voice_input.stream(fn=send_audio, inputs=[voice_input, client_id],
-                       outputs=voice_transcript, stream_every=0.5)
-
-    voice_send_btn.click(fn=feed_transcript, inputs=[voice_transcript, chat_state, thread_state, image_state, client_id],
+    voice_input.stream(fn=send_audio, inputs=[voice_input, client_id], outputs=voice_transcript, stream_every=0.5)
+    voice_send_btn.click(fn=feed_transcript,
+                         inputs=[voice_transcript, chat_state, thread_state, image_state, client_id],
                          outputs=[user_prompt, chat, thread_state, image_state])
-
     clear_transcript_btn.click(fn=clear_transcript_only, inputs=[client_id], outputs=voice_transcript)
     clear_chat_btn.click(fn=clear_chat_only, outputs=[chat, thread_state, image_state])
     image_state.change(fn=update_image_display, inputs=image_state, outputs=image_display)
     app.load(fn=create_ws, outputs=[client_id])
 
-app.launch()
+app.launch()