Upload folder using huggingface_hub

app.py

@@ -530,13 +530,19 @@ def run_vm_command(command, current_output="", command_history=""):
             # Add color coding for common patterns
             colored_output = colorize_output(output)
             
-            # Format terminal-style output
-            new_line = f"\n$ {command}\n{colored_output}"
+            # Format terminal-style output with clean spacing
+            new_line = f"$ {command}\n{colored_output.strip()}"
             if exit_code != 0:
                 new_line += f"\n[Exit code: {exit_code}]"
             new_line += "\n$ "
             
-            return current_output + new_line, "", new_history
+            # Clean up the output - remove extra whitespace and format nicely
+            if current_output.strip():
+                full_output = current_output.rstrip() + "\n" + new_line
+            else:
+                full_output = new_line
+            
+            return full_output, "", new_history
         else:
             error_line = f"\n$ {command}\nError: VM API returned {response.status_code}\n$ "
             return current_output + error_line, "", new_history
@@ -700,6 +706,18 @@ custom_css = """
     border-color: #00ff00 !important;
     box-shadow: 0 0 5px rgba(0, 255, 0, 0.3) !important;
 }
+
+/* Additional CSS to ensure Gradio containers also auto-scroll */
+.gr-html {
+    max-height: 500px !important;
+    overflow-y: auto !important;
+    scrollbar-width: none !important;
+    -ms-overflow-style: none !important;
+}
+
+.gr-html::-webkit-scrollbar {
+    display: none !important;
+}
 """
 
 def create_dashboard():
@@ -902,15 +920,31 @@ def create_dashboard():
         # VM Terminal tab - Updated to handle HTML output and command history
         def run_and_clear(cmd, output, history):
             new_output, _, new_history = run_vm_command(cmd, output, history)
-            # Convert to HTML format with auto-scroll script
-            html_output = f'''<div class="terminal-display" id="terminal-content">{new_output.replace(chr(10), "<br>")}</div>
+            # Clean up the output formatting
+            cleaned_output = new_output.replace('\n', '<br>').replace('\r', '')
+            # Create HTML with better auto-scroll
+            html_output = f'''<div class="terminal-display" id="terminal-{hash(new_output) % 10000}">{cleaned_output}</div>
             <script>
-                setTimeout(() => {{
-                    const terminal = document.getElementById('terminal-content');
-                    if (terminal && terminal.parentElement) {{
-                        terminal.parentElement.scrollTop = terminal.parentElement.scrollHeight;
-                    }}
-                }}, 100);
+                (function() {{
+                    setTimeout(() => {{
+                        // Find all terminal containers and scroll them
+                        const containers = document.querySelectorAll('.terminal-container');
+                        containers.forEach(container => {{
+                            container.scrollTop = container.scrollHeight;
+                        }});
+                        
+                        // Also try to find the parent gradio component
+                        const gradioHTML = document.querySelector('[data-testid*="html"]');
+                        if (gradioHTML) {{
+                            const scrollable = gradioHTML.querySelector('.terminal-container') || 
+                                             gradioHTML.closest('.scroll-hide') ||
+                                             gradioHTML.parentElement;
+                            if (scrollable) {{
+                                scrollable.scrollTop = scrollable.scrollHeight;
+                            }}
+                        }}
+                    }}, 50);
+                }})();
             </script>'''
             return html_output, "", new_history