Update app.py

app.py

@@ -6,7 +6,7 @@ from groq import Groq
 api_key = os.environ.get("GROQ_API_KEY")
 client = Groq(api_key=api_key)
 
-# 2. UI Styling - Adjusted height to 500px to be less lengthy
+# 2. UI Styling for Sidebar Layout
 custom_css = """
 .gradio-container { max-width: 1200px; margin: auto; }
 #chatbot-window { height: 500px !important; border-radius: 12px; border: 1px solid #e0e0e0; }
@@ -47,7 +47,7 @@ def chat_with_groq(message, history, model, temperature, system_prompt):
     except Exception as e:
         yield f"⚠️ API Error: {str(e)}"
 
-# 4. Define Event Functions BEFORE using them
+# 4. Define Event Functions
 def user_turn(msg, hist):
     if not msg:
         return "", hist
@@ -69,24 +69,35 @@ with gr.Blocks() as demo:
     gr.Markdown("# ⚡ Groq Professional Studio")
     
     with gr.Row():
-        # LEFT COLUMN: Chat Interface (Height set to 500)
+        # LEFT COLUMN: Main Chat Interface
         with gr.Column(scale=4):
             chatbot = gr.Chatbot(elem_id="chatbot-window", height=500) 
             with gr.Row():
                 msg_input = gr.Textbox(placeholder="Ask me anything...", container=False, scale=9)
                 submit_btn = gr.Button("Send", variant="primary", scale=1)
         
-        # RIGHT COLUMN: Integrated Sidebar
+        # RIGHT COLUMN: The Sidebar (All Settings & Support moved here)
         with gr.Column(scale=1, elem_classes="sidebar-column"):
             gr.Markdown("### ⚙️ Settings")
+            
             model_choice = gr.Dropdown(
                 choices=["llama-3.3-70b-versatile", "llama-3.1-8b-instant"],
-                value="llama-3.3-70b-versatile", label="Select Model"
+                value="llama-3.3-70b-versatile", 
+                label="Select Model"
             )
+            
             temp = gr.Slider(0.0, 1.0, 0.7, label="Temperature")
-            sys_msg = gr.Textbox(value="You are a professional assistant.", label="System Prompt", lines=4)
+            
+            sys_msg = gr.Textbox(
+                value="You are a professional assistant.", 
+                label="System Prompt", 
+                lines=4
+            )
+            
+            # Moved from below input bar to here
             clear = gr.Button("Clear Chat", variant="secondary")
 
+            # LinkedIn Support correctly placed at the bottom of the sidebar
             gr.HTML("""
                 <div class="sidebar-footer">
                     <p style="font-size: 0.9em; margin-bottom: 12px; color: #555;"><b>Developer Support</b></p>
@@ -99,7 +110,7 @@ with gr.Blocks() as demo:
                 </div>
             """)
 
-    # --- Event Linking ---
+    # --- Event Handling ---
     msg_input.submit(user_turn, [msg_input, chatbot], [msg_input, chatbot], queue=False).then(
         bot_turn, [chatbot, model_choice, temp, sys_msg], chatbot
     )
@@ -109,4 +120,5 @@ with gr.Blocks() as demo:
     clear.click(lambda: [], None, chatbot, queue=False)
 
 if __name__ == "__main__":
+    # Settings moved to launch() for Gradio 6 compatibility
     demo.launch(theme=gr.themes.Soft(primary_hue="blue"), css=custom_css)