feat: Implement OpenCode Terminal Portal

.gitignore

@@ -8,3 +8,5 @@ KAI_API_DOCKER/
 zai_captured.json
 .vscode/
 debug_screenshots/
+node_modules/
+.opencode/

admin_router.py

@@ -1129,3 +1129,236 @@ async def test_custom_proxy():
         raise
     except Exception as e:
         raise HTTPException(status_code=500, detail=str(e))
+
+
+# --- Saved Proxies Management ---
+
+class ProxyCreateRequest(BaseModel):
+    name: Optional[str] = None
+    ip: str
+    port: int
+    protocol: str = "http"
+    username: Optional[str] = None
+    password: Optional[str] = None
+    country: Optional[str] = None
+    city: Optional[str] = None
+    notes: Optional[str] = None
+
+@router.get("/proxies")
+async def list_proxies():
+    """Get all saved proxies from Supabase."""
+    try:
+        from db import get_supabase
+        
+        supabase = get_supabase()
+        if not supabase:
+            return {"proxies": []}
+        
+        res = supabase.table("kaiapi_proxies").select("*").order("created_at", desc=True).execute()
+        return {"proxies": res.data or []}
+    except Exception as e:
+        logger.error(f"Failed to list proxies: {e}")
+        return {"proxies": []}
+
+@router.post("/proxies")
+async def create_proxy(req: ProxyCreateRequest):
+    """Add a new proxy to Supabase."""
+    try:
+        from db import get_supabase
+        
+        supabase = get_supabase()
+        if not supabase:
+            raise HTTPException(status_code=503, detail="Database unavailable")
+        
+        proxy_data = {
+            "name": req.name,
+            "ip": req.ip,
+            "port": req.port,
+            "protocol": req.protocol,
+            "username": req.username,
+            "password": req.password,
+            "country": req.country,
+            "city": req.city,
+            "notes": req.notes,
+            "is_active": False
+        }
+        
+        res = supabase.table("kaiapi_proxies").insert(proxy_data).execute()
+        
+        return {
+            "status": "success",
+            "message": "Proxy saved",
+            "proxy": res.data[0] if res.data else None
+        }
+    except HTTPException:
+        raise
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+@router.post("/proxies/{proxy_id}/activate")
+async def activate_proxy(proxy_id: int):
+    """Activate a saved proxy."""
+    try:
+        from db import get_supabase
+        from proxy_manager import get_proxy_manager
+        
+        supabase = get_supabase()
+        if not supabase:
+            raise HTTPException(status_code=503, detail="Database unavailable")
+        
+        res = supabase.table("kaiapi_proxies").select("*").eq("id", proxy_id).execute()
+        if not res.data:
+            raise HTTPException(status_code=404, detail="Proxy not found")
+        
+        proxy = res.data[0]
+        
+        # Deactivate all first
+        supabase.table("kaiapi_proxies").update({"is_active": False}).neq("id", proxy_id).execute()
+        
+        # Activate this one
+        supabase.table("kaiapi_proxies").update({"is_active": True}).eq("id", proxy_id).execute()
+        
+        # Set as current
+        proxy_mgr = get_proxy_manager()
+        proxy_str = f"{proxy['protocol']}://{proxy['ip']}:{proxy['port']}"
+        proxy_mgr.set_custom_proxy(proxy_str, proxy.get("username"), proxy.get("password"))
+        
+        return {"status": "success", "message": f"Proxy activated"}
+    except HTTPException:
+        raise
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+@router.delete("/proxies/{proxy_id}")
+async def delete_proxy(proxy_id: int):
+    """Delete a saved proxy."""
+    try:
+        from db import get_supabase
+        
+        supabase = get_supabase()
+        if not supabase:
+            raise HTTPException(status_code=503, detail="Database unavailable")
+        
+        supabase.table("kaiapi_proxies").delete().eq("id", proxy_id).execute()
+        
+        return {"status": "success", "message": "Proxy deleted"}
+    except HTTPException:
+        raise
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+# --- OpenCode Terminal Portal ---
+
+class TerminalInput(BaseModel):
+    text: str
+
+class TerminalKey(BaseModel):
+    key: str
+
+@router.post("/terminal/start")
+async def start_terminal(req: dict):
+    """Start OpenCode terminal session."""
+    try:
+        from opencode_terminal import get_terminal_manager
+        
+        model = req.get("model", "kimi-k2.5-free")
+        manager = get_terminal_manager()
+        portal = manager.get_portal(model)
+        
+        if portal.is_running():
+            return {
+                "status": "already_running",
+                "model": model,
+                "message": f"Terminal for {model} is already running"
+            }
+        
+        await portal.initialize()
+        
+        return {
+            "status": "success",
+            "model": model,
+            "message": f"Terminal started for {model}"
+        }
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+@router.get("/terminal/output")
+async def get_terminal_output(model: str = "kimi-k2.5-free", lines: int = 100):
+    """Get recent terminal output."""
+    try:
+        from opencode_terminal import get_terminal_manager
+        
+        manager = get_terminal_manager()
+        portal = manager.get_portal(model)
+        
+        if not portal.is_running():
+            return {"lines": [], "status": "stopped"}
+            
+        output_lines = portal.get_output(max_lines=lines)
+        
+        # Format for frontend
+        formatted_lines = [
+            {"type": stream, "content": line} 
+            for stream, line in output_lines
+        ]
+        
+        return {
+            "lines": formatted_lines,
+            "status": "running"
+        }
+    except Exception as e:
+        return {"lines": [], "error": str(e), "status": "error"}
+
+@router.post("/terminal/input")
+async def send_terminal_input(req: TerminalInput, model: str = "kimi-k2.5-free"):
+    """Send text input to terminal."""
+    try:
+        from opencode_terminal import get_terminal_manager
+        
+        manager = get_terminal_manager()
+        portal = manager.get_portal(model)
+        
+        if not portal.is_running():
+            raise HTTPException(status_code=400, detail="Terminal not running")
+            
+        success = await portal.send_input(req.text)
+        
+        return {"status": "success" if success else "error"}
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+@router.post("/terminal/key")
+async def send_terminal_key(req: TerminalKey, model: str = "kimi-k2.5-free"):
+    """Send special key to terminal."""
+    try:
+        from opencode_terminal import get_terminal_manager
+        
+        manager = get_terminal_manager()
+        portal = manager.get_portal(model)
+        
+        if not portal.is_running():
+            raise HTTPException(status_code=400, detail="Terminal not running")
+            
+        success = await portal.send_key(req.key)
+        
+        return {"status": "success" if success else "error"}
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+@router.post("/terminal/close")
+async def close_terminal(req: dict):
+    """Close terminal session."""
+    try:
+        from opencode_terminal import get_terminal_manager
+        
+        model = req.get("model", "kimi-k2.5-free")
+        manager = get_terminal_manager()
+        portal = manager.get_portal(model)
+        
+        await portal.close()
+        
+        return {"status": "success", "message": "Terminal closed"}
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+

config.py

@@ -31,6 +31,12 @@ MODEL_RANKING = [
     ("g4f-gpt-3.5-turbo", "g4f", "gpt-3.5-turbo"),
     ("g4f-claude-3-haiku", "g4f", "claude-3-haiku"),
     ("g4f-mixtral-8x7b", "g4f", "mixtral-8x7b"),
+    
+    # Tier 4 — OpenCode Terminal Models (Free)
+    ("opencode-kimi-k2.5-free", "opencode", "kimi-k2.5-free"),
+    ("opencode-minimax-m2.5-free", "opencode", "minimax-m2.5-free"),
+    ("opencode-big-pickle", "opencode", "big-pickle"),
+    ("opencode-glm-4.7", "opencode", "glm-4.7"),
 ]
 
 # Request timeout in seconds per individual attempt
@@ -72,6 +78,7 @@ PROVIDERS = {
     "huggingchat": {"enabled": True, "name": "HuggingChat", "type": "browser"},
     "copilot": {"enabled": False, "name": "Microsoft Copilot", "type": "browser"},
     "chatgpt": {"enabled": False, "name": "ChatGPT", "type": "browser"},
+    "opencode": {"enabled": False, "name": "OpenCode Terminal", "type": "terminal"},
 }
 
 # API Keys
@@ -100,4 +107,10 @@ PROVIDER_MODELS = {
         "pollinations-chickytutor",
         "pollinations-midijourney",
     ],
+    "opencode": [
+        "opencode-kimi-k2.5-free",
+        "opencode-minimax-m2.5-free",
+        "opencode-big-pickle",
+        "opencode-glm-4.7",
+    ],
 }

opencode_terminal.py

@@ -0,0 +1,326 @@
+"""
+OpenCode Terminal Portal
+-------------------------
+Manages OpenCode terminal TUI as a provider.
+Supports free models: Kimi K2.5 Free, MiniMax M2.5 Free, Big Pickle, GLM 4.7
+"""
+
+import asyncio
+import logging
+import subprocess
+import os
+import json
+from typing import Optional, Dict, Any, Callable
+from dataclasses import dataclass
+from datetime import datetime
+import threading
+import queue
+
+logger = logging.getLogger("kai_api.terminal_portal")
+
+
+@dataclass
+class TerminalConfig:
+    """Configuration for OpenCode terminal."""
+    name: str
+    model: str  # e.g., "kimi-k2.5-free", "minimax-m2.5-free"
+    project_dir: str = "."
+    config_path: str = ".opencode/config.json"
+
+
+# Free models configuration
+OPENCODE_MODELS = {
+    "kimi-k2.5-free": {
+        "name": "Kimi K2.5 Free",
+        "provider": "opencode-zen",
+        "description": "Moonshot AI's Kimi K2.5 - Free tier"
+    },
+    "minimax-m2.5-free": {
+        "name": "MiniMax M2.5 Free", 
+        "provider": "opencode-zen",
+        "description": "MiniMax M2.5 - Free tier"
+    },
+    "big-pickle": {
+        "name": "Big Pickle",
+        "provider": "opencode-zen", 
+        "description": "Stealth model - Free"
+    },
+    "glm-4.7": {
+        "name": "GLM 4.7",
+        "provider": "opencode-zen",
+        "description": "GLM 4.7 - Free tier"
+    }
+}
+
+
+class OpenCodeTerminalPortal:
+    """Manages OpenCode terminal TUI session."""
+    
+    def __init__(self, config: TerminalConfig):
+        self.config = config
+        self.process: Optional[subprocess.Popen] = None
+        self.is_initialized = False
+        self.output_queue = queue.Queue()
+        self.input_queue = queue.Queue()
+        self.output_thread: Optional[threading.Thread] = None
+        self.on_output_callback: Optional[Callable] = None
+        self.screenshot_path = f"/tmp/opencode_{config.model}.png"
+        self.last_activity = None
+        self._keyboard_active = False
+        
+    async def initialize(self):
+        """Initialize OpenCode terminal session."""
+        if self.is_initialized:
+            return
+            
+        try:
+            logger.info(f"🚀 Starting OpenCode terminal with model: {self.config.model}")
+            
+            # Ensure config directory exists
+            os.makedirs(".opencode", exist_ok=True)
+            
+            # Create config file for this model
+            config_data = {
+                "$schema": "https://opencode.ai/config.json",
+                "theme": "opencode",
+                "provider": {
+                    "opencode-zen": {
+                        "npm": "@ai-sdk/openai-compatible",
+                        "options": {
+                            "baseURL": "https://opencode.ai/zen/v1"
+                        },
+                        "models": {
+                            model: {"name": info["name"]} 
+                            for model, info in OPENCODE_MODELS.items()
+                        }
+                    }
+                },
+                "model": f"opencode-zen/{self.config.model}",
+                "autoshare": False,
+                "autoupdate": True
+            }
+            
+            with open(self.config.config_path, 'w') as f:
+                json.dump(config_data, f, indent=2)
+            
+            # Start OpenCode process
+            env = os.environ.copy()
+            env['OPENCODE_CONFIG'] = os.path.abspath(self.config.config_path)
+            
+            self.process = subprocess.Popen(
+                ['npx', 'opencode-ai'],
+                cwd=self.config.project_dir,
+                env=env,
+                stdin=subprocess.PIPE,
+                stdout=subprocess.PIPE,
+                stderr=subprocess.PIPE,
+                text=True,
+                bufsize=1
+            )
+            
+            # Start output reading thread
+            self.output_thread = threading.Thread(target=self._read_output)
+            self.output_thread.daemon = True
+            self.output_thread.start()
+            
+            self.is_initialized = True
+            logger.info(f"✅ OpenCode terminal ready with {self.config.model}")
+            
+            await asyncio.sleep(2)  # Give it time to start
+            await self.take_screenshot()
+            
+        except Exception as e:
+            logger.error(f"Failed to initialize OpenCode terminal: {e}")
+            raise
+    
+    def _read_output(self):
+        """Read output from OpenCode process in background thread."""
+        try:
+            while self.process and self.process.poll() is None:
+                # Read line from stdout
+                line = self.process.stdout.readline()
+                if line:
+                    self.output_queue.put(('stdout', line))
+                    if self.on_output_callback:
+                        asyncio.create_task(self.on_output_callback('stdout', line))
+                
+                # Check stderr
+                import select
+                if self.process.stderr in select.select([self.process.stderr], [], [], 0)[0]:
+                    err_line = self.process.stderr.readline()
+                    if err_line:
+                        self.output_queue.put(('stderr', err_line))
+        except Exception as e:
+            logger.error(f"Error reading output: {e}")
+    
+    async def send_input(self, text: str):
+        """Send text input to OpenCode."""
+        if not self.process or not self.is_initialized:
+            return False
+        
+        try:
+            self.process.stdin.write(text + '\n')
+            self.process.stdin.flush()
+            self.last_activity = datetime.now()
+            return True
+        except Exception as e:
+            logger.error(f"Error sending input: {e}")
+            return False
+    
+    async def send_key(self, key: str):
+        """Send a special key to OpenCode (e.g., 'ctrl+c', 'enter', 'tab')."""
+        if not self.process or not self.is_initialized:
+            return False
+        
+        try:
+            # Map common keys
+            key_map = {
+                'Enter': '\n',
+                'Tab': '\t',
+                'Escape': '\x1b',
+                'Backspace': '\x7f',
+                'Delete': '\x1b[3~',
+                'ArrowUp': '\x1b[A',
+                'ArrowDown': '\x1b[B',
+                'ArrowLeft': '\x1b[D',
+                'ArrowRight': '\x1b[C',
+            }
+            
+            char = key_map.get(key, key)
+            self.process.stdin.write(char)
+            self.process.stdin.flush()
+            return True
+        except Exception as e:
+            logger.error(f"Error sending key: {e}")
+            return False
+    
+    async def execute_command(self, command: str):
+        """Execute an OpenCode command (e.g., '/models', '/connect')."""
+        return await self.send_input(command)
+    
+    async def take_screenshot(self) -> str:
+        """Take a screenshot of the terminal (if supported by terminal emulator)."""
+        # For now, we'll create a text-based representation
+        # In production, you could use a terminal emulator that supports screenshots
+        try:
+            # Get recent output
+            output_lines = []
+            while not self.output_queue.empty() and len(output_lines) < 50:
+                try:
+                    stream, line = self.output_queue.get_nowait()
+                    output_lines.append(line)
+                except queue.Empty:
+                    break
+            
+            # Create a simple text screenshot
+            screenshot_text = "\n".join(output_lines[-25:]) if output_lines else "Terminal ready..."
+            
+            # Save to file
+            with open(self.screenshot_path, 'w') as f:
+                f.write(screenshot_text)
+            
+            return self.screenshot_path
+        except Exception as e:
+            logger.error(f"Screenshot failed: {e}")
+            return ""
+    
+    def get_output(self, max_lines: int = 100) -> list:
+        """Get recent output lines."""
+        lines = []
+        temp_queue = queue.Queue()
+        
+        # Get lines from queue without removing them permanently
+        while not self.output_queue.empty() and len(lines) < max_lines:
+            try:
+                item = self.output_queue.get_nowait()
+                lines.append(item)
+                temp_queue.put(item)
+            except queue.Empty:
+                break
+        
+        # Put them back
+        while not temp_queue.empty():
+            self.output_queue.put(temp_queue.get())
+        
+        return lines
+    
+    def set_keyboard_active(self, active: bool):
+        """Enable/disable keyboard input capture."""
+        self._keyboard_active = active
+        logger.info(f"Keyboard {'activated' if active else 'deactivated'} for OpenCode")
+    
+    def is_keyboard_active(self) -> bool:
+        """Check if keyboard is active."""
+        return self._keyboard_active
+    
+    def is_running(self) -> bool:
+        """Check if OpenCode is running."""
+        if not self.process:
+            return False
+        return self.process.poll() is None
+    
+    async def close(self):
+        """Close the OpenCode terminal."""
+        try:
+            if self.process:
+                # Send exit command
+                try:
+                    self.process.stdin.write('/exit\n')
+                    self.process.stdin.flush()
+                    await asyncio.sleep(1)
+                except:
+                    pass
+                
+                # Kill if still running
+                if self.process.poll() is None:
+                    self.process.terminate()
+                    await asyncio.sleep(2)
+                    if self.process.poll() is None:
+                        self.process.kill()
+                
+                self.process = None
+            
+            self.is_initialized = False
+            logger.info("OpenCode terminal closed")
+            
+        except Exception as e:
+            logger.error(f"Error closing OpenCode: {e}")
+
+
+class TerminalPortalManager:
+    """Manages multiple OpenCode terminal portals."""
+    
+    def __init__(self):
+        self.portals: Dict[str, OpenCodeTerminalPortal] = {}
+    
+    def get_portal(self, model: str) -> OpenCodeTerminalPortal:
+        """Get or create a portal for a specific model."""
+        if model not in self.portals:
+            if model not in OPENCODE_MODELS:
+                raise ValueError(f"Unknown OpenCode model: {model}")
+            
+            config = TerminalConfig(
+                name=OPENCODE_MODELS[model]["name"],
+                model=model,
+                config_path=f".opencode/config_{model}.json"
+            )
+            self.portals[model] = OpenCodeTerminalPortal(config)
+        
+        return self.portals[model]
+    
+    def get_available_models(self) -> Dict[str, Dict]:
+        """Get all available OpenCode models."""
+        return OPENCODE_MODELS.copy()
+    
+    async def close_all(self):
+        """Close all terminal portals."""
+        for portal in self.portals.values():
+            await portal.close()
+
+
+# Global instance
+_terminal_manager = TerminalPortalManager()
+
+def get_terminal_manager() -> TerminalPortalManager:
+    """Get the global terminal manager."""
+    return _terminal_manager

package-lock.json

@@ -0,0 +1,171 @@
+{
+  "name": "kai_api",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "kai_api",
+      "version": "1.0.0",
+      "license": "ISC",
+      "dependencies": {
+        "opencode-ai": "^1.2.4"
+      }
+    },
+    "node_modules/opencode-ai": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-ai/-/opencode-ai-1.2.4.tgz",
+      "integrity": "sha512-ZBC09OXhvGrgTOJoGWlj/Og+LMwStDlNad4t1ZctGr63vAYu8J3HrjIRrKrIH13Awd8yb+Nlbome9kSGRCyTgA==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "opencode": "bin/opencode"
+      },
+      "optionalDependencies": {
+        "opencode-darwin-arm64": "1.2.4",
+        "opencode-darwin-x64": "1.2.4",
+        "opencode-darwin-x64-baseline": "1.2.4",
+        "opencode-linux-arm64": "1.2.4",
+        "opencode-linux-arm64-musl": "1.2.4",
+        "opencode-linux-x64": "1.2.4",
+        "opencode-linux-x64-baseline": "1.2.4",
+        "opencode-linux-x64-baseline-musl": "1.2.4",
+        "opencode-linux-x64-musl": "1.2.4",
+        "opencode-windows-x64": "1.2.4",
+        "opencode-windows-x64-baseline": "1.2.4"
+      }
+    },
+    "node_modules/opencode-darwin-arm64": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-darwin-arm64/-/opencode-darwin-arm64-1.2.4.tgz",
+      "integrity": "sha512-D0c6jIHNoA7EjUWgLTrR4ILvOqCThKpZTh9keUk3UXcMVpVC/yLCFxbwocz3qchBx8BJsYdh2S9YA59x8Mf4KQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/opencode-darwin-x64": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-darwin-x64/-/opencode-darwin-x64-1.2.4.tgz",
+      "integrity": "sha512-rJekyjC5JkMCCQnl1d6+Q8/16KVgRv4MvBW22l4n5gukxDfgzyCJ9yrd+Py9oMTElwRPjToN0M972gFx4Ubvzw==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/opencode-darwin-x64-baseline": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-darwin-x64-baseline/-/opencode-darwin-x64-baseline-1.2.4.tgz",
+      "integrity": "sha512-/vSFe+DDSWC7i3rb/Nv8MYgGxrVWqm+CK2ikLkVSKdOdRm3I6EnRBmrp7idayechpMmuwsibJfvJgTU26iY1ug==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/opencode-linux-arm64": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-linux-arm64/-/opencode-linux-arm64-1.2.4.tgz",
+      "integrity": "sha512-7fIAUxA0L1TsQjUy0/DR48N56DMKxi/5dzeuJkTkrBu1niwoYnkU7ZFS4eyIvBJ2ukNZ9WE1EHnPf12JrzEReQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/opencode-linux-arm64-musl": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-linux-arm64-musl/-/opencode-linux-arm64-musl-1.2.4.tgz",
+      "integrity": "sha512-Y8yLaKWHv4iVuRbgfYne0BNYhZcXD07dV6MD6YbZ0im8uxwNR+l2eOc6ZYJFyMnt8yAC96nhqgfN6h9GpFQnzQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/opencode-linux-x64": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-linux-x64/-/opencode-linux-x64-1.2.4.tgz",
+      "integrity": "sha512-G+JEHu8FfBYl9LCjAdF+AyrZxPrtpBxwEbj/v+h+9y4rYBtYHDD+4eIKUJP9pHjELcvpX70mGJoZ08DFr3XQhA==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/opencode-linux-x64-baseline": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-linux-x64-baseline/-/opencode-linux-x64-baseline-1.2.4.tgz",
+      "integrity": "sha512-P3eVKVopEtA7lc2PdmlMvM11ReLmJQh3KrgMogzV6AUHr6raU3eGRkwu6pvXYTrQ8cT9LmVrgeTIT+XmVfyrOg==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/opencode-linux-x64-baseline-musl": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-linux-x64-baseline-musl/-/opencode-linux-x64-baseline-musl-1.2.4.tgz",
+      "integrity": "sha512-ezEzQsZIjfJ6uJT2WegaX5XuPooHQGpJAoOcYolNtwavOYOxq9VmG3qvMHHWVlGazNWobevo9hKCoE3IBffETw==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/opencode-linux-x64-musl": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-linux-x64-musl/-/opencode-linux-x64-musl-1.2.4.tgz",
+      "integrity": "sha512-OCJyM4cN5ld2LkJEsNM5fEAPb2146JC0KCtsJ0v7zULyW2kSwDedK0hBerQYUcknY5QGfiQqmtSMqWXSckNLKw==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/opencode-windows-x64": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-windows-x64/-/opencode-windows-x64-1.2.4.tgz",
+      "integrity": "sha512-t8D+xl+Djqy0N0eV66FYzvOKGZ9xNe8HAJAD6/QeYD5AJ3turd8+M0F24M8oaDITU00GuZ0A3E80Xqv1s2/gWA==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/opencode-windows-x64-baseline": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/opencode-windows-x64-baseline/-/opencode-windows-x64-baseline-1.2.4.tgz",
+      "integrity": "sha512-fgI5EkoyS6Kc4wOOCPGnqG+az4h98RIUInGLsxv8bq5j3WOLfXKwEQuFEUWL+JiOcTb7lTcEYcBnoPzYU4yr8w==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    }
+  }
+}

package.json

@@ -0,0 +1,24 @@
+{
+  "name": "kai_api",
+  "version": "1.0.0",
+  "description": "--- title: KAI API Gateway emoji: 🦀 colorFrom: indigo colorTo: purple sdk: docker pinned: false app_port: 7860 ---",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/KiWA001/kai-api-gateway.git"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "commonjs",
+  "bugs": {
+    "url": "https://github.com/KiWA001/kai-api-gateway/issues"
+  },
+  "homepage": "https://github.com/KiWA001/kai-api-gateway#readme",
+  "dependencies": {
+    "opencode-ai": "^1.2.4"
+  }
+}

provider_state.py

@@ -36,6 +36,7 @@ class ProviderStateManager:
                 
                 if res.data:
                     # Load existing states
+                    existing_ids = set()
                     for row in res.data:
                         provider_id = row.get("provider_id")
                         if provider_id:
@@ -44,6 +45,23 @@ class ProviderStateManager:
                                 "name": row.get("name", provider_id),
                                 "type": row.get("type", "api"),
                             }
+                            existing_ids.add(provider_id)
+                    
+                    # Add any new providers from PROVIDERS that aren't in DB
+                    for provider_id, config in PROVIDERS.items():
+                        if provider_id not in existing_ids:
+                            try:
+                                supabase.table(TABLE_NAME).insert({
+                                    "provider_id": provider_id,
+                                    "enabled": config["enabled"],
+                                    "name": config["name"],
+                                    "type": config["type"]
+                                }).execute()
+                                self._providers[provider_id] = config.copy()
+                                logger.info(f"✅ Added new provider: {provider_id}")
+                            except Exception as e:
+                                logger.warning(f"Could not add provider {provider_id}: {e}")
+                    
                     logger.info(f"✅ Loaded {len(self._providers)} provider states from Supabase")
                 else:
                     # Initialize with defaults

static/qaz.html

@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
@@ -9,7 +10,7 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
     <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
-    
+
     <style>
         :root {
             --bg: #09090b;
@@ -25,18 +26,18 @@
             --warning: #f59e0b;
             --info: #3b82f6;
         }
-        
+
         * {
             margin: 0;
             padding: 0;
             box-sizing: border-box;
             -webkit-tap-highlight-color: transparent;
         }
-        
+
         html {
             font-size: 16px;
         }
-        
+
         body {
             background: var(--bg);
             color: var(--text);
@@ -45,21 +46,21 @@
             line-height: 1.5;
             overflow-x: hidden;
         }
-        
+
         /* Mobile-First Base Styles */
         .app-container {
             max-width: 100%;
             margin: 0 auto;
             padding: 12px;
         }
-        
+
         @media (min-width: 768px) {
             .app-container {
                 max-width: 1200px;
                 padding: 20px;
             }
         }
-        
+
         /* Header */
         .app-header {
             display: flex;
@@ -69,7 +70,7 @@
             border-bottom: 1px solid var(--border);
             margin-bottom: 20px;
         }
-        
+
         .app-header h1 {
             font-size: 1.5rem;
             font-weight: 700;
@@ -78,28 +79,28 @@
             -webkit-text-fill-color: transparent;
             background-clip: text;
         }
-        
+
         .header-actions {
             display: flex;
             gap: 8px;
         }
-        
+
         @media (max-width: 480px) {
             .app-header h1 {
                 font-size: 1.25rem;
             }
-            
+
             .header-actions {
                 flex-direction: column;
                 gap: 4px;
             }
-            
+
             .header-actions button {
                 padding: 6px 12px;
                 font-size: 12px;
             }
         }
-        
+
         /* Cards */
         .card {
             background: var(--surface);
@@ -108,33 +109,33 @@
             padding: 16px;
             margin-bottom: 16px;
         }
-        
+
         @media (min-width: 768px) {
             .card {
                 padding: 24px;
                 margin-bottom: 24px;
             }
         }
-        
+
         .card-header {
             display: flex;
             justify-content: space-between;
             align-items: center;
             margin-bottom: 16px;
         }
-        
+
         .card-title {
             font-size: 1.125rem;
             font-weight: 600;
             color: var(--text);
         }
-        
+
         .card-subtitle {
             font-size: 0.875rem;
             color: var(--text-secondary);
             margin-top: 4px;
         }
-        
+
         /* Buttons */
         .btn {
             display: inline-flex;
@@ -151,53 +152,53 @@
             white-space: nowrap;
             min-height: 40px;
         }
-        
+
         .btn:active {
             transform: scale(0.98);
         }
-        
+
         .btn-primary {
             background: var(--accent);
             color: white;
         }
-        
+
         .btn-primary:hover {
             background: var(--accent-hover);
         }
-        
+
         .btn-secondary {
             background: var(--surface-hover);
             color: var(--text);
             border: 1px solid var(--border);
         }
-        
+
         .btn-secondary:hover {
             background: var(--border);
         }
-        
+
         .btn-success {
             background: var(--success);
             color: white;
         }
-        
+
         .btn-danger {
             background: transparent;
             color: var(--error);
             border: 1px solid var(--error);
         }
-        
+
         .btn-icon {
             padding: 10px;
             min-width: 40px;
         }
-        
+
         /* Input Fields */
         .input-group {
             display: flex;
             gap: 8px;
             flex-wrap: wrap;
         }
-        
+
         .input-field {
             flex: 1;
             min-width: 200px;
@@ -209,16 +210,16 @@
             font-size: 0.9375rem;
             transition: border-color 0.2s ease;
         }
-        
+
         .input-field:focus {
             outline: none;
             border-color: var(--accent);
         }
-        
+
         .input-field::placeholder {
             color: var(--text-secondary);
         }
-        
+
         /* Select */
         .select-field {
             padding: 12px 16px;
@@ -230,7 +231,7 @@
             cursor: pointer;
             min-width: 180px;
         }
-        
+
         /* Browser Section */
         .browser-container {
             background: var(--bg);
@@ -238,7 +239,7 @@
             border-radius: 12px;
             overflow: hidden;
         }
-        
+
         .browser-toolbar {
             display: flex;
             align-items: center;
@@ -248,14 +249,14 @@
             border-bottom: 1px solid var(--border);
             flex-wrap: wrap;
         }
-        
+
         @media (max-width: 480px) {
             .browser-toolbar {
                 padding: 8px;
                 gap: 6px;
             }
         }
-        
+
         .browser-nav-btn {
             width: 36px;
             height: 36px;
@@ -269,18 +270,18 @@
             border-radius: 8px;
             cursor: pointer;
         }
-        
+
         .browser-nav-btn:active {
             background: var(--surface-hover);
         }
-        
+
         .browser-address-bar {
             flex: 1;
             display: flex;
             gap: 6px;
             min-width: 200px;
         }
-        
+
         .browser-address-input {
             flex: 1;
             padding: 8px 12px;
@@ -291,25 +292,39 @@
             font-size: 0.875rem;
             font-family: monospace;
         }
-        
+
         .browser-address-input:focus {
             outline: none;
             border-color: var(--accent);
         }
-        
+
         .browser-stream-container {
             position: relative;
             background: #000;
             aspect-ratio: 16/10;
             overflow: hidden;
         }
-        
+
+        .terminal-view {
+            width: 100%;
+            height: 100%;
+            background: #0c0c0c;
+            color: #22c55e;
+            font-family: 'Menlo', 'Monaco', 'Courier New', monospace;
+            padding: 12px;
+            font-size: 0.85rem;
+            overflow-y: auto;
+            white-space: pre-wrap;
+            display: none;
+            text-align: left;
+        }
+
         .browser-stream {
             width: 100%;
             height: 100%;
             object-fit: contain;
         }
-        
+
         .browser-overlay {
             position: absolute;
             top: 0;
@@ -318,7 +333,7 @@
             bottom: 0;
             cursor: crosshair;
         }
-        
+
         .browser-loading {
             position: absolute;
             top: 50%;
@@ -330,7 +345,7 @@
             gap: 12px;
             color: var(--text);
         }
-        
+
         .spinner {
             width: 40px;
             height: 40px;
@@ -339,11 +354,13 @@
             border-radius: 50%;
             animation: spin 1s linear infinite;
         }
-        
+
         @keyframes spin {
-            to { transform: rotate(360deg); }
+            to {
+                transform: rotate(360deg);
+            }
         }
-        
+
         .browser-status-bar {
             display: flex;
             justify-content: space-between;
@@ -354,14 +371,14 @@
             font-size: 0.75rem;
             color: var(--text-secondary);
         }
-        
+
         .browser-controls {
             display: flex;
             gap: 8px;
             padding: 12px;
             flex-wrap: wrap;
         }
-        
+
         /* Video Quality Selector */
         .quality-selector {
             display: flex;
@@ -371,7 +388,7 @@
             background: var(--bg);
             border-radius: 8px;
         }
-        
+
         .quality-btn {
             padding: 4px 10px;
             border: 1px solid var(--border);
@@ -381,13 +398,13 @@
             font-size: 0.75rem;
             cursor: pointer;
         }
-        
+
         .quality-btn.active {
             background: var(--accent);
             color: white;
             border-color: var(--accent);
         }
-        
+
         /* On-Screen Keyboard */
         .osk-container {
             background: var(--surface);
@@ -397,14 +414,14 @@
             bottom: 0;
             z-index: 100;
         }
-        
+
         .osk-row {
             display: flex;
             justify-content: center;
             gap: 4px;
             margin-bottom: 6px;
         }
-        
+
         .osk-key {
             min-width: 32px;
             height: 42px;
@@ -422,21 +439,21 @@
             flex: 1;
             max-width: 50px;
         }
-        
+
         .osk-key:active {
             background: var(--accent);
         }
-        
+
         .osk-key.wide {
             flex: 2;
             max-width: 80px;
         }
-        
+
         .osk-key.extra-wide {
             flex: 3;
             max-width: 120px;
         }
-        
+
         @media (min-width: 768px) {
             .osk-key {
                 min-width: 40px;
@@ -444,13 +461,13 @@
                 font-size: 1rem;
             }
         }
-        
+
         /* Provider Toggle Cards */
         .provider-grid {
             display: grid;
             gap: 12px;
         }
-        
+
         .provider-card {
             display: flex;
             justify-content: space-between;
@@ -460,32 +477,32 @@
             border: 1px solid var(--border);
             border-radius: 12px;
         }
-        
+
         .provider-info h3 {
             font-size: 1rem;
             font-weight: 600;
             margin-bottom: 4px;
         }
-        
+
         .provider-info span {
             font-size: 0.75rem;
             color: var(--text-secondary);
             text-transform: uppercase;
         }
-        
+
         /* Toggle Switch */
         .toggle-switch {
             position: relative;
             width: 52px;
             height: 28px;
         }
-        
+
         .toggle-switch input {
             opacity: 0;
             width: 0;
             height: 0;
         }
-        
+
         .toggle-slider {
             position: absolute;
             cursor: pointer;
@@ -497,7 +514,7 @@
             transition: .3s;
             border-radius: 28px;
         }
-        
+
         .toggle-slider:before {
             position: absolute;
             content: "";
@@ -509,15 +526,15 @@
             transition: .3s;
             border-radius: 50%;
         }
-        
-        input:checked + .toggle-slider {
+
+        input:checked+.toggle-slider {
             background-color: var(--success);
         }
-        
-        input:checked + .toggle-slider:before {
+
+        input:checked+.toggle-slider:before {
             transform: translateX(24px);
         }
-        
+
         /* Tables */
         .table-container {
             overflow-x: auto;
@@ -525,14 +542,14 @@
             margin: 0 -16px;
             padding: 0 16px;
         }
-        
+
         table {
             width: 100%;
             border-collapse: collapse;
             font-size: 0.875rem;
             min-width: 600px;
         }
-        
+
         th {
             text-align: left;
             padding: 12px;
@@ -541,25 +558,25 @@
             border-bottom: 1px solid var(--border);
             white-space: nowrap;
         }
-        
+
         td {
             padding: 12px;
             border-bottom: 1px solid var(--border);
         }
-        
+
         /* Stats Grid */
         .stats-grid {
             display: grid;
             grid-template-columns: repeat(2, 1fr);
             gap: 12px;
         }
-        
+
         @media (min-width: 640px) {
             .stats-grid {
                 grid-template-columns: repeat(4, 1fr);
             }
         }
-        
+
         .stat-card {
             background: var(--bg);
             border: 1px solid var(--border);
@@ -567,40 +584,40 @@
             padding: 16px;
             text-align: center;
         }
-        
+
         .stat-value {
             font-size: 1.75rem;
             font-weight: 700;
             color: var(--text);
             margin-bottom: 4px;
         }
-        
+
         .stat-label {
             font-size: 0.75rem;
             color: var(--text-secondary);
             text-transform: uppercase;
             letter-spacing: 0.5px;
         }
-        
+
         /* Progress Bar */
         .progress-container {
             margin-top: 8px;
         }
-        
+
         .progress-bar {
             height: 6px;
             background: var(--surface-hover);
             border-radius: 3px;
             overflow: hidden;
         }
-        
+
         .progress-fill {
             height: 100%;
             background: var(--success);
             border-radius: 3px;
             transition: width 0.3s ease;
         }
-        
+
         /* Connection Status */
         .connection-status {
             display: flex;
@@ -608,30 +625,37 @@
             gap: 6px;
             font-size: 0.875rem;
         }
-        
+
         .status-dot {
             width: 8px;
             height: 8px;
             border-radius: 50%;
             background: var(--text-secondary);
         }
-        
+
         .status-dot.connected {
             background: var(--success);
             box-shadow: 0 0 8px var(--success);
         }
-        
+
         .status-dot.streaming {
             background: var(--accent);
             box-shadow: 0 0 8px var(--accent);
             animation: pulse 1.5s infinite;
         }
-        
+
         @keyframes pulse {
-            0%, 100% { opacity: 1; }
-            50% { opacity: 0.5; }
+
+            0%,
+            100% {
+                opacity: 1;
+            }
+
+            50% {
+                opacity: 0.5;
+            }
         }
-        
+
         /* Modal for messages */
         .modal-backdrop {
             position: fixed;
@@ -639,18 +663,18 @@
             left: 0;
             right: 0;
             bottom: 0;
-            background: rgba(0,0,0,0.8);
+            background: rgba(0, 0, 0, 0.8);
             display: none;
             align-items: center;
             justify-content: center;
             z-index: 1000;
             padding: 20px;
         }
-        
+
         .modal-backdrop.active {
             display: flex;
         }
-        
+
         .modal-content {
             background: var(--surface);
             border: 1px solid var(--border);
@@ -660,27 +684,28 @@
             width: 100%;
             text-align: center;
         }
-        
+
         /* Scrollbar styling */
         ::-webkit-scrollbar {
             width: 8px;
             height: 8px;
         }
-        
+
         ::-webkit-scrollbar-track {
             background: var(--bg);
         }
-        
+
         ::-webkit-scrollbar-thumb {
             background: var(--border);
             border-radius: 4px;
         }
-        
+
         ::-webkit-scrollbar-thumb:hover {
             background: var(--surface-hover);
         }
     </style>
 </head>
+
 <body>
     <div class="app-container">
         <!-- Header -->
@@ -715,7 +740,9 @@
                         </tr>
                     </thead>
                     <tbody id="keys-list">
-                        <tr><td colspan="5" style="text-align:center;padding:20px;">Loading...</td></tr>
+                        <tr>
+                            <td colspan="5" style="text-align:center;padding:20px;">Loading...</td>
+                        </tr>
                     </tbody>
                 </table>
             </div>
@@ -728,7 +755,8 @@
                 <input type="text" id="lookup-token" class="input-field" placeholder="Enter API key (sk-...)">
                 <button class="btn btn-primary" onclick="lookupToken()">Check</button>
             </div>
-            <div id="lookup-result" style="display:none;margin-top:16px;padding:16px;background:var(--bg);border-radius:10px;">
+            <div id="lookup-result"
+                style="display:none;margin-top:16px;padding:16px;background:var(--bg);border-radius:10px;">
                 <div style="display:flex;justify-content:space-between;margin-bottom:12px;">
                     <span id="lookup-name" style="font-weight:600;">-</span>
                     <span id="lookup-status">-</span>
@@ -758,17 +786,22 @@
                         <span id="browser-status-text">Offline</span>
                     </div>
                 </div>
-                
+
                 <div class="input-group">
                     <select id="portal-provider-select" class="select-field" onchange="onProviderChange()">
                         <option value="">Select Provider...</option>
-                        <option value="copilot">🤖 Copilot</option>
-                        <option value="huggingchat">🤗 HuggingChat</option>
-                        <option value="chatgpt">💬 ChatGPT</option>
-                        <option value="gemini">✨ Gemini</option>
-                        <option value="zai">🌟 Z.ai</option>
+                        <optgroup label="Browser">
+                            <option value="copilot">🤖 Copilot</option>
+                            <option value="huggingchat">🤗 HuggingChat</option>
+                            <option value="chatgpt">💬 ChatGPT</option>
+                            <option value="gemini">✨ Gemini</option>
+                            <option value="zai">🌟 Z.ai</option>
+                        </optgroup>
+                        <optgroup label="Terminal">
+                            <option value="opencode">🖥️ OpenCode (Kimi K2.5 Free)</option>
+                        </optgroup>
                     </select>
-                    <button class="btn btn-primary" id="portal-start-btn" onclick="startBrowser()">Connect</button>
+                    <button class="btn btn-primary" id="portal-start-btn" onclick="startPortal()">Connect</button>
                 </div>
             </div>
 
@@ -779,26 +812,32 @@
                     <button class="browser-nav-btn" onclick="browserGoBack()" title="Back">←</button>
                     <button class="browser-nav-btn" onclick="browserGoForward()" title="Forward">→</button>
                     <button class="browser-nav-btn" onclick="browserRefresh()" title="Refresh">↻</button>
-                    
+
                     <div class="browser-address-bar">
-                        <input type="text" id="browser-address" class="browser-address-input" placeholder="Enter URL..." onkeypress="if(event.key==='Enter')browserNavigate()">
+                        <input type="text" id="browser-address" class="browser-address-input" placeholder="Enter URL..."
+                            onkeypress="if(event.key==='Enter')browserNavigate()">
                         <button class="btn btn-primary btn-icon" onclick="browserNavigate()">Go</button>
                     </div>
-                    
+
                     <div class="quality-selector">
                         <span style="font-size:0.75rem;color:var(--text-secondary);">Quality:</span>
-                        <button class="quality-btn active" onclick="setStreamQuality('low')" id="quality-low">Low</button>
-                        <button class="quality-btn" onclick="setStreamQuality('medium')" id="quality-medium">Med</button>
+                        <button class="quality-btn active" onclick="setStreamQuality('low')"
+                            id="quality-low">Low</button>
+                        <button class="quality-btn" onclick="setStreamQuality('medium')"
+                            id="quality-medium">Med</button>
                         <button class="quality-btn" onclick="setStreamQuality('high')" id="quality-high">High</button>
                     </div>
-                    
+
                     <button class="btn btn-danger btn-icon" onclick="closeBrowser()">✕</button>
                 </div>
 
                 <!-- Video Stream -->
                 <div class="browser-stream-container">
-                    <img id="browser-stream" class="browser-stream" src="" alt="Browser Stream" onclick="handleStreamClick(event)" style="cursor: crosshair;">
-                    
+                    <img id="browser-stream" class="browser-stream" src="" alt="Browser Stream"
+                        onclick="handleStreamClick(event)" style="cursor: crosshair;">
+                    <div id="terminal-view" class="terminal-view"
+                        onclick="document.getElementById('browser-message').focus()"></div>
+
                     <div class="browser-loading" id="browser-loading" style="display:none;">
                         <div class="spinner"></div>
                         <span>Connecting...</span>
@@ -814,7 +853,9 @@
                 <!-- Message Input -->
                 <div style="padding:12px;border-top:1px solid var(--border);">
                     <div class="input-group">
-                        <input type="text" id="browser-message" class="input-field" placeholder="Type message and press Enter..." onkeypress="if(event.key==='Enter')sendMessage()">
+                        <input type="text" id="browser-message" class="input-field"
+                            placeholder="Type message and press Enter..."
+                            onkeypress="if(event.key==='Enter')sendMessage()">
                         <button class="btn btn-success" onclick="sendMessage()">Send</button>
                         <button class="btn btn-secondary" onclick="toggleKeyboard()">⌨️ Keyboard</button>
                     </div>
@@ -883,8 +924,10 @@
             <div style="display:flex;flex-direction:column;gap:10px;">
                 <input type="text" id="proxy-input" class="input-field" placeholder="ip:port or http://ip:port">
                 <div style="display:flex;gap:10px;">
-                    <input type="text" id="proxy-username" class="input-field" placeholder="Username (optional)" style="flex:1;">
-                    <input type="password" id="proxy-password" class="input-field" placeholder="Password (optional)" style="flex:1;">
+                    <input type="text" id="proxy-username" class="input-field" placeholder="Username (optional)"
+                        style="flex:1;">
+                    <input type="password" id="proxy-password" class="input-field" placeholder="Password (optional)"
+                        style="flex:1;">
                 </div>
                 <div style="display:flex;gap:10px;">
                     <button class="btn btn-primary" onclick="setProxy()" style="flex:1;">Set Proxy</button>
@@ -892,7 +935,21 @@
                     <button class="btn btn-success" onclick="testProxy()" style="flex:1;">Test</button>
                 </div>
             </div>
-            <div id="proxy-status" style="margin-top:12px;font-size:0.875rem;color:var(--text-secondary);display:none;"></div>
+            <div id="proxy-status" style="margin-top:12px;font-size:0.875rem;color:var(--text-secondary);display:none;">
+            </div>
+        </div>
+
+        <!-- Saved Proxies/IPs -->
+        <div class="card">
+            <div class="card-header" style="margin-bottom:12px;">
+                <div class="card-title">Saved Proxy IPs</div>
+                <button class="btn btn-primary" onclick="loadSavedProxies()" style="font-size:12px;padding:6px 12px;">🔄
+                    Refresh</button>
+            </div>
+            <div id="saved-proxies-list" style="display:flex;flex-direction:column;gap:8px;">
+                <div style="padding:20px;text-align:center;color:var(--text-secondary);">Click refresh to load saved
+                    proxies</div>
+            </div>
         </div>
     </div>
 
@@ -917,16 +974,16 @@
                 const res = await fetch('/qaz/keys');
                 const keys = await res.json();
                 const tbody = document.getElementById('keys-list');
-                
+
                 if (keys.length === 0) {
                     tbody.innerHTML = '<tr><td colspan="5" style="text-align:center;padding:20px;color:var(--text-secondary);">No keys found</td></tr>';
                     return;
                 }
-                
+
                 tbody.innerHTML = keys.map(key => {
                     const percent = key.limit_tokens > 0 ? Math.round((key.usage_tokens / key.limit_tokens) * 100) : 0;
                     const color = percent > 90 ? 'var(--error)' : percent > 50 ? 'var(--warning)' : 'var(--success)';
-                    
+
                     return `
                         <tr>
                             <td style="font-weight:500;">${key.name}</td>
@@ -954,14 +1011,14 @@
         async function createKey() {
             const name = prompt('Enter name for new API key:');
             if (!name) return;
-            
+
             try {
                 const res = await fetch('/qaz/keys', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ name, limit_tokens: 1000000 })
                 });
-                
+
                 if (res.ok) {
                     const key = await res.json();
                     alert(`✅ Key created!\n\nToken: ${key.token}\n\nSave this now!`);
@@ -986,21 +1043,21 @@
         async function lookupToken() {
             const token = document.getElementById('lookup-token').value.trim();
             if (!token) return;
-            
+
             try {
                 const res = await fetch('/qaz/keys/lookup', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ token })
                 });
-                
+
                 if (!res.ok) throw new Error('Key not found');
-                
+
                 const data = await res.json();
                 const percent = Math.round((data.usage_tokens / data.limit_tokens) * 100);
                 const remaining = data.limit_tokens - data.usage_tokens;
                 const color = percent > 90 ? 'var(--error)' : percent > 50 ? 'var(--warning)' : 'var(--success)';
-                
+
                 document.getElementById('lookup-result').style.display = 'block';
                 document.getElementById('lookup-name').textContent = data.name;
                 document.getElementById('lookup-status').innerHTML = `<span style="color:${data.is_active ? 'var(--success)' : 'var(--error)'}">${data.is_active ? '● Active' : '● Inactive'}</span>`;
@@ -1018,10 +1075,10 @@
             try {
                 const res = await fetch('/qaz/portal/status');
                 const data = await res.json();
-                
+
                 const active = data.providers.filter(p => p.is_running);
                 const container = document.getElementById('active-browsers');
-                
+
                 if (active.length > 0) {
                     container.style.display = 'block';
                     container.innerHTML = `
@@ -1045,30 +1102,23 @@
             currentProvider = document.getElementById('portal-provider-select').value;
         }
 
-        async function startBrowser() {
+        async function startPortal() {
             const provider = document.getElementById('portal-provider-select').value;
             if (!provider) {
                 alert('Select a provider first');
                 return;
             }
-            
+
             const btn = document.getElementById('portal-start-btn');
             btn.disabled = true;
             btn.textContent = 'Connecting...';
-            
+
             try {
-                const res = await fetch('/qaz/portal/start', {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({ provider })
-                });
-                
-                const data = await res.json();
-                if (data.status === 'success' || data.status === 'already_running') {
-                    currentProvider = provider;
-                    showBrowserInterface();
-                    startStream();
-                    checkBrowserStatus();
+                // Check if it's a terminal provider
+                if (provider === 'opencode') {
+                    await startTerminalPortal(provider);
+                } else {
+                    await startBrowserPortal(provider);
                 }
             } catch (e) {
                 alert('Error: ' + e.message);
@@ -1078,25 +1128,117 @@
             }
         }
 
+        async function startBrowserPortal(provider) {
+            const res = await fetch('/qaz/portal/start', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ provider })
+            });
+
+            const data = await res.json();
+            if (data.status === 'success' || data.status === 'already_running') {
+                currentProvider = provider;
+                showBrowserInterface();
+                startStream();
+                checkBrowserStatus();
+            }
+        }
+
+        async function startTerminalPortal(provider) {
+            // provider is 'opencode', but backend expects model name
+            // For now, hardcode to default free model or get from select if we expand logic
+            const model = 'kimi-k2.5-free';
+
+            const res = await fetch('/qaz/terminal/start', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ model })
+            });
+
+            const data = await res.json();
+            if (data.status === 'success' || data.status === 'already_running') {
+                currentProvider = provider;
+                showTerminalInterface();
+                startTerminalStream(model);
+                checkBrowserStatus();
+            }
+        }
+
+        function showTerminalInterface() {
+            document.getElementById('browser-interface').style.display = 'block';
+            document.getElementById('browser-status-dot').classList.add('connected');
+            document.getElementById('browser-status-text').textContent = 'Terminal Active';
+
+            // Hide image stream, show terminal
+            document.getElementById('browser-stream').style.display = 'none';
+            const term = document.getElementById('terminal-view');
+            term.style.display = 'block';
+            term.innerHTML = 'Connecting to OpenCode...';
+
+            // Update controls for terminal
+            document.querySelector('.browser-address-bar').style.visibility = 'hidden';
+            document.querySelector('.quality-selector').style.visibility = 'hidden';
+            document.getElementById('browser-page-title').textContent = 'OpenCode Terminal';
+            document.getElementById('browser-coords').textContent = 'Type commands below';
+        }
+
+        function startTerminalStream(model) {
+            if (streamInterval) clearInterval(streamInterval);
+
+            const term = document.getElementById('terminal-view');
+
+            streamInterval = setInterval(async () => {
+                if (!currentProvider) return;
+
+                try {
+                    const res = await fetch(`/qaz/terminal/output?model=${model}&lines=50`);
+                    const data = await res.json();
+
+                    if (data.status === 'running') {
+                        // Clear and rebuild terminal output
+                        // In a real app we might append, but simplistic polling replaces for now
+                        // or better: keep local buffer
+                        const text = data.lines.map(l => l.content).join('');
+                        term.textContent = text;
+                        term.scrollTop = term.scrollHeight; // Auto-scroll
+
+                        document.getElementById('browser-status-dot').classList.add('streaming');
+                    } else if (data.status === 'stopped') {
+                        term.textContent += '\n[Process stopped]';
+                        clearInterval(streamInterval);
+                    }
+                } catch (e) {
+                    console.error('Terminal poll error:', e);
+                }
+            }, 1000);
+        }
+
         function showBrowserInterface() {
             document.getElementById('browser-interface').style.display = 'block';
+
+            // Reset to browser mode
+            document.getElementById('browser-stream').style.display = 'block';
+            document.getElementById('terminal-view').style.display = 'none';
+            document.querySelector('.browser-address-bar').style.visibility = 'visible';
+            document.querySelector('.quality-selector').style.visibility = 'visible';
+
             document.getElementById('browser-status-dot').classList.add('connected');
             document.getElementById('browser-status-text').textContent = 'Connected';
         }
 
         function startStream() {
             if (streamInterval) clearInterval(streamInterval);
-            
+
             const img = document.getElementById('browser-stream');
             const quality = streamQuality === 'low' ? 0.5 : streamQuality === 'medium' ? 0.75 : 1;
             let frameCount = 0;
-            
+
             // Preload image to prevent flickering
             const updateFrame = () => {
                 if (!currentProvider) return;
-                
+
                 const newSrc = `/qaz/portal/${currentProvider}/screenshot?t=${Date.now()}&quality=${quality}&frame=${frameCount++}`;
-                
+
                 // Create a new image to preload
                 const preloadImg = new Image();
                 preloadImg.onload = () => {
@@ -1108,11 +1250,11 @@
                 };
                 preloadImg.src = newSrc;
             };
-            
+
             // Update every 1000ms (1 second) for better performance
             streamInterval = setInterval(updateFrame, 1000);
             updateFrame();
-            
+
             document.getElementById('browser-status-dot').classList.add('streaming');
             console.log('Stream started for provider:', currentProvider);
         }
@@ -1121,7 +1263,7 @@
             streamQuality = quality;
             document.querySelectorAll('.quality-btn').forEach(btn => btn.classList.remove('active'));
             document.getElementById(`quality-${quality}`).classList.add('active');
-            
+
             // Restart stream with new quality
             if (currentProvider) {
                 startStream();
@@ -1148,9 +1290,9 @@
             if (!currentProvider) return;
             let url = document.getElementById('browser-address').value.trim();
             if (!url) return;
-            
+
             if (!url.startsWith('http')) url = 'https://' + url;
-            
+
             await fetch(`/qaz/portal/${currentProvider}/navigate`, {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
@@ -1163,16 +1305,16 @@
                 console.log('No provider selected');
                 return;
             }
-            
+
             const rect = event.target.getBoundingClientRect();
             const scaleX = 1280 / rect.width;
             const scaleY = 800 / rect.height;
             const x = Math.round((event.clientX - rect.left) * scaleX);
             const y = Math.round((event.clientY - rect.top) * scaleY);
-            
+
             console.log(`Click at ${x}, ${y} on ${currentProvider}`);
             document.getElementById('browser-coords').textContent = `Click: ${x}, ${y}`;
-            
+
             // Visual feedback
             const img = event.target;
             const feedback = document.createElement('div');
@@ -1191,7 +1333,7 @@
             `;
             img.parentElement.appendChild(feedback);
             setTimeout(() => feedback.remove(), 500);
-            
+
             // Send click to backend
             fetch('/qaz/portal/action', {
                 method: 'POST',
@@ -1215,16 +1357,28 @@
 
         async function sendMessage() {
             if (!currentProvider) return;
-            const msg = document.getElementById('browser-message').value.trim();
-            if (!msg) return;
-            
-            await fetch(`/qaz/portal/${currentProvider}/send`, {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ message: msg })
-            });
-            
-            document.getElementById('browser-message').value = '';
+            const msgInput = document.getElementById('browser-message');
+            const msg = msgInput.value; // Allow empty lines or spaces
+            // if (!msg) return; // Allow sending enter
+
+            if (currentProvider === 'opencode') {
+                // Send to terminal
+                await fetch('/qaz/terminal/input', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ text: msg })
+                });
+            } else {
+                // Send to browser portal
+                if (!msg.trim()) return;
+                await fetch(`/qaz/portal/${currentProvider}/send`, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ message: msg })
+                });
+            }
+
+            msgInput.value = '';
         }
 
         function toggleKeyboard() {
@@ -1235,7 +1389,7 @@
         // On-Screen Keyboard
         function oskType(char) {
             if (char === '123') return; // Switch to numbers (not implemented yet)
-            
+
             const input = document.getElementById('browser-message');
             if (oskShift && char.length === 1 && char.match(/[a-z]/i)) {
                 char = char.toUpperCase();
@@ -1263,50 +1417,58 @@
         async function closeBrowser() {
             if (!currentProvider) return;
             if (!confirm('Close browser?')) return;
-            
-            await fetch(`/qaz/portal/${currentProvider}/close`, { method: 'POST' });
-            
+
+            if (currentProvider === 'opencode') {
+                await fetch('/qaz/terminal/close', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ model: 'kimi-k2.5-free' })
+                });
+            } else {
+                await fetch(`/qaz/portal/${currentProvider}/close`, { method: 'POST' });
+            }
+
             if (streamInterval) {
                 clearInterval(streamInterval);
                 streamInterval = null;
             }
-            
+
             document.getElementById('browser-interface').style.display = 'none';
             document.getElementById('browser-status-dot').classList.remove('connected', 'streaming');
             document.getElementById('browser-status-text').textContent = 'Offline';
             document.getElementById('osk').style.display = 'none';
             currentProvider = null;
-            
+
             checkBrowserStatus();
         }
 
         // Provider Toggles
         async function loadProviders() {
             const container = document.getElementById('providers-list');
-            
+
             try {
                 console.log('Loading providers...');
                 const res = await fetch('/qaz/providers');
-                
+
                 if (!res.ok) {
                     const errorText = await res.text();
                     throw new Error(`HTTP ${res.status}: ${errorText}`);
                 }
-                
+
                 const data = await res.json();
                 console.log('Providers loaded:', data);
-                
+
                 if (!data.providers || data.providers.length === 0) {
                     container.innerHTML = '<div style="padding:20px;text-align:center;color:var(--text-secondary);">No providers configured. Please initialize the database.</div>';
                     return;
                 }
-                
+
                 // Sort providers: enabled first, then by name
                 const sortedProviders = data.providers.sort((a, b) => {
                     if (a.enabled !== b.enabled) return b.enabled - a.enabled;
                     return a.name.localeCompare(b.name);
                 });
-                
+
                 container.innerHTML = sortedProviders.map(p => `
                     <div class="provider-card" style="background:${p.enabled ? 'var(--surface)' : 'var(--bg)'};border-left:4px solid ${p.enabled ? 'var(--success)' : 'var(--border)'};">
                         <div class="provider-info">
@@ -1331,7 +1493,7 @@
                 event.preventDefault();
                 event.stopPropagation();
             }
-            
+
             try {
                 console.log(`Toggling provider ${id} to ${enabled}`);
                 const res = await fetch('/qaz/providers/toggle', {
@@ -1339,18 +1501,18 @@
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ provider_id: id, enabled })
                 });
-                
+
                 if (!res.ok) {
                     const error = await res.json();
                     throw new Error(error.detail || 'Failed to toggle');
                 }
-                
+
                 const data = await res.json();
                 console.log('Toggle success:', data);
-                
+
                 // Show success feedback
                 showProxyStatus(`Provider ${enabled ? 'enabled' : 'disabled'}`);
-                
+
             } catch (e) {
                 console.error('Toggle error:', e);
                 alert('Error: ' + e.message);
@@ -1366,17 +1528,17 @@
                 alert('Please enter a proxy address');
                 return;
             }
-            
+
             const username = document.getElementById('proxy-username').value.trim() || null;
             const password = document.getElementById('proxy-password').value || null;
-            
+
             try {
                 const res = await fetch('/qaz/proxy/set', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ proxy, username, password })
                 });
-                
+
                 const data = await res.json();
                 if (data.status === 'success') {
                     showProxyStatus(`✅ Proxy set: ${data.proxy}${data.has_auth ? ' (with auth)' : ''}`);
@@ -1402,7 +1564,7 @@
                 showProxyStatus('🧪 Testing proxy...');
                 const res = await fetch('/qaz/proxy/test', { method: 'POST' });
                 const data = await res.json();
-                
+
                 if (data.is_working) {
                     showProxyStatus(`✅ Proxy working! Response time: ${data.response_time}`);
                 } else {
@@ -1424,7 +1586,7 @@
             try {
                 const res = await fetch('/qaz/proxy/status');
                 const data = await res.json();
-                
+
                 if (data.enabled) {
                     document.getElementById('proxy-input').value = data.proxy;
                     if (data.username) {
@@ -1437,12 +1599,76 @@
             }
         }
 
+        // Saved Proxies Management
+        async function loadSavedProxies() {
+            const container = document.getElementById('saved-proxies-list');
+            container.innerHTML = '<div style="padding:20px;text-align:center;"><div class="spinner" style="width:30px;height:30px;"></div><p>Loading proxies...</p></div>';
+
+            try {
+                const res = await fetch('/qaz/proxies');
+                if (!res.ok) throw new Error('Failed to load proxies');
+
+                const data = await res.json();
+
+                if (!data.proxies || data.proxies.length === 0) {
+                    container.innerHTML = '<div style="padding:20px;text-align:center;color:var(--text-secondary);">No saved proxies yet. Add one above.</div>';
+                    return;
+                }
+
+                container.innerHTML = data.proxies.map(p => `
+                    <div class="provider-card" style="border-left:4px solid ${p.is_active ? 'var(--success)' : 'var(--border)'};padding:12px;">
+                        <div style="flex:1;">
+                            <div style="font-weight:600;">${p.name || p.ip + ':' + p.port}</div>
+                            <div style="font-size:0.75rem;color:var(--text-secondary);">
+                                ${p.protocol}://${p.ip}:${p.port} ${p.country ? '• ' + p.country : ''}
+                                ${p.is_working === true ? '• ✅ Working' : p.is_working === false ? '• ❌ Failed' : ''}
+                            </div>
+                        </div>
+                        <div style="display:flex;gap:8px;">
+                            <button class="btn ${p.is_active ? 'btn-success' : 'btn-secondary'}" onclick="activateProxy(${p.id})" style="padding:6px 12px;font-size:12px;">
+                                ${p.is_active ? 'Active' : 'Activate'}
+                            </button>
+                            <button class="btn btn-danger" onclick="deleteProxy(${p.id})" style="padding:6px 12px;font-size:12px;">
+                                🗑️
+                            </button>
+                        </div>
+                    </div>
+                `).join('');
+            } catch (e) {
+                container.innerHTML = `<div style="padding:20px;text-align:center;color:var(--error);">Error: ${e.message}</div>`;
+            }
+        }
+
+        async function activateProxy(id) {
+            try {
+                const res = await fetch(`/qaz/proxies/${id}/activate`, { method: 'POST' });
+                if (!res.ok) throw new Error('Failed to activate');
+                loadSavedProxies();
+                showProxyStatus('✅ Proxy activated');
+            } catch (e) {
+                alert('Error: ' + e.message);
+            }
+        }
+
+        async function deleteProxy(id) {
+            if (!confirm('Delete this proxy?')) return;
+
+            try {
+                const res = await fetch(`/qaz/proxies/${id}`, { method: 'DELETE' });
+                if (!res.ok) throw new Error('Failed to delete');
+                loadSavedProxies();
+                showProxyStatus('🗑️ Proxy deleted');
+            } catch (e) {
+                alert('Error: ' + e.message);
+            }
+        }
+
         // Admin Actions
         async function testAllAI() {
             const btn = event.target;
             btn.disabled = true;
             btn.textContent = 'Testing...';
-            
+
             try {
                 const res = await fetch('/qaz/test_all', { method: 'POST' });
                 const results = await res.json();
@@ -1458,7 +1684,7 @@
 
         async function clearStats() {
             if (!confirm('Clear all statistics?')) return;
-            
+
             try {
                 await fetch('/qaz/clear_stats', { method: 'POST' });
                 alert('Statistics cleared');
@@ -1476,4 +1702,5 @@
         }
     </script>
 </body>
-</html>
+
+</html>