Update app.py

app.py

@@ -9,6 +9,7 @@ import sys
 import tempfile
 import zipfile
 from datetime import datetime
+import re
 
 class CodingCopilot:
     def __init__(self):
@@ -113,8 +114,26 @@ class CodingCopilot:
         
         return combined_content, status
 
-    def process_message(self, message: str, files: List = None, history: List = None) -> str:
-        """Process user message with advanced context handling for long code generation."""
+    def extract_code_blocks(self, text: str) -> List[str]:
+        """Extract code blocks from response text."""
+        code_blocks = re.findall(r'```(?:\w+)?\n(.*?)\n```', text, re.DOTALL)
+        return code_blocks
+
+    def create_download_file(self, content: str, filename: str = "generated_code.py") -> str:
+        """Create a downloadable file with the given content."""
+        timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
+        base_name = os.path.splitext(filename)[0]
+        extension = os.path.splitext(filename)[1] or '.py'
+        filename = f"{base_name}_{timestamp}{extension}"
+        
+        temp_file = tempfile.NamedTemporaryFile(mode='w', suffix=extension, delete=False)
+        temp_file.write(content)
+        temp_file.close()
+        
+        return temp_file.name
+
+    def process_message(self, message: str, files: List = None, history: List = None) -> Tuple[str, Optional[str]]:
+        """Process user message and return response with optional download file."""
         if history is None:
             history = []
         
@@ -132,12 +151,10 @@ class CodingCopilot:
         context = ""
         if history:
             if is_continuation:
-                # For continuation, include more context (last 5 exchanges)
                 context = "\n\nFull conversation context for continuation:\n"
                 for i, (user_msg, assistant_msg) in enumerate(history[-5:]):
                     context += f"Exchange {i+1}:\nUser: {user_msg}\nAssistant: {assistant_msg}\n\n"
             else:
-                # For new topics, include recent context (last 3 exchanges)
                 context = "\n\nRecent conversation context:\n"
                 for i, (user_msg, assistant_msg) in enumerate(history[-3:]):
                     context += f"User: {user_msg}\nAssistant: {assistant_msg}\n\n"
@@ -171,7 +188,6 @@ User's continuation request: {message}
 {final_instruction}"""
 
         else:
-            # Determine if this is a code generation request
             generation_keywords = ['create', 'generate', 'build', 'make', 'develop', 'write code', 'implement', 'design']
             is_generation = any(keyword in message.lower() for keyword in generation_keywords)
             
@@ -204,7 +220,6 @@ User's request: {message}
 {final_instruction}"""
 
             else:
-                # Regular analysis/chat prompt
                 file_content_section = f"\nCode files content:\n```\n{file_content}\n```" if file_content else ""
                 
                 prompt = f"""You are an advanced coding assistant. Provide detailed, comprehensive responses.
@@ -219,511 +234,578 @@ User's request: {message}
 
 Provide a thorough and helpful response. If suggesting code changes, provide complete implementations."""
 
-        return self.call_claude(prompt, max_tokens=8000)
-
-    def create_download_file(self, content: str, filename: str = "code_output.py") -> str:
-        """Create a downloadable file with the given content."""
-        timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
-        filename = f"{timestamp}_{filename}"
+        # Get response from Claude
+        response = self.call_claude(prompt, max_tokens=8000)
         
-        temp_file = tempfile.NamedTemporaryFile(mode='w', suffix='.py', delete=False)
-        temp_file.write(content)
-        temp_file.close()
+        # Extract code blocks for download
+        code_blocks = self.extract_code_blocks(response)
+        download_file = None
         
-        return temp_file.name
+        if code_blocks:
+            combined_code = "\n\n".join(code_blocks)
+            if len(combined_code.strip()) > 50:  # Only create download if substantial code
+                download_file = self.create_download_file(combined_code)
+        
+        return response, download_file
 
 # Initialize the copilot
 copilot = CodingCopilot()
 
-# Professional ChatGPT-style CSS
-chatgpt_css = """
+# Professional Black & Red CSS Theme
+professional_css = """
 /* Global Styles */
+* {
+    box-sizing: border-box;
+}
+
 .gradio-container {
-    max-width: 1200px !important;
+    max-width: 1400px !important;
     margin: 0 auto !important;
-    background: #ffffff !important;
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif !important;
+    background: #0a0a0a !important;
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif !important;
+    color: #ffffff !important;
 }
 
 /* Header Styles */
 .header-container {
-    background: linear-gradient(90deg, #10a37f 0%, #1a7f64 100%) !important;
-    padding: 1rem 2rem !important;
-    margin: -1rem -1rem 1rem -1rem !important;
-    border-radius: 0 !important;
+    background: linear-gradient(135deg, #1a1a1a 0%, #2d1b1b 50%, #1a1a1a 100%) !important;
+    border: 1px solid #dc2626 !important;
+    border-radius: 12px !important;
+    padding: 2rem !important;
+    margin-bottom: 2rem !important;
+    box-shadow: 0 8px 32px rgba(220, 38, 38, 0.1) !important;
 }
 
 .header-title {
-    color: white !important;
-    font-size: 1.5rem !important;
-    font-weight: 600 !important;
+    color: #ffffff !important;
+    font-size: 2.5rem !important;
+    font-weight: 700 !important;
     margin: 0 !important;
     text-align: center !important;
+    background: linear-gradient(135deg, #ffffff 0%, #dc2626 100%) !important;
+    -webkit-background-clip: text !important;
+    -webkit-text-fill-color: transparent !important;
+    background-clip: text !important;
 }
 
 .header-subtitle {
-    color: rgba(255, 255, 255, 0.9) !important;
-    font-size: 0.9rem !important;
+    color: #a1a1aa !important;
+    font-size: 1.1rem !important;
     text-align: center !important;
     margin: 0.5rem 0 0 0 !important;
+    font-weight: 400 !important;
 }
 
-/* Chat Interface */
-.chat-container {
-    background: #ffffff !important;
-    border-radius: 8px !important;
-    border: 1px solid #e5e5e5 !important;
-    max-height: 600px !important;
-    overflow-y: auto !important;
-    padding: 0 !important;
+/* Main Layout */
+.main-container {
+    background: #111111 !important;
+    border-radius: 16px !important;
+    border: 1px solid #262626 !important;
+    overflow: hidden !important;
+    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;
 }
 
-.chatbot {
-    background: transparent !important;
-    border: none !important;
+/* Sidebar */
+.sidebar {
+    background: linear-gradient(180deg, #1a1a1a 0%, #0f0f0f 100%) !important;
+    border-right: 1px solid #dc2626 !important;
+    padding: 2rem !important;
+    height: 100% !important;
+    min-height: 700px !important;
 }
 
-.message {
-    padding: 1rem 1.5rem !important;
-    border-bottom: 1px solid #f0f0f0 !important;
+.sidebar-title {
+    color: #dc2626 !important;
+    font-weight: 700 !important;
+    font-size: 1.2rem !important;
+    margin-bottom: 1.5rem !important;
+    text-transform: uppercase !important;
+    letter-spacing: 0.5px !important;
 }
 
-.message:last-child {
-    border-bottom: none !important;
+.sidebar-content {
+    color: #d1d5db !important;
+    font-size: 0.9rem !important;
+    line-height: 1.6 !important;
 }
 
-.user-message {
-    background: #f8f9fa !important;
-    margin: 0.5rem 0 !important;
-    padding: 0.75rem 1rem !important;
-    border-radius: 8px !important;
-    border: 1px solid #e9ecef !important;
+.sidebar-content strong {
+    color: #ffffff !important;
 }
 
-.bot-message {
+/* Chat Interface */
+.chat-container {
+    background: #0f0f0f !important;
+    border-radius: 0 !important;
+    border: none !important;
+    min-height: 600px !important;
+    max-height: 600px !important;
+    overflow-y: auto !important;
+}
+
+.chatbot {
     background: transparent !important;
-    margin: 0.5rem 0 !important;
-    padding: 0.75rem 1rem !important;
+    border: none !important;
 }
 
 /* Input Area */
-.input-container {
-    background: #ffffff !important;
-    border: 1px solid #d1d5db !important;
-    border-radius: 12px !important;
-    padding: 0.5rem !important;
-    margin-top: 1rem !important;
+.input-section {
+    background: #1a1a1a !important;
+    border-top: 1px solid #262626 !important;
+    padding: 1.5rem !important;
 }
 
 .input-row {
     display: flex !important;
+    gap: 1rem !important;
     align-items: flex-end !important;
-    gap: 0.5rem !important;
 }
 
-.chat-input {
-    flex: 1 !important;
-    border: none !important;
-    background: transparent !important;
-    resize: vertical !important;
-    min-height: 24px !important;
-    padding: 0.5rem !important;
+.message-input {
+    background: #262626 !important;
+    border: 1px solid #404040 !important;
+    border-radius: 12px !important;
+    color: #ffffff !important;
+    padding: 1rem !important;
     font-size: 1rem !important;
     line-height: 1.5 !important;
+    resize: vertical !important;
+    transition: all 0.3s ease !important;
 }
 
-.chat-input:focus {
+.message-input:focus {
     outline: none !important;
-    box-shadow: none !important;
+    border-color: #dc2626 !important;
+    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1) !important;
+}
+
+.message-input::placeholder {
+    color: #6b7280 !important;
 }
 
 /* Buttons */
-.send-button {
-    background: #10a37f !important;
+.primary-button {
+    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
     color: white !important;
     border: none !important;
-    border-radius: 8px !important;
-    padding: 0.5rem 1rem !important;
-    font-weight: 500 !important;
+    border-radius: 12px !important;
+    padding: 1rem 2rem !important;
+    font-weight: 600 !important;
+    font-size: 1rem !important;
     cursor: pointer !important;
-    transition: background-color 0.2s ease !important;
-    min-width: 80px !important;
-}
-
-.send-button:hover {
-    background: #0d8c6c !important;
+    transition: all 0.3s ease !important;
+    box-shadow: 0 4px 16px rgba(220, 38, 38, 0.2) !important;
+    text-transform: uppercase !important;
+    letter-spacing: 0.5px !important;
 }
 
-.send-button:disabled {
-    background: #9ca3af !important;
-    cursor: not-allowed !important;
+.primary-button:hover {
+    background: linear-gradient(135deg, #b91c1c 0%, #991b1b 100%) !important;
+    transform: translateY(-2px) !important;
+    box-shadow: 0 8px 24px rgba(220, 38, 38, 0.3) !important;
 }
 
 .secondary-button {
-    background: #f3f4f6 !important;
-    color: #374151 !important;
-    border: 1px solid #d1d5db !important;
-    border-radius: 8px !important;
-    padding: 0.5rem 1rem !important;
+    background: #262626 !important;
+    color: #ffffff !important;
+    border: 1px solid #404040 !important;
+    border-radius: 12px !important;
+    padding: 0.75rem 1.5rem !important;
     font-weight: 500 !important;
     cursor: pointer !important;
-    transition: all 0.2s ease !important;
+    transition: all 0.3s ease !important;
+    text-transform: uppercase !important;
+    letter-spacing: 0.5px !important;
+    font-size: 0.9rem !important;
 }
 
 .secondary-button:hover {
-    background: #e5e7eb !important;
-    border-color: #9ca3af !important;
+    background: #404040 !important;
+    border-color: #dc2626 !important;
+    transform: translateY(-1px) !important;
 }
 
-/* File Upload Area */
-.file-upload-area {
-    background: #f9fafb !important;
-    border: 2px dashed #d1d5db !important;
+.quick-action-button {
+    background: #1a1a1a !important;
+    color: #dc2626 !important;
+    border: 1px solid #dc2626 !important;
     border-radius: 8px !important;
-    padding: 1rem !important;
+    padding: 0.75rem 1rem !important;
+    font-weight: 500 !important;
+    cursor: pointer !important;
+    transition: all 0.3s ease !important;
+    margin-bottom: 0.5rem !important;
+    width: 100% !important;
+    text-align: left !important;
+    font-size: 0.9rem !important;
+}
+
+.quick-action-button:hover {
+    background: #dc2626 !important;
+    color: #ffffff !important;
+    transform: translateX(4px) !important;
+}
+
+/* File Upload */
+.file-upload {
+    background: #1a1a1a !important;
+    border: 2px dashed #404040 !important;
+    border-radius: 12px !important;
+    padding: 1.5rem !important;
     text-align: center !important;
-    transition: all 0.2s ease !important;
-    margin-bottom: 1rem !important;
+    transition: all 0.3s ease !important;
+    color: #d1d5db !important;
 }
 
-.file-upload-area:hover {
-    border-color: #10a37f !important;
-    background: #f0fdf4 !important;
+.file-upload:hover {
+    border-color: #dc2626 !important;
+    background: #262626 !important;
 }
 
 .file-upload-text {
-    color: #6b7280 !important;
+    color: #9ca3af !important;
     font-size: 0.9rem !important;
 }
 
-/* Status and Info */
-.status-message {
-    background: #f0f9ff !important;
-    border: 1px solid #7dd3fc !important;
-    border-radius: 6px !important;
-    padding: 0.75rem !important;
-    margin: 0.5rem 0 !important;
-    font-size: 0.9rem !important;
-    color: #0c4a6e !important;
+/* Download Section */
+.download-section {
+    background: #1a1a1a !important;
+    border: 1px solid #262626 !important;
+    border-radius: 12px !important;
+    padding: 1rem !important;
+    margin-top: 1rem !important;
 }
 
-.error-message {
-    background: #fef2f2 !important;
-    border: 1px solid #fecaca !important;
-    border-radius: 6px !important;
-    padding: 0.75rem !important;
+.download-title {
+    color: #dc2626 !important;
+    font-weight: 600 !important;
+    margin-bottom: 0.5rem !important;
+    font-size: 1rem !important;
+}
+
+/* Status Messages */
+.status-success {
+    background: linear-gradient(135deg, #065f46 0%, #047857 100%) !important;
+    border: 1px solid #10b981 !important;
+    border-radius: 8px !important;
+    padding: 1rem !important;
+    color: #ffffff !important;
+    font-size: 0.9rem !important;
     margin: 0.5rem 0 !important;
+}
+
+.status-error {
+    background: linear-gradient(135deg, #7f1d1d 0%, #991b1b 100%) !important;
+    border: 1px solid #dc2626 !important;
+    border-radius: 8px !important;
+    padding: 1rem !important;
+    color: #ffffff !important;
     font-size: 0.9rem !important;
-    color: #991b1b !important;
+    margin: 0.5rem 0 !important;
 }
 
-/* Code blocks */
-.code-block {
-    background: #f8f9fa !important;
-    border: 1px solid #e9ecef !important;
-    border-radius: 6px !important;
+/* Code Blocks */
+pre {
+    background: #0a0a0a !important;
+    border: 1px solid #262626 !important;
+    border-radius: 8px !important;
     padding: 1rem !important;
-    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
+    color: #ffffff !important;
+    font-family: 'JetBrains Mono', 'Fira Code', monospace !important;
     font-size: 0.9rem !important;
     line-height: 1.4 !important;
     overflow-x: auto !important;
 }
 
-/* Sidebar */
-.sidebar {
-    background: #f8f9fa !important;
-    border-right: 1px solid #e5e5e5 !important;
-    padding: 1rem !important;
-    height: 100vh !important;
-    overflow-y: auto !important;
+code {
+    background: #1a1a1a !important;
+    color: #dc2626 !important;
+    padding: 0.2rem 0.4rem !important;
+    border-radius: 4px !important;
+    font-family: 'JetBrains Mono', 'Fira Code', monospace !important;
+    font-size: 0.9rem !important;
 }
 
-.sidebar-title {
-    font-weight: 600 !important;
-    color: #374151 !important;
-    margin-bottom: 1rem !important;
-    font-size: 1.1rem !important;
+/* Scrollbar */
+::-webkit-scrollbar {
+    width: 8px !important;
+    height: 8px !important;
+}
+
+::-webkit-scrollbar-track {
+    background: #1a1a1a !important;
+}
+
+::-webkit-scrollbar-thumb {
+    background: #404040 !important;
+    border-radius: 4px !important;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: #dc2626 !important;
 }
 
 /* Mobile Responsiveness */
 @media (max-width: 768px) {
     .gradio-container {
-        margin: 0 !important;
-        padding: 0.5rem !important;
+        padding: 1rem !important;
     }
     
-    .header-container {
-        margin: -0.5rem -0.5rem 1rem -0.5rem !important;
-        padding: 1rem !important;
+    .header-title {
+        font-size: 2rem !important;
     }
     
-    .chat-container {
-        max-height: 500px !important;
+    .sidebar {
+        min-height: auto !important;
+        padding: 1rem !important;
     }
     
     .input-row {
         flex-direction: column !important;
-        gap: 0.75rem !important;
+        gap: 1rem !important;
     }
     
-    .send-button {
+    .primary-button {
         width: 100% !important;
     }
 }
 
-/* Loading animation */
-.loading {
-    display: inline-block !important;
-    width: 20px !important;
-    height: 20px !important;
-    border: 3px solid #f3f3f3 !important;
-    border-top: 3px solid #10a37f !important;
-    border-radius: 50% !important;
-    animation: spin 1s linear infinite !important;
+/* Animations */
+@keyframes fadeIn {
+    from { opacity: 0; transform: translateY(10px); }
+    to { opacity: 1; transform: translateY(0); }
 }
 
-@keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
+.chat-message {
+    animation: fadeIn 0.3s ease-out !important;
 }
 
-/* Hide default gradio elements */
-.gradio-container .gr-button {
-    transition: all 0.2s ease !important;
-}
-
-/* Custom scrollbar */
-.chat-container::-webkit-scrollbar {
-    width: 6px !important;
-}
-
-.chat-container::-webkit-scrollbar-track {
-    background: #f1f1f1 !important;
-}
-
-.chat-container::-webkit-scrollbar-thumb {
-    background: #c1c1c1 !important;
-    border-radius: 3px !important;
+/* Footer */
+.footer {
+    background: #0a0a0a !important;
+    border-top: 1px solid #262626 !important;
+    padding: 2rem !important;
+    text-align: center !important;
+    color: #6b7280 !important;
+    margin-top: 2rem !important;
 }
 
-.chat-container::-webkit-scrollbar-thumb:hover {
-    background: #a1a1a1 !important;
+.footer strong {
+    color: #dc2626 !important;
 }
 """
 
 def process_chat_message(message, files, history):
-    """Process a new chat message with advanced continuation support."""
+    """Process a new chat message with download support."""
     if not message.strip() and not files:
-        return history, history, ""
+        return history, history, "", None, ""
     
-    # Add user message to history
     if history is None:
         history = []
     
     user_msg = message
     if files:
         file_names = [os.path.basename(f.name) for f in files]
-        user_msg += f" 📁 *[Uploaded: {', '.join(file_names)}]*"
+        user_msg += f" 📁 *[Files: {', '.join(file_names)}]*"
     
-    # Special handling for continuation requests
-    continue_keywords = ['continue', 'continue the code', 'continue from where', 'keep going', 'add more', 'extend', 'complete the']
-    is_continuation = any(keyword in message.lower() for keyword in continue_keywords)
+    # Get AI response with potential download file
+    ai_response, download_file = copilot.process_message(message, files, history)
     
-    if is_continuation and history:
-        # For continuation, show a status message to user
-        status_msg = "🔄 **Continuing from previous code...** (Analyzing context and extending the implementation)"
-        temp_history = history + [[user_msg, status_msg]]
-        
-        # Get AI response with full context
-        ai_response = copilot.process_message(message, files, history)
-        
-        # Add both messages to history
-        history.append([user_msg, ai_response])
-        
-        return history, history, ""
-    else:
-        # Regular processing
-        ai_response = copilot.process_message(message, files, history)
-        
-        # Add both messages to history
-        history.append([user_msg, ai_response])
-        
-        return history, history, ""
-
-def smart_continue_suggestion(history):
-    """Suggest continuation if the last response seems incomplete."""
-    if not history:
-        return ""
+    # Add to history
+    history.append([user_msg, ai_response])
     
-    last_response = history[-1][1] if history else ""
+    # Return download file info
+    download_info = ""
+    if download_file:
+        download_info = "📥 **Code generated successfully!** Download button available below."
     
-    # Check if response might be incomplete
-    incomplete_indicators = [
-        "```" in last_response and last_response.count("```") % 2 != 0,  # Unclosed code block
-        last_response.endswith("..."),
-        "# TODO" in last_response,
-        "# Continue" in last_response.lower(),
-        len(last_response) > 3000  # Very long response might be cut off
-    ]
-    
-    if any(incomplete_indicators):
-        return "💡 **Tip**: Type 'continue' to extend this code or add more functionality!"
-    
-    return ""
+    return history, history, "", download_file, download_info
 
 def clear_chat():
     """Clear the chat history."""
-    return [], []
-
-def create_download_from_message(message):
-    """Create a downloadable file from the current message if it contains code."""
-    if "```" in message:
-        # Extract code blocks
-        import re
-        code_blocks = re.findall(r'```(?:\w+)?\n(.*?)\n```', message, re.DOTALL)
-        if code_blocks:
-            combined_code = "\n\n".join(code_blocks)
-            return copilot.create_download_file(combined_code)
-    return None
+    return [], [], None, ""
+
+def quick_action(action_text):
+    """Handle quick action buttons."""
+    return action_text
 
 # Create the main interface
-with gr.Blocks(css=chatgpt_css, title="Coding Copilot Pro") as app:
+with gr.Blocks(css=professional_css, title="Coding Copilot Pro", theme=gr.themes.Base()) as app:
+    
     # Header
     gr.HTML("""
     <div class="header-container">
-        <h1 class="header-title">🤖 Coding Copilot Pro</h1>
-        <p class="header-subtitle">Your AI-powered coding assistant • Powered by Claude 3 Haiku</p>
+        <h1 class="header-title">⚡ CODING COPILOT PRO</h1>
+        <p class="header-subtitle">Advanced AI-Powered Development Assistant • Powered by Claude 3 Haiku</p>
     </div>
     """)
     
-    # Main chat interface
-    with gr.Row():
-        with gr.Column(scale=1, min_width=250):
-            # Sidebar with features
-            gr.HTML('<h3 class="sidebar-title">✨ Features</h3>')
+    # Main interface
+    with gr.Row(equal_height=True):
+        # Sidebar
+        with gr.Column(scale=1, min_width=300):
+            gr.HTML('<div class="sidebar">')
+            
+            gr.HTML('<h3 class="sidebar-title">🚀 CAPABILITIES</h3>')
             gr.Markdown("""
-            **💬 Chat Features:**
-            • Long code generation (1000+ lines)
-            • Smart continuation support
-            • Code analysis & review
-            • Bug detection & fixes  
-            • Code optimization
-            • Architecture advice
-            • Best practices
+            <div class="sidebar-content">
+            
+            **💻 Code Generation:**
+            • Complete applications & modules
+            • Production-ready implementations
+            • Custom algorithms & data structures
+            • API integrations & web services
+            
+            **🔧 Code Analysis:**
+            • Comprehensive code reviews
+            • Performance optimization
+            • Security vulnerability detection
+            • Architecture recommendations
+            
+            **🐛 Debugging & Testing:**
+            • Error detection & fixes
+            • Unit test generation
+            • Code refactoring
+            • Best practices enforcement
             
-            **📁 File Support:**
-            • Python files (.py)
-            • Jupyter notebooks (.ipynb)
-            • Multiple file upload
+            **📚 Documentation:**
+            • Comprehensive docstrings
+            • API documentation
+            • Code explanations
+            • Technical specifications
             
-            **🛠️ Capabilities:**
-            • Generate complete applications
-            • Continue incomplete code
-            • Debug existing code
-            • Explain complex algorithms
-            • Refactor & optimize
-            • Add comprehensive documentation
+            </div>
+            """, elem_classes=["sidebar-content"])
             
-            **💡 Pro Tips:**
-            • Say "continue" to extend code
-            • Upload files for context
-            • Ask for "complete implementation"
-            • Request "production-ready code"
-            """)
+            gr.HTML('<h3 class="sidebar-title">⚡ QUICK ACTIONS</h3>')
             
-            # Quick actions
-            gr.HTML('<h3 class="sidebar-title">🚀 Quick Actions</h3>')
             with gr.Column():
-                quick_review = gr.Button("📋 Code Review", size="sm", variant="secondary")
-                quick_debug = gr.Button("🐛 Debug Code", size="sm", variant="secondary")
-                quick_optimize = gr.Button("⚡ Optimize", size="sm", variant="secondary")
-                quick_explain = gr.Button("📖 Explain Code", size="sm", variant="secondary")
+                quick_review = gr.Button("📋 COMPREHENSIVE REVIEW", elem_classes=["quick-action-button"])
+                quick_debug = gr.Button("🐛 DEBUG & FIX", elem_classes=["quick-action-button"])
+                quick_optimize = gr.Button("⚡ OPTIMIZE CODE", elem_classes=["quick-action-button"])
+                quick_explain = gr.Button("📖 EXPLAIN & DOCUMENT", elem_classes=["quick-action-button"])
+                quick_generate = gr.Button("🔥 GENERATE NEW CODE", elem_classes=["quick-action-button"])
+                quick_test = gr.Button("🧪 CREATE TESTS", elem_classes=["quick-action-button"])
+            
+            gr.HTML('</div>')
         
+        # Main chat area
         with gr.Column(scale=3):
+            gr.HTML('<div class="main-container">')
+            
             # Chat interface
             chatbot = gr.Chatbot(
-                height=500,
+                height=600,
                 show_label=False,
-                container=True,
+                container=False,
                 bubble_full_width=False,
-                avatar_images=("👤", "🤖")
+                avatar_images=("👨‍💻", "🤖"),
+                elem_classes=["chat-container"]
             )
             
-            # Input area
+            # Download section
+            download_status = gr.HTML("", visible=True)
+            download_file = gr.File(label="📥 Download Generated Code", visible=False)
+            
+            # Input section
+            gr.HTML('<div class="input-section">')
+            
+            # File upload
             with gr.Row():
-                with gr.Column(scale=1):
-                    # File upload
-                    files = gr.File(
-                        label="📎 Attach Files",
-                        file_count="multiple",
-                        file_types=[".py", ".ipynb"],
-                        show_label=False,
-                        container=False
-                    )
-                
-                with gr.Column(scale=4):
-                    # Message input
-                    msg = gr.Textbox(
-                        label="Message",
-                        placeholder="Ask me anything about coding... Type 'continue' to extend previous code, or request 'complete implementation' for long code generation",
-                        show_label=False,
-                        lines=1,
-                        max_lines=5
-                    )
+                files = gr.File(
+                    label="📎 Upload Code Files (.py, .ipynb)",
+                    file_count="multiple",
+                    file_types=[".py", ".ipynb"],
+                    elem_classes=["file-upload"]
+                )
+            
+            # Message input and buttons
+            with gr.Row(elem_classes=["input-row"]):
+                msg = gr.Textbox(
+                    label="",
+                    placeholder="Describe what you want to build, analyze, or improve... Type 'continue' to extend previous code.",
+                    show_label=False,
+                    lines=2,
+                    max_lines=4,
+                    scale=4,
+                    elem_classes=["message-input"]
+                )
                 
-                with gr.Column(scale=1, min_width=100):
-                    # Send and clear buttons
-                    with gr.Row():
-                        submit = gr.Button("Send", variant="primary", scale=2)
-                        clear = gr.Button("🗑️", variant="secondary", scale=1)
+                with gr.Column(scale=1):
+                    submit = gr.Button("SEND", variant="primary", elem_classes=["primary-button"])
+                    clear = gr.Button("CLEAR", variant="secondary", elem_classes=["secondary-button"])
+            
+            gr.HTML('</div>')
+            gr.HTML('</div>')
     
-    # Hidden state for chat history
+    # Hidden state
     chat_history = gr.State([])
     
     # Event handlers
-    def quick_action(action_type):
-        return f"Please {action_type.lower()} the uploaded code files."
+    def handle_submit(message, files, history):
+        result = process_chat_message(message, files, history)
+        return result
+    
+    # Quick actions
+    quick_review.click(
+        lambda: "Please perform a comprehensive code review of the uploaded files. Analyze code quality, identify potential bugs, suggest performance improvements, check for security vulnerabilities, and provide detailed recommendations with examples.",
+        outputs=msg
+    )
+    
+    quick_debug.click(
+        lambda: "Please debug the uploaded code thoroughly. Identify any errors, bugs, logical issues, or potential runtime problems. Provide detailed explanations and complete fixed versions of the code.",
+        outputs=msg
+    )
+    
+    quick_optimize.click(
+        lambda: "Please optimize the uploaded code for better performance, memory usage, and readability. Provide the complete optimized version with explanations of the improvements made.",
+        outputs=msg
+    )
     
-    # Quick action buttons
-    quick_review.click(lambda: "Please perform a comprehensive code review of the uploaded files, including quality assessment, potential bugs, performance improvements, and security considerations.", outputs=msg)
-    quick_debug.click(lambda: "Please debug the uploaded code thoroughly and identify any issues, bugs, or potential problems with detailed fixes.", outputs=msg)
-    quick_optimize.click(lambda: "Please optimize the uploaded code for better performance, readability, and maintainability. Provide the complete optimized version.", outputs=msg)
-    quick_explain.click(lambda: "Please provide a detailed explanation of what this code does, how it works, and its key components with examples.", outputs=msg)
+    quick_explain.click(
+        lambda: "Please provide a detailed explanation of the uploaded code. Break down its functionality, explain the algorithms used, document all functions and classes, and create comprehensive documentation.",
+        outputs=msg
+    )
     
-    # Enhanced continuation support
-    def handle_submit_with_continuation(message, files, history):
-        result_history, result_state, cleared_msg = process_chat_message(message, files, history)
-        suggestion = smart_continue_suggestion(result_history)
-        return result_history, result_state, cleared_msg, suggestion
+    quick_generate.click(
+        lambda: "Please generate a complete, production-ready application based on the requirements. Include all necessary components, error handling, documentation, and best practices.",
+        outputs=msg
+    )
     
-    # Main chat functionality with continuation support
+    quick_test.click(
+        lambda: "Please create comprehensive unit tests for the uploaded code. Include test cases for all functions, edge cases, error handling, and integration tests where applicable.",
+        outputs=msg
+    )
+    
+    # Main functionality
     submit.click(
-        handle_submit_with_continuation,
+        handle_submit,
         inputs=[msg, files, chat_history],
-        outputs=[chatbot, chat_history, msg, gr.HTML(visible=False)]
+        outputs=[chatbot, chat_history, msg, download_file, download_status]
     ).then(
-        lambda: [None, None],  # Clear files after sending
-        outputs=[files, msg]
+        lambda: None,
+        outputs=files
     )
     
-    # Enter key submission with continuation support
     msg.submit(
-        handle_submit_with_continuation,
+        handle_submit,
         inputs=[msg, files, chat_history],
-        outputs=[chatbot, chat_history, msg, gr.HTML(visible=False)]
+        outputs=[chatbot, chat_history, msg, download_file, download_status]
     ).then(
-        lambda: [None, None],
-        outputs=[files, msg]
+        lambda: None,
+        outputs=files
     )
     
-    # Clear chat
-    clear.click(clear_chat, outputs=[chatbot, chat_history])
+    clear.click(
+        clear_chat,
+        outputs=[chatbot, chat_history, download_file, download_status]
+    )
     
     # Footer
     gr.HTML("""
-    <div style="text-align: center; padding: 2rem 0; color: #6b7280; font-size: 0.9rem; border-top: 1px solid #e5e7eb; margin-top: 2rem;">
-        <p><strong>Coding Copilot Pro</strong> • Built with Claude 3 Haiku via AWS Bedrock</p>
-        <p>Upload your code files and start chatting for intelligent analysis, debugging, and optimization</p>
+    <div class="footer">
+        <p><strong>CODING COPILOT PRO</strong> • Professional Development Assistant</p>
+        <p>Upload your code files and start building • Advanced AI • Secure & Private</p>
     </div>
     """)
 
@@ -734,5 +816,6 @@ if __name__ == "__main__":
         server_port=7860,
         share=True,
         show_error=True,
-        show_api=False
+        show_api=False,
+        inbrowser=True
     )