Clean up all legacy OmniRoute and OpenCode references across configuration, gateway, reverse proxy, index landing, and mobile app directory

README.md

@@ -8,14 +8,12 @@ app_port: 4096
 pinned: false
 ---
 
-# Opencode CLI Server
+# Multi-Service Container Hub
 
-This Hugging Face Space hosts the backend `opencode serve` API server on port 4096.
+This Hugging Face Space hosts a multi-service container hub on port 4096.
 
-## Connection Setup for Mobile App
+## Services
 
-To connect your OpenCode mobile client to this server:
-1. Open the mobile app and go to **Settings**.
-2. Under **Server URL**, enter the Space's direct domain:
-   `https://jishnupg-opencode-cli.hf.space` (or your corresponding Space URL)
-3. Set your **Auth Type** and credentials if you configured `OPENCODE_SERVER_USERNAME`/`OPENCODE_SERVER_PASSWORD` secrets.
+1. **Open WebUI** (`/`): Feature-rich AI chat interface.
+2. **Jellyfin Media Server** (`/jellyfin/`): Media streaming server.
+3. **Telegram Stream Proxy** (`/tg-stream/`): High-speed MTProto video range streamer for Telegram Drive.

entrypoint.sh

@@ -10,20 +10,9 @@ git config --global --add safe.directory '*' 2>/dev/null || true
 
 # /data is the persistent HF dataset bucket mount
 echo "[INIT] Setting up /data directories..."
-mkdir -p /data/share/opencode 2>/dev/null || echo "[WARN] Could not create /data/share/opencode"
-mkdir -p /data/config/opencode 2>/dev/null || echo "[WARN] Could not create /data/config/opencode"
-mkdir -p /data/cache/opencode 2>/dev/null || echo "[WARN] Could not create /data/cache/opencode"
-mkdir -p /data/state/opencode 2>/dev/null || echo "[WARN] Could not create /data/state/opencode"
 mkdir -p /data/open-webui 2>/dev/null || echo "[WARN] Could not create /data/open-webui"
-mkdir -p /data/omniroute 2>/dev/null || echo "[WARN] Could not create /data/omniroute"
 mkdir -p /data/jellyfin/data /data/jellyfin/config /data/jellyfin/cache /data/jellyfin/log /data/jellyfin/media/Movies /data/jellyfin/media/TVShows 2>/dev/null || true
 
-# Symlink OmniRoute data directory to /data/omniroute for 100% persistence
-if [ ! -L "/root/.omniroute" ]; then
-    rm -rf /root/.omniroute 2>/dev/null || true
-    ln -sf /data/omniroute /root/.omniroute
-fi
-
 # Start Telegram Direct Range Stream Proxy in background
 echo "[INIT] Starting Telegram Direct Stream Proxy on port 8080..."
 python3 /tg_streamer.py &
@@ -54,16 +43,15 @@ chmod -R 777 /root/.cache /data/cache 2>/dev/null || true
 sleep 2
 
 # Pre-configure & Start Open WebUI on port 8098 (Mounted at / via FastAPI proxy)
-echo "[INIT] Starting Open WebUI on port 8098 pre-configured with OmniRoute..."
+echo "[INIT] Starting Open WebUI on port 8098..."
 if command -v open-webui >/dev/null 2>&1; then
-    # Tell Open WebUI its public-facing URL (required to avoid "Backend Required" error)
-    export WEBUI_URL="https://jishnupg-opencode-cli.hf.space"
-    export OPENAI_API_BASE_URL="http://127.0.0.1:20128/v1"
-    export OPENAI_API_KEY="omniroute"
+    # Tell Open WebUI its public-facing URL
+    export WEBUI_URL="${WEBUI_URL:-https://jishnupg-opencode-cli.hf.space}"
+    export OPENAI_API_BASE_URL="${OPENAI_API_BASE_URL:-https://api.openai.com/v1}"
+    export OPENAI_API_KEY="${OPENAI_API_KEY:-}"
     export WEBUI_SECRET_KEY="${WEBUI_SECRET_KEY:-opencode_webui_jwt_secret_2026}"
-    export ENABLE_OLLAMA_API="false"
-    export ENABLE_OPENAI_API="true"
-    # Ensure OmniRoute is NOT registered as an OpenAPI tool server (fixes 500 ContentTypeError crash)
+    export ENABLE_OLLAMA_API="${ENABLE_OLLAMA_API:-false}"
+    export ENABLE_OPENAI_API="${ENABLE_OPENAI_API:-true}"
     export TOOL_SERVERS=""
     export OPENAPI_TOOL_SERVERS=""
     export PORT=8098
@@ -73,7 +61,7 @@ if command -v open-webui >/dev/null 2>&1; then
         rm -rf /root/.open-webui 2>/dev/null || true
         ln -sf /data/open-webui /root/.open-webui
     fi
-    # Sanitize any stale OpenAPI tool server entries in webui.db
+    # Sanitize any stale tool server entries in webui.db
     python3 -c "
 import sqlite3, os
 db_p = '/data/open-webui/webui.db'
@@ -104,10 +92,6 @@ fi
 echo "[DISK] /data usage:"
 df -h /data 2>/dev/null || echo "[WARN] Could not check /data disk space"
 
-# Remove stale SQLite WAL/lock files to prevent "database is locked" on startup
-rm -f /data/omniroute/*.sqlite-wal /data/omniroute/*.sqlite-shm /data/omniroute/*.lock 2>/dev/null || true
-rm -f /root/.omniroute/*.sqlite-wal /root/.omniroute/*.sqlite-shm /root/.omniroute/*.lock 2>/dev/null || true
-
 echo "============================================"
 echo "=== Launching FastAPI Gateway Proxy on Port 4096 ==="
 echo "============================================"

gateway/utils.py

@@ -20,8 +20,6 @@ logger = logging.getLogger("GatewayUtils")
 
 # Port definitions
 WEBUI_PORT     = int(os.environ.get("WEBUI_PORT", 8098))
-OMNIROUTE_PORT = int(os.environ.get("OMNIROUTE_PORT", 20128))
-OPENCODE_PORT  = int(os.environ.get("OPENCODE_PORT", 4097))
 JELLYFIN_PORT  = int(os.environ.get("JELLYFIN_PORT", 8096))
 TG_PORT        = int(os.environ.get("TG_PORT", 8080))
 GATEWAY_PORT   = int(os.environ.get("PORT", 4096))
@@ -29,16 +27,14 @@ GATEWAY_PORT   = int(os.environ.get("PORT", 4096))
 PUBLIC_HOST   = os.environ.get("PUBLIC_HOST", "jishnupg-opencode-cli.hf.space")
 PUBLIC_ORIGIN = f"https://{PUBLIC_HOST}"
 
-_INTERNAL_PORTS = {GATEWAY_PORT, WEBUI_PORT, OMNIROUTE_PORT, OPENCODE_PORT, JELLYFIN_PORT, TG_PORT}
+_INTERNAL_PORTS = {GATEWAY_PORT, WEBUI_PORT, JELLYFIN_PORT, TG_PORT}
 _PORT_STRIP_RE  = re.compile(r"(https?://[^/:]+):(" + "|".join(str(p) for p in _INTERNAL_PORTS) + r")")
 
 _PORT_PREFIX_MAP = {
-    GATEWAY_PORT:   "",
-    OMNIROUTE_PORT: "/omniroute",
-    WEBUI_PORT:     "/openwebui",
-    OPENCODE_PORT:  "/server",
-    JELLYFIN_PORT:  "/jellyfin",
-    TG_PORT:        "/tg-stream",
+    GATEWAY_PORT:  "",
+    WEBUI_PORT:    "/openwebui",
+    JELLYFIN_PORT: "/jellyfin",
+    TG_PORT:       "/tg-stream",
 }
 
 # Shared Async HTTPX Client Instance

index.html

@@ -150,62 +150,47 @@
 
         <div class="grid">
             <!-- Open WebUI Card -->
-            <a href="/openwebui/" class="card">
+            <a href="/" class="card">
                 <div>
                     <div class="card-header">
                         <span class="icon">🤖</span>
                         <span class="badge">Online</span>
                     </div>
                     <h2>Open WebUI</h2>
-                    <p>Feature-rich AI chat interface connected to OmniRoute models.</p>
+                    <p>Feature-rich AI chat interface connected to AI model endpoints.</p>
                 </div>
                 <div class="card-footer">
                     Launch Open WebUI &rarr;
                 </div>
             </a>
 
-            <!-- OmniRoute Card -->
-            <a href="/omniroute/" class="card">
-                <div>
-                    <div class="card-header">
-                        <span class="icon">⚡</span>
-                        <span class="badge">Online</span>
-                    </div>
-                    <h2>OmniRoute AI Gateway</h2>
-                    <p>AI model router dashboard and multi-provider management.</p>
-                </div>
-                <div class="card-footer">
-                    Launch OmniRoute &rarr;
-                </div>
-            </a>
-
-            <!-- OpenCode Server Card -->
-            <a href="/server/" class="card">
+            <!-- Jellyfin Card -->
+            <a href="/jellyfin/" class="card">
                 <div>
                     <div class="card-header">
-                        <span class="icon">💻</span>
+                        <span class="icon">🎬</span>
                         <span class="badge">Online</span>
                     </div>
-                    <h2>OpenCode Server</h2>
-                    <p>Backend API server for OpenCode mobile client and remote CLI.</p>
+                    <h2>Jellyfin Media Server</h2>
+                    <p>Stream movies, TV shows, and Telegram Drive media files.</p>
                 </div>
                 <div class="card-footer">
-                    Launch Server API &rarr;
+                    Launch Jellyfin &rarr;
                 </div>
             </a>
 
-            <!-- Jellyfin Card -->
-            <a href="/jellyfin/" class="card">
+            <!-- TG Streamer Card -->
+            <a href="/tg-stream/health" class="card">
                 <div>
                     <div class="card-header">
-                        <span class="icon">🎬</span>
+                        <span class="icon">📡</span>
                         <span class="badge">Online</span>
                     </div>
-                    <h2>Jellyfin Media Server</h2>
-                    <p>Stream movies, TV shows, and Telegram Drive media files.</p>
+                    <h2>Telegram Streamer</h2>
+                    <p>High-speed MTProto 5G range streaming proxy for Telegram Drive.</p>
                 </div>
                 <div class="card-footer">
-                    Launch Jellyfin &rarr;
+                    Check Status &rarr;
                 </div>
             </a>
         </div>

mobile/app.json

@@ -1,22 +0,0 @@
-{
-  "expo": {
-    "name": "OpenCode Mobile",
-    "slug": "opencode-mobile",
-    "version": "1.0.0",
-    "orientation": "portrait",
-    "scheme": "opencode",
-    "platforms": ["android"],
-    "android": {
-      "package": "com.opencode.mobile",
-      "adaptiveIcon": {
-        "backgroundColor": "#1a1b26"
-      }
-    },
-    "plugins": [
-      "expo-asset",
-      "expo-font",
-      "expo-router",
-      "expo-secure-store"
-    ]
-  }
-}

mobile/app/(tabs)/_layout.tsx

@@ -1,69 +0,0 @@
-import { Tabs } from "expo-router";
-import { Home, MessageSquare, FolderOpen, Search, Terminal } from "lucide-react-native";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function TabLayout() {
-  const theme = themes[getTheme()];
-
-  const icons = {
-    index: Home,
-    sessions: MessageSquare,
-    files: FolderOpen,
-    search: Search,
-    terminal: Terminal,
-  };
-
-  return (
-    <Tabs
-      screenOptions={{
-        headerShown: false,
-        tabBarStyle: {
-          backgroundColor: theme.colors.bgSecondary,
-          borderTopColor: theme.colors.border,
-          height: 60,
-          paddingBottom: 8,
-          paddingTop: 8,
-        },
-        tabBarActiveTintColor: theme.colors.primary,
-        tabBarInactiveTintColor: theme.colors.textMuted,
-      }}
-    >
-      <Tabs.Screen
-        name="index"
-        options={{
-          title: "Home",
-          tabBarIcon: ({ color, size }) => <icons.index size={size} color={color} />,
-        }}
-      />
-      <Tabs.Screen
-        name="sessions"
-        options={{
-          title: "Sessions",
-          tabBarIcon: ({ color, size }) => <icons.sessions size={size} color={color} />,
-        }}
-      />
-      <Tabs.Screen
-        name="files"
-        options={{
-          title: "Files",
-          tabBarIcon: ({ color, size }) => <icons.files size={size} color={color} />,
-        }}
-      />
-      <Tabs.Screen
-        name="search"
-        options={{
-          title: "Search",
-          tabBarIcon: ({ color, size }) => <icons.search size={size} color={color} />,
-        }}
-      />
-      <Tabs.Screen
-        name="terminal"
-        options={{
-          title: "Terminal",
-          tabBarIcon: ({ color, size }) => <icons.terminal size={size} color={color} />,
-        }}
-      />
-    </Tabs>
-  );
-}

mobile/app/(tabs)/files.tsx

@@ -1,153 +0,0 @@
-import { View, Text, TextInput, TouchableOpacity, FlatList, StyleSheet } from "react-native";
-import { useState } from "react";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { Search, ChevronRight, Folder, File, ArrowLeft } from "lucide-react-native";
-import { useListFiles } from "../../hooks/useApi";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function FilesScreen() {
-  const insets = useSafeAreaInsets();
-  const theme = themes[getTheme()];
-  const [currentDir, setCurrentDir] = useState(".");
-  const [search, setSearch] = useState("");
-  const { data: files, isLoading } = useListFiles(currentDir);
-
-  const filtered = (files || []).filter(
-    (f) => !search || f.name.toLowerCase().includes(search.toLowerCase())
-  );
-
-  const dirs = currentDir === "." ? [] : currentDir.split("/");
-  const goBack = () => {
-    if (dirs.length <= 1) {
-      setCurrentDir(".");
-    } else {
-      setCurrentDir(dirs.slice(0, -1).join("/"));
-    }
-  };
-
-  return (
-    <View style={[styles.container, { backgroundColor: theme.colors.bg }]}>
-      <View style={[styles.header, { paddingTop: insets.top + 12 }]}>
-        {currentDir !== "." && (
-          <TouchableOpacity onPress={goBack} style={styles.backBtn}>
-            <ArrowLeft size={20} color={theme.colors.text} />
-          </TouchableOpacity>
-        )}
-        <Text style={[styles.title, { color: theme.colors.text }]} numberOfLines={1}>
-          {currentDir === "." ? "Files" : dirs[dirs.length - 1]}
-        </Text>
-      </View>
-
-      <View style={styles.breadcrumb}>
-        {dirs.map((d, i) => (
-          <TouchableOpacity
-            key={i}
-            onPress={() => setCurrentDir(dirs.slice(0, i + 1).join("/"))}
-            style={styles.breadcrumbItem}
-          >
-            <Text style={[styles.breadcrumbText, { color: theme.colors.primary }]}>{d}</Text>
-            <ChevronRight size={12} color={theme.colors.textMuted} />
-          </TouchableOpacity>
-        ))}
-        {dirs.length === 0 && (
-          <Text style={[styles.breadcrumbText, { color: theme.colors.textMuted }]}>root</Text>
-        )}
-      </View>
-
-      <View style={[styles.searchBar, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-        <Search size={16} color={theme.colors.textMuted} />
-        <TextInput
-          style={[styles.searchInput, { color: theme.colors.text }]}
-          placeholder="Filter files..."
-          placeholderTextColor={theme.colors.textMuted}
-          value={search}
-          onChangeText={setSearch}
-        />
-      </View>
-
-      <FlatList
-        data={filtered}
-        keyExtractor={(item) => item.path}
-        contentContainerStyle={{ paddingBottom: insets.bottom + 100, paddingHorizontal: 20 }}
-        showsVerticalScrollIndicator={false}
-        ListEmptyComponent={
-          <View style={styles.empty}>
-            <Folder size={40} color={theme.colors.textMuted} />
-            <Text style={[styles.emptyText, { color: theme.colors.textMuted }]}>
-              {isLoading ? "Loading..." : "Empty"}
-            </Text>
-          </View>
-        }
-        renderItem={({ item }) => (
-          <TouchableOpacity
-            style={[styles.fileItem, { backgroundColor: theme.colors.surface }]}
-            onPress={() => {
-              if (item.type === "directory") {
-                setCurrentDir(item.path);
-              }
-            }}
-          >
-            {item.type === "directory" ? (
-              <Folder size={18} color={theme.colors.warning} />
-            ) : (
-              <File size={18} color={theme.colors.textMuted} />
-            )}
-            <Text style={[styles.fileName, { color: theme.colors.text }]} numberOfLines={1}>
-              {item.name}
-            </Text>
-            {item.type === "directory" && (
-              <ChevronRight size={16} color={theme.colors.textMuted} />
-            )}
-          </TouchableOpacity>
-        )}
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    paddingHorizontal: 20,
-    paddingBottom: 12,
-  },
-  backBtn: { padding: 4 },
-  title: { fontSize: 28, fontWeight: "700", letterSpacing: -0.5, flex: 1 },
-  breadcrumb: {
-    flexDirection: "row",
-    alignItems: "center",
-    flexWrap: "wrap",
-    paddingHorizontal: 20,
-    marginBottom: 12,
-    gap: 4,
-  },
-  breadcrumbItem: { flexDirection: "row", alignItems: "center", gap: 4 },
-  breadcrumbText: { fontSize: 13 },
-  searchBar: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    marginHorizontal: 20,
-    marginBottom: 16,
-    paddingHorizontal: 14,
-    paddingVertical: 10,
-    borderRadius: 10,
-    borderWidth: 1,
-  },
-  searchInput: { flex: 1, fontSize: 14, padding: 0 },
-  fileItem: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    padding: 12,
-    borderRadius: 10,
-    marginBottom: 4,
-  },
-  fileName: { flex: 1, fontSize: 14 },
-  empty: { alignItems: "center", marginTop: 80, gap: 12 },
-  emptyText: { fontSize: 14 },
-});

mobile/app/(tabs)/index.tsx

@@ -1,140 +0,0 @@
-import { View, Text, TouchableOpacity, ScrollView, StyleSheet } from "react-native";
-import { useRouter } from "expo-router";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { Plus, Wifi, WifiOff, Settings } from "lucide-react-native";
-import { useSessions, useCreateSession } from "../../hooks/useApi";
-import { useConnection } from "../../hooks/useConnection";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function HomeScreen() {
-  const router = useRouter();
-  const insets = useSafeAreaInsets();
-  const theme = themes[getTheme()];
-  const { isConnected, state: connState } = useConnection();
-  const { data: sessions } = useSessions();
-  const createSession = useCreateSession();
-
-  const handleNewSession = async () => {
-    try {
-      const session = await createSession.mutateAsync({ title: "New Chat", directory: "default" });
-      router.push(`/session/${session.id}`);
-    } catch {}
-  };
-
-  const recentSessions = (sessions || []).slice(0, 5);
-
-  return (
-    <View style={[styles.container, { backgroundColor: theme.colors.bg }]}>
-      <View style={[styles.header, { paddingTop: insets.top + 12 }]}>
-        <Text style={[styles.title, { color: theme.colors.text }]}>OpenCode</Text>
-        <TouchableOpacity onPress={() => router.push("/settings")}>
-          <Settings size={22} color={theme.colors.textMuted} />
-        </TouchableOpacity>
-      </View>
-
-      <ScrollView
-        style={styles.scroll}
-        contentContainerStyle={{ paddingBottom: insets.bottom + 100 }}
-        showsVerticalScrollIndicator={false}
-      >
-        <View
-          style={[
-            styles.statusCard,
-            {
-              backgroundColor: isConnected ? theme.colors.bgTertiary : theme.colors.surface,
-              borderColor: isConnected ? theme.colors.success : theme.colors.danger,
-            },
-          ]}
-        >
-          {isConnected ? (
-            <Wifi size={18} color={theme.colors.success} />
-          ) : (
-            <WifiOff size={18} color={theme.colors.danger} />
-          )}
-          <Text style={[styles.statusText, { color: theme.colors.text }]}>
-            {isConnected ? "Connected" : connState === "reconnecting" ? "Reconnecting..." : "Disconnected"}
-          </Text>
-        </View>
-
-        <TouchableOpacity
-          style={[styles.newSessionBtn, { backgroundColor: theme.colors.primary }]}
-          onPress={handleNewSession}
-          activeOpacity={0.8}
-        >
-          <Plus size={20} color={theme.colors.primaryText} />
-          <Text style={[styles.newSessionText, { color: theme.colors.primaryText }]}>
-            New Session
-          </Text>
-        </TouchableOpacity>
-
-        {recentSessions.length > 0 && (
-          <View style={styles.section}>
-            <Text style={[styles.sectionTitle, { color: theme.colors.textSecondary }]}>
-              Recent Sessions
-            </Text>
-            {recentSessions.map((s) => (
-              <TouchableOpacity
-                key={s.id}
-                style={[styles.sessionItem, { backgroundColor: theme.colors.surface }]}
-                onPress={() => router.push(`/session/${s.id}`)}
-              >
-                <Text style={[styles.sessionTitle, { color: theme.colors.text }]} numberOfLines={1}>
-                  {s.title || "Untitled"}
-                </Text>
-                <Text style={[styles.sessionTime, { color: theme.colors.textMuted }]}>
-                  {new Date(s.updatedAt).toLocaleDateString()}
-                </Text>
-              </TouchableOpacity>
-            ))}
-          </View>
-        )}
-      </ScrollView>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    paddingHorizontal: 20,
-    paddingBottom: 12,
-  },
-  title: { fontSize: 28, fontWeight: "700", letterSpacing: -0.5 },
-  scroll: { flex: 1, paddingHorizontal: 20 },
-  statusCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    padding: 14,
-    borderRadius: 12,
-    marginBottom: 20,
-    borderWidth: 1,
-  },
-  statusText: { fontSize: 14, fontWeight: "500" },
-  newSessionBtn: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 8,
-    padding: 16,
-    borderRadius: 14,
-    marginBottom: 28,
-  },
-  newSessionText: { fontSize: 16, fontWeight: "600" },
-  section: { marginBottom: 24 },
-  sectionTitle: { fontSize: 13, fontWeight: "600", textTransform: "uppercase", letterSpacing: 0.5, marginBottom: 10 },
-  sessionItem: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    padding: 14,
-    borderRadius: 10,
-    marginBottom: 6,
-  },
-  sessionTitle: { fontSize: 15, fontWeight: "500", flex: 1, marginRight: 10 },
-  sessionTime: { fontSize: 12 },
-});

mobile/app/(tabs)/search.tsx

@@ -1,105 +0,0 @@
-import { View, Text, TextInput, FlatList, StyleSheet } from "react-native";
-import { useState } from "react";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { Search as SearchIcon } from "lucide-react-native";
-import { useFindFiles } from "../../hooks/useApi";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function SearchScreen() {
-  const insets = useSafeAreaInsets();
-  const theme = themes[getTheme()];
-  const [query, setQuery] = useState("");
-  const { data: results, isLoading } = useFindFiles(query);
-
-  return (
-    <View style={[styles.container, { backgroundColor: theme.colors.bg }]}>
-      <View style={[styles.header, { paddingTop: insets.top + 12 }]}>
-        <Text style={[styles.title, { color: theme.colors.text }]}>Search</Text>
-      </View>
-
-      <View style={[styles.searchBar, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-        <SearchIcon size={16} color={theme.colors.textMuted} />
-        <TextInput
-          style={[styles.searchInput, { color: theme.colors.text }]}
-          placeholder="Search files, code, text..."
-          placeholderTextColor={theme.colors.textMuted}
-          value={query}
-          onChangeText={setQuery}
-          autoFocus
-        />
-      </View>
-
-      <FlatList
-        data={results || []}
-        keyExtractor={(_, i) => String(i)}
-        contentContainerStyle={{ paddingBottom: insets.bottom + 100, paddingHorizontal: 20 }}
-        showsVerticalScrollIndicator={false}
-        ListEmptyComponent={
-          <View style={styles.empty}>
-            <SearchIcon size={40} color={theme.colors.textMuted} />
-            <Text style={[styles.emptyText, { color: theme.colors.textMuted }]}>
-              {query.length === 0
-                ? "Type to search"
-                : isLoading
-                ? "Searching..."
-                : "No results"}
-            </Text>
-          </View>
-        }
-        renderItem={({ item }) => (
-          <View style={[styles.resultCard, { backgroundColor: theme.colors.surface }]}>
-            <View style={styles.resultHeader}>
-              <Text style={[styles.resultFile, { color: theme.colors.primary }]} numberOfLines={1}>
-                {item.file}
-              </Text>
-              <Text style={[styles.resultLine, { color: theme.colors.textMuted }]}>
-                L{item.line}
-              </Text>
-            </View>
-            <Text style={[styles.resultMatch, { color: theme.colors.text }]} numberOfLines={2}>
-              {item.context}
-            </Text>
-          </View>
-        )}
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    paddingHorizontal: 20,
-    paddingBottom: 12,
-  },
-  title: { fontSize: 28, fontWeight: "700", letterSpacing: -0.5 },
-  searchBar: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    marginHorizontal: 20,
-    marginBottom: 16,
-    paddingHorizontal: 14,
-    paddingVertical: 10,
-    borderRadius: 10,
-    borderWidth: 1,
-  },
-  searchInput: { flex: 1, fontSize: 14, padding: 0 },
-  resultCard: {
-    padding: 12,
-    borderRadius: 10,
-    marginBottom: 6,
-  },
-  resultHeader: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    marginBottom: 4,
-  },
-  resultFile: { fontSize: 13, fontWeight: "500", flex: 1, marginRight: 8 },
-  resultLine: { fontSize: 12 },
-  resultMatch: { fontSize: 13 },
-  empty: { alignItems: "center", marginTop: 80, gap: 12 },
-  emptyText: { fontSize: 14 },
-});

mobile/app/(tabs)/sessions.tsx

@@ -1,128 +0,0 @@
-import { View, Text, TextInput, TouchableOpacity, FlatList, Alert, StyleSheet } from "react-native";
-import { useRouter } from "expo-router";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { Plus, Search, Trash2, MessageSquare } from "lucide-react-native";
-import { useState } from "react";
-import { useSessions, useCreateSession, useDeleteSession } from "../../hooks/useApi";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function SessionsScreen() {
-  const router = useRouter();
-  const insets = useSafeAreaInsets();
-  const theme = themes[getTheme()];
-  const { data: sessions, isLoading } = useSessions();
-  const createSession = useCreateSession();
-  const deleteSession = useDeleteSession();
-  const [search, setSearch] = useState("");
-
-  const filtered = (sessions || []).filter(
-    (s) => !search || (s.title || "").toLowerCase().includes(search.toLowerCase())
-  );
-
-  const handleCreate = async () => {
-    try {
-      const session = await createSession.mutateAsync({ title: "New Chat", directory: "default" });
-      router.push(`/session/${session.id}`);
-    } catch {}
-  };
-
-  const handleDelete = (id: string, title: string) => {
-    Alert.alert("Delete Session", `Delete "${title || "Untitled"}"?`, [
-      { text: "Cancel", style: "cancel" },
-      { text: "Delete", style: "destructive", onPress: () => deleteSession.mutateAsync(id) },
-    ]);
-  };
-
-  return (
-    <View style={[styles.container, { backgroundColor: theme.colors.bg }]}>
-      <View style={[styles.header, { paddingTop: insets.top + 12 }]}>
-        <Text style={[styles.title, { color: theme.colors.text }]}>Sessions</Text>
-        <TouchableOpacity onPress={handleCreate}>
-          <Plus size={22} color={theme.colors.primary} />
-        </TouchableOpacity>
-      </View>
-
-      <View style={[styles.searchBar, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-        <Search size={16} color={theme.colors.textMuted} />
-        <TextInput
-          style={[styles.searchInput, { color: theme.colors.text }]}
-          placeholder="Search sessions..."
-          placeholderTextColor={theme.colors.textMuted}
-          value={search}
-          onChangeText={setSearch}
-        />
-      </View>
-
-      <FlatList
-        data={filtered}
-        keyExtractor={(item) => item.id}
-        contentContainerStyle={{ paddingBottom: insets.bottom + 100, paddingHorizontal: 20 }}
-        showsVerticalScrollIndicator={false}
-        ListEmptyComponent={
-          <View style={styles.empty}>
-            <MessageSquare size={40} color={theme.colors.textMuted} />
-            <Text style={[styles.emptyText, { color: theme.colors.textMuted }]}>
-              {isLoading ? "Loading..." : "No sessions yet"}
-            </Text>
-          </View>
-        }
-        renderItem={({ item }) => (
-          <TouchableOpacity
-            style={[styles.sessionCard, { backgroundColor: theme.colors.surface }]}
-            onPress={() => router.push(`/session/${item.id}`)}
-          >
-            <View style={styles.sessionInfo}>
-              <Text style={[styles.sessionTitle, { color: theme.colors.text }]} numberOfLines={1}>
-                {item.title || "Untitled"}
-              </Text>
-              <Text style={[styles.sessionDate, { color: theme.colors.textMuted }]}>
-                {new Date(item.updatedAt).toLocaleString()}
-              </Text>
-            </View>
-            <TouchableOpacity onPress={() => handleDelete(item.id, item.title)}>
-              <Trash2 size={16} color={theme.colors.textMuted} />
-            </TouchableOpacity>
-          </TouchableOpacity>
-        )}
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    paddingHorizontal: 20,
-    paddingBottom: 12,
-  },
-  title: { fontSize: 28, fontWeight: "700", letterSpacing: -0.5 },
-  searchBar: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    marginHorizontal: 20,
-    marginBottom: 16,
-    paddingHorizontal: 14,
-    paddingVertical: 10,
-    borderRadius: 10,
-    borderWidth: 1,
-  },
-  searchInput: { flex: 1, fontSize: 14, padding: 0 },
-  sessionCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    padding: 14,
-    borderRadius: 10,
-    marginBottom: 6,
-  },
-  sessionInfo: { flex: 1, marginRight: 12 },
-  sessionTitle: { fontSize: 15, fontWeight: "500" },
-  sessionDate: { fontSize: 12, marginTop: 2 },
-  empty: { alignItems: "center", marginTop: 80, gap: 12 },
-  emptyText: { fontSize: 14 },
-});

mobile/app/(tabs)/terminal.tsx

@@ -1,37 +0,0 @@
-import { View, Text, StyleSheet } from "react-native";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { Terminal } from "lucide-react-native";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function TerminalScreen() {
-  const insets = useSafeAreaInsets();
-  const theme = themes[getTheme()];
-
-  return (
-    <View style={[styles.container, { backgroundColor: theme.colors.bg }]}>
-      <View style={[styles.header, { paddingTop: insets.top + 12 }]}>
-        <Text style={[styles.title, { color: theme.colors.text }]}>Terminal</Text>
-      </View>
-      <View style={styles.empty}>
-        <Terminal size={48} color={theme.colors.textMuted} />
-        <Text style={[styles.emptyTitle, { color: theme.colors.text }]}>Terminal</Text>
-        <Text style={[styles.emptyText, { color: theme.colors.textMuted }]}>
-          Terminal sessions will appear here.
-        </Text>
-      </View>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    paddingHorizontal: 20,
-    paddingBottom: 12,
-  },
-  title: { fontSize: 28, fontWeight: "700", letterSpacing: -0.5 },
-  empty: { flex: 1, alignItems: "center", justifyContent: "center", gap: 12 },
-  emptyTitle: { fontSize: 18, fontWeight: "600" },
-  emptyText: { fontSize: 14 },
-});

mobile/app/_layout.tsx

@@ -1,27 +0,0 @@
-import { useEffect } from "react";
-import { Stack } from "expo-router";
-import { StatusBar } from "expo-status-bar";
-import { QueryProvider } from "../lib/query-provider";
-import { getTheme } from "../lib/storage";
-import { themes } from "../constants/themes";
-
-export default function RootLayout() {
-  const theme = themes[getTheme()];
-
-  useEffect(() => {
-    const { SystemUI } = require("expo-system-ui");
-    SystemUI.setBackgroundColorAsync(theme.colors.bg);
-  }, []);
-
-  return (
-    <QueryProvider>
-      <StatusBar style="light" />
-      <Stack
-        screenOptions={{
-          headerShown: false,
-          contentStyle: { backgroundColor: theme.colors.bg },
-        }}
-      />
-    </QueryProvider>
-  );
-}

mobile/app/session/[id].tsx

@@ -1,271 +0,0 @@
-import { View, Text, TextInput, TouchableOpacity, FlatList, KeyboardAvoidingView, Platform, StyleSheet } from "react-native";
-import { useLocalSearchParams, useRouter } from "expo-router";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { useState, useEffect, useRef } from "react";
-import { ArrowLeft, Send, Loader, AlertTriangle } from "lucide-react-native";
-import { useMessages, useSession, useSendMessage, useReplyPermission, useReplyQuestion } from "../../hooks/useApi";
-import { useSSE, getMessagesFromEvents } from "../../hooks/useSSE";
-import { MarkdownRenderer } from "../../components/MarkdownRenderer";
-import { ToolTimeline } from "../../components/ToolTimeline";
-import { PermissionCard } from "../../components/PermissionCard";
-import { QuestionCard } from "../../components/QuestionCard";
-import { Message, MessagePart, ToolPart, PermissionRequest, QuestionRequest } from "../../constants/types";
-import { getTheme } from "../../lib/storage";
-import { themes } from "../../constants/themes";
-
-export default function ChatScreen() {
-  const { id } = useLocalSearchParams<{ id: string }>();
-  const router = useRouter();
-  const insets = useSafeAreaInsets();
-  const theme = themes[getTheme()];
-  const [input, setInput] = useState("");
-  const flatListRef = useRef<FlatList>(null);
-
-  const { data: session } = useSession(id || "");
-  const { data: serverMessages } = useMessages(id || "");
-  const { connect, disconnect, streaming, events, error } = useSSE(id);
-  const sendMessage = useSendMessage();
-  const replyPermission = useReplyPermission();
-  const replyQuestion = useReplyQuestion();
-
-  // Build messages from server + SSE events
-  const sseMessages = getMessagesFromEvents(events);
-  const allMessages: Message[] = [...(serverMessages || []), ...sseMessages];
-
-  // Deduplicate by id
-  const seen = new Set<string>();
-  const uniqueMessages = allMessages.filter((m) => {
-    if (seen.has(m.id)) return false;
-    seen.add(m.id);
-    return true;
-  });
-
-  // Collect pending permissions and questions
-  const pendingPermissions: PermissionRequest[] = [];
-  const pendingQuestions: QuestionRequest[] = [];
-  for (const ev of events) {
-    if (ev.type === "permission.requested") {
-      const perm = ev.properties as PermissionRequest;
-      if (perm.state === "pending") pendingPermissions.push(perm);
-    }
-    if (ev.type === "question.asked") {
-      const q = ev.properties as QuestionRequest;
-      if (q.state === "pending") pendingQuestions.push(q);
-    }
-  }
-
-  useEffect(() => {
-    connect();
-    return () => disconnect();
-  }, [id]);
-
-  const handleSend = () => {
-    if (!input.trim() || !id) return;
-    sendMessage.mutate({ sessionId: id, content: input.trim() });
-    setInput("");
-  };
-
-  useEffect(() => {
-    if (uniqueMessages.length > 0 || events.length > 0) {
-      setTimeout(() => flatListRef.current?.scrollToEnd({ animated: true }), 100);
-    }
-  }, [uniqueMessages.length, events.length]);
-
-  const renderPart = (part: MessagePart, index: number) => {
-    if (part.type === "text" && part.text) {
-      return <MarkdownRenderer key={index} content={part.text} />;
-    }
-    if (part.type === "tool") {
-      const toolPart = part as ToolPart;
-      return (
-        <ToolTimeline
-          key={toolPart.callID || index}
-          parts={[toolPart]}
-        />
-      );
-    }
-    if (part.type === "reasoning") {
-      return (
-        <View key={index} style={[styles.reasoning, { backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}>
-          <Text style={[styles.reasoningLabel, { color: theme.colors.textMuted }]}>Thinking...</Text>
-          <Text style={[styles.reasoningText, { color: theme.colors.textMuted }]} numberOfLines={3}>
-            {part.text}
-          </Text>
-        </View>
-      );
-    }
-    return null;
-  };
-
-  const renderMessage = (item: Message) => {
-    const isUser = item.role === "user";
-
-    // Group consecutive tool parts
-    const toolParts: ToolPart[] = [];
-    const otherParts: MessagePart[] = [];
-    for (const part of item.parts) {
-      if (part.type === "tool") toolParts.push(part as ToolPart);
-      else otherParts.push(part);
-    }
-
-    return (
-      <View
-        style={[
-          styles.bubble,
-          isUser
-            ? { backgroundColor: theme.colors.primary, alignSelf: "flex-end", maxWidth: "85%" }
-            : { backgroundColor: theme.colors.surface, alignSelf: "flex-start", maxWidth: "90%" },
-        ]}
-      >
-        {otherParts.map((part, i) => renderPart(part, i))}
-        {toolParts.length > 0 && <ToolTimeline parts={toolParts} />}
-      </View>
-    );
-  };
-
-  return (
-    <KeyboardAvoidingView
-      style={[styles.container, { backgroundColor: theme.colors.bg }]}
-      behavior={Platform.OS === "ios" ? "padding" : undefined}
-      keyboardVerticalOffset={Platform.OS === "ios" ? 0 : 0}
-    >
-      <View style={[styles.header, { paddingTop: insets.top + 8, backgroundColor: theme.colors.bgSecondary, borderBottomColor: theme.colors.border }]}>
-        <TouchableOpacity onPress={() => router.back()} style={styles.backBtn}>
-          <ArrowLeft size={20} color={theme.colors.text} />
-        </TouchableOpacity>
-        <Text style={[styles.headerTitle, { color: theme.colors.text }]} numberOfLines={1}>
-          {session?.title || "Chat"}
-        </Text>
-      </View>
-
-      <FlatList
-        ref={flatListRef}
-        data={uniqueMessages}
-        keyExtractor={(item) => item.id}
-        contentContainerStyle={{ padding: 20, paddingBottom: 20, gap: 12 }}
-        showsVerticalScrollIndicator={false}
-        onContentSizeChange={() => flatListRef.current?.scrollToEnd({ animated: true })}
-        renderItem={({ item }) => renderMessage(item)}
-        ListFooterComponent={
-          <>
-            {/* Pending permissions */}
-            {pendingPermissions.map((perm) => (
-              <PermissionCard
-                key={perm.id}
-                request={perm}
-                onAllow={() => replyPermission.mutate({ sessionId: id!, requestId: perm.id, allow: true })}
-                onDeny={() => replyPermission.mutate({ sessionId: id!, requestId: perm.id, allow: false })}
-              />
-            ))}
-
-            {/* Pending questions */}
-            {pendingQuestions.map((q) => (
-              <QuestionCard
-                key={q.id}
-                request={q}
-                onReply={(answer) => replyQuestion.mutate({ sessionId: id!, requestId: q.id, answer })}
-              />
-            ))}
-
-            {/* Streaming indicator */}
-            {streaming && (
-              <View style={[styles.bubble, { backgroundColor: theme.colors.surface, alignSelf: "flex-start" }]}>
-                <View style={styles.typing}>
-                  <Loader size={14} color={theme.colors.textMuted} />
-                  <Text style={[styles.typingText, { color: theme.colors.textMuted }]}>Thinking...</Text>
-                </View>
-              </View>
-            )}
-          </>
-        }
-      />
-
-      {error && (
-        <View style={[styles.errorBar, { backgroundColor: theme.colors.danger }]}>
-          <AlertTriangle size={14} color="#fff" />
-          <Text style={[styles.errorText, { color: "#fff" }]}>{error}</Text>
-        </View>
-      )}
-
-      <View style={[styles.inputBar, { borderTopColor: theme.colors.border, backgroundColor: theme.colors.bgSecondary, paddingBottom: insets.bottom + 8 }]}>
-        <TextInput
-          style={[styles.textInput, { color: theme.colors.text, backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}
-          placeholder="Type a message..."
-          placeholderTextColor={theme.colors.textMuted}
-          value={input}
-          onChangeText={setInput}
-          onSubmitEditing={handleSend}
-          multiline
-          maxLength={4000}
-        />
-        <TouchableOpacity
-          style={[styles.sendBtn, { backgroundColor: input.trim() ? theme.colors.primary : theme.colors.surface }]}
-          onPress={handleSend}
-          disabled={!input.trim() || streaming}
-        >
-          <Send size={18} color={input.trim() ? theme.colors.primaryText : theme.colors.textMuted} />
-        </TouchableOpacity>
-      </View>
-    </KeyboardAvoidingView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    paddingHorizontal: 16,
-    paddingBottom: 10,
-    borderBottomWidth: 1,
-  },
-  backBtn: { padding: 4 },
-  headerTitle: { fontSize: 17, fontWeight: "600", flex: 1 },
-  bubble: {
-    padding: 14,
-    borderRadius: 14,
-  },
-  reasoning: {
-    padding: 10,
-    borderRadius: 8,
-    borderWidth: 1,
-    marginTop: 4,
-  },
-  reasoningLabel: { fontSize: 11, fontWeight: "600", textTransform: "uppercase", marginBottom: 4 },
-  reasoningText: { fontSize: 12, lineHeight: 18, fontStyle: "italic" },
-  typing: { flexDirection: "row", alignItems: "center", gap: 6 },
-  typingText: { fontSize: 14 },
-  errorBar: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    paddingHorizontal: 16,
-    paddingVertical: 8,
-  },
-  errorText: { fontSize: 13, flex: 1 },
-  inputBar: {
-    flexDirection: "row",
-    alignItems: "flex-end",
-    gap: 8,
-    paddingHorizontal: 16,
-    paddingTop: 10,
-    borderTopWidth: 1,
-  },
-  textInput: {
-    flex: 1,
-    fontSize: 15,
-    paddingHorizontal: 14,
-    paddingVertical: 10,
-    borderRadius: 12,
-    borderWidth: 1,
-    maxHeight: 120,
-  },
-  sendBtn: {
-    width: 40,
-    height: 40,
-    borderRadius: 12,
-    alignItems: "center",
-    justifyContent: "center",
-  },
-});

mobile/app/settings.tsx

@@ -1,281 +0,0 @@
-import { View, Text, TextInput, TouchableOpacity, ScrollView, StyleSheet } from "react-native";
-import { useRouter } from "expo-router";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { useState, useEffect } from "react";
-import { ArrowLeft, Check, Shield, Globe, Key, Lock } from "lucide-react-native";
-import { getHealth } from "../lib/api";
-import {
-  getServerUrl,
-  setServerUrl as persistUrl,
-  getAuthType,
-  setAuthType,
-  getAuthValue,
-  setAuthValue,
-  clearAuth,
-  getTheme,
-  setTheme as persistTheme,
-} from "../lib/storage";
-import type { AuthType } from "../lib/storage";
-import { themes } from "../constants/themes";
-import { ThemeName } from "../constants/types";
-
-const themeNames = Object.keys(themes) as ThemeName[];
-
-const authTypes: { type: AuthType; label: string; description: string; icon: typeof Shield }[] = [
-  { type: "none", label: "None", description: "No authentication", icon: Globe },
-  { type: "basic", label: "Basic Auth", description: "Username & password", icon: Lock },
-  { type: "bearer", label: "Bearer Token", description: "Authorization header", icon: Key },
-  { type: "apikey", label: "API Key", description: "X-API-Key header", icon: Shield },
-];
-
-export default function SettingsScreen() {
-  const router = useRouter();
-  const insets = useSafeAreaInsets();
-  const currentTheme = getTheme();
-  const theme = themes[currentTheme];
-
-  const [serverInput, setServerInput] = useState(getServerUrl());
-  const [authType, setAuthTypeState] = useState<AuthType>(getAuthType());
-  const [authValue, setAuthValueState] = useState(getAuthValue());
-  const [connected, setConnected] = useState<boolean | null>(null);
-  const [serverVersion, setServerVersion] = useState<string | null>(null);
-
-  // Basic auth split
-  const [basicUser, setBasicUser] = useState(() => {
-    const val = getAuthValue();
-    return getAuthType() === "basic" && val.includes(":") ? val.split(":")[0] : "";
-  });
-  const [basicPass, setBasicPass] = useState(() => {
-    const val = getAuthValue();
-    return getAuthType() === "basic" && val.includes(":") ? val.split(":").slice(1).join(":") : "";
-  });
-
-  const testConnection = async () => {
-    persistUrl(serverInput);
-
-    // Save auth
-    if (authType === "basic") {
-      setAuthValue(`${basicUser}:${basicPass}`);
-    } else {
-      setAuthValue(authValue);
-    }
-    setAuthType(authType);
-
-    try {
-      const health = await getHealth();
-      setConnected(health.healthy);
-      setServerVersion(health.version || null);
-    } catch {
-      setConnected(false);
-      setServerVersion(null);
-    }
-  };
-
-  const handleThemeSelect = (name: ThemeName) => {
-    persistTheme(name);
-  };
-
-  return (
-    <View style={[styles.container, { backgroundColor: theme.colors.bg }]}>
-      <View style={[styles.header, { paddingTop: insets.top + 12, borderBottomColor: theme.colors.border }]}>
-        <TouchableOpacity onPress={() => router.back()} style={styles.backBtn}>
-          <ArrowLeft size={20} color={theme.colors.text} />
-        </TouchableOpacity>
-        <Text style={[styles.title, { color: theme.colors.text }]}>Settings</Text>
-      </View>
-
-      <ScrollView
-        contentContainerStyle={{ padding: 20, paddingBottom: insets.bottom + 40 }}
-        showsVerticalScrollIndicator={false}
-      >
-        {/* Server */}
-        <Text style={[styles.sectionLabel, { color: theme.colors.textSecondary }]}>Server</Text>
-        <View style={[styles.card, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-          <Text style={[styles.label, { color: theme.colors.textMuted }]}>Server URL</Text>
-          <TextInput
-            style={[styles.input, { color: theme.colors.text, backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}
-            value={serverInput}
-            onChangeText={setServerInput}
-            placeholder="http://127.0.0.1:4096"
-            placeholderTextColor={theme.colors.textMuted}
-            autoCapitalize="none"
-            autoCorrect={false}
-          />
-
-          {/* Auth Type */}
-          <Text style={[styles.label, { color: theme.colors.textMuted, marginTop: 8 }]}>Authentication</Text>
-          <View style={styles.authGrid}>
-            {authTypes.map((a) => {
-              const Icon = a.icon;
-              const selected = authType === a.type;
-              return (
-                <TouchableOpacity
-                  key={a.type}
-                  style={[
-                    styles.authCard,
-                    {
-                      backgroundColor: selected ? theme.colors.bgTertiary : theme.colors.bg,
-                      borderColor: selected ? theme.colors.primary : theme.colors.border,
-                    },
-                  ]}
-                  onPress={() => setAuthTypeState(a.type)}
-                >
-                  <Icon size={16} color={selected ? theme.colors.primary : theme.colors.textMuted} />
-                  <Text style={[styles.authLabel, { color: selected ? theme.colors.text : theme.colors.textMuted }]}>
-                    {a.label}
-                  </Text>
-                </TouchableOpacity>
-              );
-            })}
-          </View>
-
-          {/* Auth Value Input */}
-          {authType === "basic" && (
-            <View style={{ gap: 8, marginTop: 8 }}>
-              <TextInput
-                style={[styles.input, { color: theme.colors.text, backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}
-                value={basicUser}
-                onChangeText={setBasicUser}
-                placeholder="Username"
-                placeholderTextColor={theme.colors.textMuted}
-                autoCapitalize="none"
-              />
-              <TextInput
-                style={[styles.input, { color: theme.colors.text, backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}
-                value={basicPass}
-                onChangeText={setBasicPass}
-                placeholder="Password"
-                placeholderTextColor={theme.colors.textMuted}
-                secureTextEntry
-              />
-            </View>
-          )}
-          {authType === "bearer" && (
-            <TextInput
-              style={[styles.input, { color: theme.colors.text, backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border, marginTop: 8 }]}
-              value={authValue}
-              onChangeText={setAuthValueState}
-              placeholder="Bearer token"
-              placeholderTextColor={theme.colors.textMuted}
-              autoCapitalize="none"
-              secureTextEntry
-            />
-          )}
-          {authType === "apikey" && (
-            <TextInput
-              style={[styles.input, { color: theme.colors.text, backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border, marginTop: 8 }]}
-              value={authValue}
-              onChangeText={setAuthValueState}
-              placeholder="API key"
-              placeholderTextColor={theme.colors.textMuted}
-              autoCapitalize="none"
-              secureTextEntry
-            />
-          )}
-
-          <TouchableOpacity style={[styles.btn, { backgroundColor: theme.colors.primary }]} onPress={testConnection}>
-            <Text style={[styles.btnText, { color: theme.colors.primaryText }]}>Test Connection</Text>
-          </TouchableOpacity>
-          {connected !== null && (
-            <Text style={[styles.status, { color: connected ? theme.colors.success : theme.colors.danger }]}>
-              {connected ? `Connected${serverVersion ? ` (v${serverVersion})` : ""}` : "Failed to connect"}
-            </Text>
-          )}
-        </View>
-
-        {/* Theme */}
-        <Text style={[styles.sectionLabel, { color: theme.colors.textSecondary, marginTop: 28 }]}>Theme</Text>
-        <View style={styles.themeGrid}>
-          {themeNames.map((name) => {
-            const t = themes[name];
-            const selected = currentTheme === name;
-            return (
-              <TouchableOpacity
-                key={name}
-                style={[
-                  styles.themeCard,
-                  {
-                    backgroundColor: t.colors.bg,
-                    borderColor: selected ? theme.colors.primary : t.colors.border,
-                    borderWidth: selected ? 2 : 1,
-                  },
-                ]}
-                onPress={() => handleThemeSelect(name)}
-              >
-                <View style={styles.themePreview}>
-                  <View style={[styles.dot, { backgroundColor: t.colors.primary }]} />
-                  <View style={[styles.dot, { backgroundColor: t.colors.secondary }]} />
-                  <View style={[styles.dot, { backgroundColor: t.colors.danger }]} />
-                </View>
-                <Text style={[styles.themeName, { color: t.colors.text }]}>{t.label}</Text>
-                {selected && <Check size={14} color={theme.colors.primary} />}
-              </TouchableOpacity>
-            );
-          })}
-        </View>
-
-        {/* About */}
-        <Text style={[styles.sectionLabel, { color: theme.colors.textSecondary, marginTop: 28 }]}>About</Text>
-        <View style={[styles.card, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-          <Text style={[styles.aboutText, { color: theme.colors.text }]}>OpenCode Mobile</Text>
-          <Text style={[styles.aboutVersion, { color: theme.colors.textMuted }]}>v1.0.0</Text>
-        </View>
-      </ScrollView>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    paddingHorizontal: 20,
-    paddingBottom: 12,
-    borderBottomWidth: 1,
-  },
-  backBtn: { padding: 4 },
-  title: { fontSize: 28, fontWeight: "700", letterSpacing: -0.5 },
-  sectionLabel: { fontSize: 13, fontWeight: "600", textTransform: "uppercase", letterSpacing: 0.5, marginBottom: 10 },
-  card: { padding: 16, borderRadius: 12, borderWidth: 1, gap: 10 },
-  label: { fontSize: 13, fontWeight: "500" },
-  input: {
-    fontSize: 14,
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    borderRadius: 8,
-    borderWidth: 1,
-  },
-  btn: { paddingVertical: 12, borderRadius: 10, alignItems: "center", marginTop: 4 },
-  btnText: { fontSize: 14, fontWeight: "600" },
-  status: { fontSize: 13, textAlign: "center" },
-  authGrid: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 8,
-  },
-  authCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    paddingHorizontal: 12,
-    paddingVertical: 8,
-    borderRadius: 8,
-    borderWidth: 1,
-  },
-  authLabel: { fontSize: 13, fontWeight: "500" },
-  themeGrid: { gap: 8 },
-  themeCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 12,
-    padding: 14,
-    borderRadius: 10,
-  },
-  themePreview: { flexDirection: "row", gap: 4 },
-  dot: { width: 10, height: 10, borderRadius: 5 },
-  themeName: { flex: 1, fontSize: 14, fontWeight: "500" },
-  aboutText: { fontSize: 15, fontWeight: "600" },
-  aboutVersion: { fontSize: 13 },
-});

mobile/components/MarkdownRenderer.tsx

@@ -1,134 +0,0 @@
-import React from "react";
-import { View, Text, StyleSheet, ScrollView } from "react-native";
-import Markdown from "react-native-markdown-display";
-import { themes } from "../constants/themes";
-import { getTheme } from "../lib/storage";
-
-interface MarkdownRendererProps {
-  content: string;
-}
-
-const codeStyle = (theme: { colors: Record<string, string> }) =>
-  StyleSheet.create({
-    body: {},
-    heading1: { fontSize: 22, fontWeight: "700", color: theme.colors.text, marginTop: 16, marginBottom: 8 },
-    heading2: { fontSize: 19, fontWeight: "700", color: theme.colors.text, marginTop: 14, marginBottom: 6 },
-    heading3: { fontSize: 16, fontWeight: "600", color: theme.colors.text, marginTop: 12, marginBottom: 4 },
-    paragraph: { fontSize: 15, lineHeight: 22, color: theme.colors.text, marginBottom: 8 },
-    link: { color: theme.colors.primary, textDecorationLine: "none" },
-    blockquote: {
-      borderLeftWidth: 3,
-      borderLeftColor: theme.colors.primary,
-      paddingLeft: 12,
-      marginLeft: 0,
-      marginVertical: 8,
-      opacity: 0.8,
-    },
-    code_inline: {
-      fontFamily: "monospace",
-      fontSize: 13,
-      color: theme.colors.accent,
-      backgroundColor: theme.colors.bgTertiary,
-      paddingHorizontal: 5,
-      paddingVertical: 2,
-      borderRadius: 4,
-    },
-    code_block: {
-      fontFamily: "monospace",
-      fontSize: 13,
-      color: theme.colors.text,
-      backgroundColor: theme.colors.bgTertiary,
-      padding: 12,
-      borderRadius: 8,
-      marginVertical: 8,
-      borderWidth: 1,
-      borderColor: theme.colors.border,
-    },
-    fence: {
-      fontFamily: "monospace",
-      fontSize: 13,
-      color: theme.colors.text,
-      backgroundColor: theme.colors.bgTertiary,
-      padding: 12,
-      borderRadius: 8,
-      marginVertical: 8,
-      borderWidth: 1,
-      borderColor: theme.colors.border,
-    },
-    list_item: { fontSize: 15, lineHeight: 22, color: theme.colors.text, marginBottom: 4 },
-    bullet_list: { marginVertical: 8 },
-    ordered_list: { marginVertical: 8 },
-    table: { borderWidth: 1, borderColor: theme.colors.border, marginVertical: 8 },
-    table_header_cell: {
-      backgroundColor: theme.colors.bgTertiary,
-      padding: 8,
-      borderBottomWidth: 1,
-      borderBottomColor: theme.colors.border,
-    },
-    table_cell: { padding: 8, borderBottomWidth: 1, borderBottomColor: theme.colors.border },
-    strong: { fontWeight: "700" },
-    em: { fontStyle: "italic" },
-    hr: { height: 1, backgroundColor: theme.colors.border, marginVertical: 16 },
-    image: { marginVertical: 8 },
-  });
-
-export function MarkdownRenderer({ content }: MarkdownRendererProps) {
-  const theme = themes[getTheme()];
-  const styles = codeStyle(theme);
-
-  return (
-    <Markdown style={styles}>{content}</Markdown>
-  );
-}
-
-// ── Code block with language label ──
-
-interface CodeBlockProps {
-  language?: string;
-  children: string;
-}
-
-export function CodeBlock({ language, children }: CodeBlockProps) {
-  const theme = themes[getTheme()];
-
-  return (
-    <View style={[codeStyles.container, { backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}>
-      {language ? (
-        <View style={[codeStyles.header, { borderBottomColor: theme.colors.border }]}>
-          <Text style={[codeStyles.language, { color: theme.colors.textMuted }]}>{language}</Text>
-        </View>
-      ) : null}
-      <ScrollView horizontal showsHorizontalScrollIndicator={false}>
-        <Text style={[codeStyles.code, { color: theme.colors.text }]} selectable>
-          {children}
-        </Text>
-      </ScrollView>
-    </View>
-  );
-}
-
-const codeStyles = StyleSheet.create({
-  container: {
-    borderRadius: 8,
-    borderWidth: 1,
-    marginVertical: 8,
-    overflow: "hidden",
-  },
-  header: {
-    paddingHorizontal: 12,
-    paddingVertical: 6,
-    borderBottomWidth: 1,
-  },
-  language: {
-    fontSize: 11,
-    fontWeight: "600",
-    textTransform: "uppercase",
-    letterSpacing: 0.5,
-  },
-  code: {
-    fontFamily: "monospace",
-    fontSize: 13,
-    lineHeight: 20,
-    padding: 12,
-  },
-});

mobile/components/PermissionCard.tsx

@@ -1,113 +0,0 @@
-import React from "react";
-import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
-import { Shield, Check, X } from "lucide-react-native";
-import { themes } from "../constants/themes";
-import { getTheme } from "../lib/storage";
-import type { PermissionRequest } from "../constants/types";
-
-interface PermissionCardProps {
-  request: PermissionRequest;
-  onAllow: () => void;
-  onDeny: () => void;
-}
-
-export function PermissionCard({ request, onAllow, onDeny }: PermissionCardProps) {
-  const theme = themes[getTheme()];
-
-  return (
-    <View style={[styles.card, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-      <View style={styles.header}>
-        <Shield size={16} color={theme.colors.warning} />
-        <Text style={[styles.title, { color: theme.colors.text }]}>Permission Required</Text>
-      </View>
-
-      <Text style={[styles.permission, { color: theme.colors.textSecondary }]}>
-        {request.permission}
-      </Text>
-
-      {request.description ? (
-        <Text style={[styles.description, { color: theme.colors.textMuted }]}>
-          {request.description}
-        </Text>
-      ) : null}
-
-      <View style={styles.actions}>
-        <TouchableOpacity
-          style={[styles.denyBtn, { backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}
-          onPress={onDeny}
-          activeOpacity={0.7}
-        >
-          <X size={16} color={theme.colors.danger} />
-          <Text style={[styles.denyText, { color: theme.colors.danger }]}>Deny</Text>
-        </TouchableOpacity>
-
-        <TouchableOpacity
-          style={[styles.allowBtn, { backgroundColor: theme.colors.success }]}
-          onPress={onAllow}
-          activeOpacity={0.7}
-        >
-          <Check size={16} color="#fff" />
-          <Text style={[styles.allowText, { color: "#fff" }]}>Allow</Text>
-        </TouchableOpacity>
-      </View>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  card: {
-    padding: 16,
-    borderRadius: 12,
-    borderWidth: 1,
-    gap: 10,
-  },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-  },
-  title: {
-    fontSize: 15,
-    fontWeight: "600",
-  },
-  permission: {
-    fontSize: 14,
-    fontWeight: "500",
-  },
-  description: {
-    fontSize: 13,
-    lineHeight: 18,
-  },
-  actions: {
-    flexDirection: "row",
-    gap: 10,
-    marginTop: 4,
-  },
-  denyBtn: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 6,
-    paddingVertical: 10,
-    borderRadius: 8,
-    borderWidth: 1,
-  },
-  denyText: {
-    fontSize: 14,
-    fontWeight: "600",
-  },
-  allowBtn: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 6,
-    paddingVertical: 10,
-    borderRadius: 8,
-  },
-  allowText: {
-    fontSize: 14,
-    fontWeight: "600",
-  },
-});

mobile/components/QuestionCard.tsx

@@ -1,176 +0,0 @@
-import React, { useState } from "react";
-import { View, Text, TouchableOpacity, TextInput, StyleSheet } from "react-native";
-import { HelpCircle, Send } from "lucide-react-native";
-import { themes } from "../constants/themes";
-import { getTheme } from "../lib/storage";
-import type { QuestionRequest } from "../constants/types";
-
-interface QuestionCardProps {
-  request: QuestionRequest;
-  onReply: (answer: string) => void;
-  onReject?: () => void;
-}
-
-export function QuestionCard({ request, onReply, onReject }: QuestionCardProps) {
-  const theme = themes[getTheme()];
-  const [selected, setSelected] = useState<string | null>(null);
-  const [customAnswer, setCustomAnswer] = useState("");
-
-  const handleSubmit = () => {
-    if (selected) {
-      onReply(selected);
-    } else if (customAnswer.trim()) {
-      onReply(customAnswer.trim());
-    }
-  };
-
-  const hasOptions = request.options && request.options.length > 0;
-
-  return (
-    <View style={[styles.card, { backgroundColor: theme.colors.surface, borderColor: theme.colors.border }]}>
-      <View style={styles.header}>
-        <HelpCircle size={16} color={theme.colors.primary} />
-        <Text style={[styles.title, { color: theme.colors.text }]}>Question</Text>
-      </View>
-
-      <Text style={[styles.question, { color: theme.colors.textSecondary }]}>
-        {request.question}
-      </Text>
-
-      {hasOptions ? (
-        <View style={styles.options}>
-          {request.options!.map((option) => {
-            const isSelected = selected === option;
-            return (
-              <TouchableOpacity
-                key={option}
-                style={[
-                  styles.option,
-                  {
-                    backgroundColor: isSelected ? theme.colors.bgTertiary : theme.colors.bg,
-                    borderColor: isSelected ? theme.colors.primary : theme.colors.border,
-                  },
-                ]}
-                onPress={() => setSelected(option)}
-                activeOpacity={0.7}
-              >
-                <View
-                  style={[
-                    styles.radio,
-                    {
-                      borderColor: isSelected ? theme.colors.primary : theme.colors.textMuted,
-                      backgroundColor: isSelected ? theme.colors.primary : "transparent",
-                    },
-                  ]}
-                />
-                <Text
-                  style={[
-                    styles.optionText,
-                    { color: isSelected ? theme.colors.text : theme.colors.textSecondary },
-                  ]}
-                >
-                  {option}
-                </Text>
-              </TouchableOpacity>
-            );
-          })}
-        </View>
-      ) : (
-        <TextInput
-          style={[styles.input, { color: theme.colors.text, backgroundColor: theme.colors.bgTertiary, borderColor: theme.colors.border }]}
-          value={customAnswer}
-          onChangeText={setCustomAnswer}
-          placeholder="Type your answer..."
-          placeholderTextColor={theme.colors.textMuted}
-          multiline
-        />
-      )}
-
-      <TouchableOpacity
-        style={[
-          styles.submitBtn,
-          {
-            backgroundColor: selected || customAnswer.trim() ? theme.colors.primary : theme.colors.bgTertiary,
-          },
-        ]}
-        onPress={handleSubmit}
-        disabled={!selected && !customAnswer.trim()}
-        activeOpacity={0.7}
-      >
-        <Send size={14} color={selected || customAnswer.trim() ? theme.colors.primaryText : theme.colors.textMuted} />
-        <Text
-          style={[
-            styles.submitText,
-            { color: selected || customAnswer.trim() ? theme.colors.primaryText : theme.colors.textMuted },
-          ]}
-        >
-          Submit
-        </Text>
-      </TouchableOpacity>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  card: {
-    padding: 16,
-    borderRadius: 12,
-    borderWidth: 1,
-    gap: 10,
-  },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-  },
-  title: {
-    fontSize: 15,
-    fontWeight: "600",
-  },
-  question: {
-    fontSize: 14,
-    lineHeight: 20,
-  },
-  options: {
-    gap: 6,
-  },
-  option: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    padding: 12,
-    borderRadius: 8,
-    borderWidth: 1,
-  },
-  radio: {
-    width: 16,
-    height: 16,
-    borderRadius: 8,
-    borderWidth: 2,
-  },
-  optionText: {
-    fontSize: 14,
-    flex: 1,
-  },
-  input: {
-    fontSize: 14,
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    borderRadius: 8,
-    borderWidth: 1,
-    minHeight: 44,
-  },
-  submitBtn: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 6,
-    paddingVertical: 10,
-    borderRadius: 8,
-    marginTop: 4,
-  },
-  submitText: {
-    fontSize: 14,
-    fontWeight: "600",
-  },
-});

mobile/components/ToolTimeline.tsx

@@ -1,165 +0,0 @@
-import React from "react";
-import { View, Text, StyleSheet } from "react-native";
-import { Loader, Check, X, FileText, Search, Terminal, Globe, Wrench } from "lucide-react-native";
-import { themes } from "../constants/themes";
-import { getTheme } from "../lib/storage";
-import type { ToolPart } from "../constants/types";
-
-interface ToolTimelineProps {
-  parts: ToolPart[];
-}
-
-const toolIcons: Record<string, typeof Wrench> = {
-  read: FileText,
-  write: FileText,
-  edit: FileText,
-  glob: Search,
-  grep: Search,
-  bash: Terminal,
-  webfetch: Globe,
-  websearch: Globe,
-};
-
-const toolLabels: Record<string, string> = {
-  read: "Reading file",
-  write: "Writing file",
-  edit: "Editing file",
-  glob: "Searching files",
-  grep: "Searching content",
-  bash: "Running command",
-  webfetch: "Fetching URL",
-  websearch: "Searching web",
-};
-
-export function ToolTimeline({ parts }: ToolTimelineProps) {
-  const theme = themes[getTheme()];
-
-  if (parts.length === 0) return null;
-
-  return (
-    <View style={styles.container}>
-      {parts.map((part, index) => {
-        const Icon = toolIcons[part.tool] || Wrench;
-        const label = toolLabels[part.tool] || part.tool;
-        const isRunning = part.state === "call";
-        const isError = part.state === "error";
-        const isDone = part.state === "result";
-
-        return (
-          <View key={part.callID || index} style={styles.row}>
-            {/* Status indicator */}
-            <View
-              style={[
-                styles.indicator,
-                {
-                  backgroundColor: isRunning
-                    ? theme.colors.warning
-                    : isError
-                    ? theme.colors.danger
-                    : theme.colors.success,
-                },
-              ]}
-            />
-
-            {/* Content */}
-            <View style={styles.content}>
-              <View style={styles.header}>
-                <Icon
-                  size={14}
-                  color={
-                    isRunning
-                      ? theme.colors.warning
-                      : isError
-                      ? theme.colors.danger
-                      : theme.colors.success
-                  }
-                />
-                <Text
-                  style={[
-                    styles.label,
-                    {
-                      color: isRunning
-                        ? theme.colors.text
-                        : theme.colors.textMuted,
-                    },
-                  ]}
-                  numberOfLines={1}
-                >
-                  {label}
-                </Text>
-
-                {isRunning && <Loader size={12} color={theme.colors.warning} />}
-                {isDone && <Check size={12} color={theme.colors.success} />}
-                {isError && <X size={12} color={theme.colors.danger} />}
-              </View>
-
-              {/* Tool title (if provided) */}
-              {part.title ? (
-                <Text
-                  style={[styles.title, { color: theme.colors.textSecondary }]}
-                  numberOfLines={1}
-                >
-                  {part.title}
-                </Text>
-              ) : null}
-
-              {/* Show truncated input for certain tools */}
-              {part.input && (part.tool === "bash" || part.tool === "webfetch") && (
-                <Text
-                  style={[styles.detail, { color: theme.colors.textMuted }]}
-                  numberOfLines={1}
-                >
-                  {part.tool === "bash"
-                    ? `$ ${part.input.command || JSON.stringify(part.input).slice(0, 60)}`
-                    : String(part.input.url || "").slice(0, 80)}
-                </Text>
-              )}
-            </View>
-          </View>
-        );
-      })}
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    gap: 2,
-    marginVertical: 4,
-  },
-  row: {
-    flexDirection: "row",
-    alignItems: "flex-start",
-    gap: 10,
-  },
-  indicator: {
-    width: 6,
-    height: 6,
-    borderRadius: 3,
-    marginTop: 6,
-  },
-  content: {
-    flex: 1,
-    gap: 2,
-  },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-  },
-  label: {
-    fontSize: 13,
-    fontWeight: "500",
-    flex: 1,
-  },
-  title: {
-    fontSize: 12,
-    marginLeft: 20,
-  },
-  detail: {
-    fontSize: 12,
-    fontFamily: "monospace",
-    marginLeft: 20,
-    opacity: 0.7,
-  },
-});

mobile/constants/themes.ts

@@ -1,132 +0,0 @@
-import { Theme, ThemeName } from "./types";
-
-export const themes: Record<ThemeName, Theme> = {
-  tokyo: {
-    name: "tokyo",
-    label: "Tokyo Night",
-    colors: {
-      bg: "#1a1b26",
-      bgSecondary: "#16161e",
-      bgTertiary: "#24283b",
-      surface: "#292e42",
-      border: "#3b4261",
-      text: "#c0caf5",
-      textSecondary: "#a9b1d6",
-      textMuted: "#565f89",
-      primary: "#7aa2f7",
-      primaryText: "#1a1b26",
-      secondary: "#bb9af7",
-      danger: "#f7768e",
-      success: "#9ece6a",
-      warning: "#e0af68",
-      accent: "#7dcfff",
-    },
-  },
-  dracula: {
-    name: "dracula",
-    label: "Dracula",
-    colors: {
-      bg: "#282a36",
-      bgSecondary: "#21222c",
-      bgTertiary: "#343746",
-      surface: "#44475a",
-      border: "#6272a4",
-      text: "#f8f8f2",
-      textSecondary: "#bd93f9",
-      textMuted: "#6272a4",
-      primary: "#bd93f9",
-      primaryText: "#282a36",
-      secondary: "#ff79c6",
-      danger: "#ff5555",
-      success: "#50fa7b",
-      warning: "#f1fa8c",
-      accent: "#8be9fd",
-    },
-  },
-  nord: {
-    name: "nord",
-    label: "Nord",
-    colors: {
-      bg: "#2e3440",
-      bgSecondary: "#3b4252",
-      bgTertiary: "#434c5e",
-      surface: "#4c566a",
-      border: "#4c566a",
-      text: "#eceff4",
-      textSecondary: "#d8dee9",
-      textMuted: "#7b88a1",
-      primary: "#88c0d0",
-      primaryText: "#2e3440",
-      secondary: "#b48ead",
-      danger: "#bf616a",
-      success: "#a3be8c",
-      warning: "#ebcb8b",
-      accent: "#8fbcbb",
-    },
-  },
-  gruvbox: {
-    name: "gruvbox",
-    label: "Gruvbox",
-    colors: {
-      bg: "#282828",
-      bgSecondary: "#1d2021",
-      bgTertiary: "#3c3836",
-      surface: "#504945",
-      border: "#665c54",
-      text: "#ebdbb2",
-      textSecondary: "#d5c4a1",
-      textMuted: "#928374",
-      primary: "#d79921",
-      primaryText: "#282828",
-      secondary: "#b8bb26",
-      danger: "#cc241d",
-      success: "#98971a",
-      warning: "#d65d0e",
-      accent: "#83a598",
-    },
-  },
-  onedark: {
-    name: "onedark",
-    label: "One Dark",
-    colors: {
-      bg: "#282c34",
-      bgSecondary: "#21252b",
-      bgTertiary: "#333842",
-      surface: "#3e4451",
-      border: "#4b5263",
-      text: "#abb2bf",
-      textSecondary: "#c8ccd4",
-      textMuted: "#636d83",
-      primary: "#61afef",
-      primaryText: "#282c34",
-      secondary: "#c678dd",
-      danger: "#e06c75",
-      success: "#98c379",
-      warning: "#e5c07b",
-      accent: "#56b6c2",
-    },
-  },
-  catppuccin: {
-    name: "catppuccin",
-    label: "Catppuccin Mocha",
-    colors: {
-      bg: "#1e1e2e",
-      bgSecondary: "#181825",
-      bgTertiary: "#313244",
-      surface: "#45475a",
-      border: "#585b70",
-      text: "#cdd6f4",
-      textSecondary: "#bac2de",
-      textMuted: "#6c7086",
-      primary: "#89b4fa",
-      primaryText: "#1e1e2e",
-      secondary: "#cba6f7",
-      danger: "#f38ba8",
-      success: "#a6e3a1",
-      warning: "#f9e2af",
-      accent: "#94e2d5",
-    },
-  },
-};
-
-export const defaultTheme: ThemeName = "tokyo";

mobile/constants/types.ts

@@ -1,404 +0,0 @@
-// Types derived from real OpenCode serve OpenAPI spec (v1.18.3)
-// Endpoint prefix: /api/
-
-// ── Health ──
-export interface HealthResponse {
-  healthy: boolean;
-  version: string;
-}
-
-// ── Config ──
-export interface OpenCodeConfig {
-  $schema?: string;
-  theme?: string;
-  provider?: Record<string, ProviderConfig>;
-  model?: Record<string, string>;
-  command?: Record<string, string>;
-  plugin?: Record<string, unknown>;
-  mcp?: Record<string, unknown>;
-  share?: unknown;
-  experimental?: unknown;
-}
-
-export interface ProviderConfig {
-  api?: string;
-  apiKey?: string;
-  models?: Record<string, unknown>;
-  options?: Record<string, unknown>;
-}
-
-// ── Provider ──
-export interface Provider {
-  id: string;
-  name: string;
-  api?: string;
-  auth?: ProviderAuth;
-  models?: Model[];
-  env?: Record<string, string>;
-}
-
-export interface ProviderAuth {
-  type: "api_key" | "oauth";
-  api_key?: { env?: string; header?: string };
-  oauth?: { authorize_url: string; token_url: string; scopes: string[] };
-}
-
-// ── Model ──
-export interface Model {
-  id: string;
-  name: string;
-  providerID: string;
-  context?: number;
-  maxTokens?: number;
-  reasoning?: boolean;
-  config?: Record<string, unknown>;
-}
-
-// ── Session ──
-export interface Session {
-  id: string;
-  parentID?: string;
-  title: string;
-  agent?: string;
-  model?: string;
-  status: "idle" | "busy" | "error";
-  directory: string;
-  createdAt: string;
-  updatedAt: string;
-}
-
-export interface SessionStatus {
-  busy: boolean;
-}
-
-/** Paginated list response from /api/session */
-export interface SessionListResponse {
-  data: Session[];
-  cursor?: {
-    previous?: string;
-    next?: string;
-  };
-}
-
-/** Model list response from /api/model */
-export interface ModelListResponse {
-  location?: {
-    directory?: string;
-    project?: { id: string; directory: string };
-  };
-  data: Model[];
-}
-
-// ── Message ──
-export interface Message {
-  id: string;
-  sessionID: string;
-  role: "user" | "assistant" | "tool" | "system";
-  parts: MessagePart[];
-  createdAt: string;
-}
-
-export type MessagePart =
-  | TextPart
-  | ToolPart
-  | StepPart
-  | ReasoningPart
-  | SourcePart;
-
-export interface TextPart {
-  type: "text";
-  text: string;
-}
-
-export interface ToolPart {
-  type: "tool";
-  tool: string;
-  state: "call" | "result" | "error";
-  callID: string;
-  input?: Record<string, unknown>;
-  output?: string;
-  title?: string;
-  metadata?: Record<string, unknown>;
-}
-
-export interface StepPart {
-  type: "step";
-  name: string;
-  state: "pending" | "running" | "completed" | "error";
-}
-
-export interface ReasoningPart {
-  type: "reasoning";
-  text: string;
-}
-
-export interface SourcePart {
-  type: "source";
-  source: string;
-  title?: string;
-}
-
-// ── Events (SSE) ──
-export type ServerEvent =
-  | SessionCreatedEvent
-  | SessionUpdatedEvent
-  | SessionDeletedEvent
-  | MessageCreatedEvent
-  | MessageUpdatedEvent
-  | MessagePartUpdatedEvent
-  | MessagePartDeletedEvent
-  | PermissionRequestedEvent
-  | PermissionUpdatedEvent
-  | QuestionAskedEvent
-  | QuestionAnsweredEvent
-  | FileChangedEvent
-  | TodoUpdatedEvent
-  | SyncEvent
-  | ErrorEvent;
-
-export interface SessionCreatedEvent {
-  type: "session.created";
-  properties: Session;
-}
-
-export interface SessionUpdatedEvent {
-  type: "session.updated";
-  properties: Partial<Session> & { id: string };
-}
-
-export interface SessionDeletedEvent {
-  type: "session.deleted";
-  properties: { id: string };
-}
-
-export interface MessageCreatedEvent {
-  type: "message.created";
-  properties: Message;
-}
-
-export interface MessageUpdatedEvent {
-  type: "message.updated";
-  properties: Partial<Message> & { id: string };
-}
-
-export interface MessagePartUpdatedEvent {
-  type: "message.part.updated";
-  properties: {
-    messageID: string;
-    part: MessagePart;
-    sessionID: string;
-  };
-}
-
-export interface MessagePartDeletedEvent {
-  type: "message.part.deleted";
-  properties: {
-    messageID: string;
-    partID: string;
-    sessionID: string;
-  };
-}
-
-export interface PermissionRequestedEvent {
-  type: "permission.requested";
-  properties: PermissionRequest;
-}
-
-export interface PermissionUpdatedEvent {
-  type: "permission.updated";
-  properties: PermissionRequest;
-}
-
-export interface QuestionAskedEvent {
-  type: "question.asked";
-  properties: QuestionRequest;
-}
-
-export interface QuestionAnsweredEvent {
-  type: "question.answered";
-  properties: QuestionRequest;
-}
-
-export interface FileChangedEvent {
-  type: "file.changed";
-  properties: { path: string; status: string };
-}
-
-export interface TodoUpdatedEvent {
-  type: "todo.updated";
-  properties: { sessionID: string; todos: Todo[] };
-}
-
-export interface SyncEvent {
-  type: "sync";
-  properties: Record<string, unknown>;
-}
-
-export interface ErrorEvent {
-  type: "error";
-  properties: { message: string; code?: string };
-}
-
-// ── Permission ──
-export interface PermissionRequest {
-  id: string;
-  sessionID: string;
-  messageID?: string;
-  partID?: string;
-  permission: string;
-  description?: string;
-  state: "pending" | "approved" | "denied";
-  createdAt: string;
-}
-
-export interface SavedPermission {
-  id: string;
-  permission: string;
-  pattern?: string;
-  allow: boolean;
-}
-
-// ── Question ──
-export interface QuestionRequest {
-  id: string;
-  sessionID: string;
-  question: string;
-  options?: string[];
-  state: "pending" | "answered" | "rejected";
-  answer?: string;
-  createdAt: string;
-}
-
-// ── Todo ──
-export interface Todo {
-  id: string;
-  content: string;
-  status: "pending" | "in_progress" | "completed";
-  metadata?: Record<string, unknown>;
-}
-
-// ── File ──
-export interface FileEntry {
-  name: string;
-  path: string;
-  type: "file" | "directory";
-  size?: number;
-  modified?: string;
-}
-
-export interface FileContent {
-  content: string;
-  encoding?: string;
-}
-
-export interface FileStatus {
-  path: string;
-  status: string;
-}
-
-// ── Find/Search ──
-export interface FindResult {
-  file: string;
-  line: number;
-  column: number;
-  match: string;
-  context: string;
-}
-
-export interface SymbolResult {
-  name: string;
-  kind: string;
-  file: string;
-  line: number;
-  column: number;
-}
-
-// ── PTY ──
-export interface PTY {
-  id: string;
-  shell: string;
-  cwd: string;
-  pid?: number;
-  createdAt: string;
-}
-
-// ── Command ──
-export interface Command {
-  name: string;
-  description?: string;
-  category?: string;
-}
-
-// ── Skill ──
-export interface Skill {
-  name: string;
-  description?: string;
-  location?: string;
-}
-
-// ── Agent ──
-export interface Agent {
-  name: string;
-  description?: string;
-  tools?: string[];
-}
-
-// ── Diff ──
-export interface DiffEntry {
-  path: string;
-  status: string;
-  additions: number;
-  deletions: number;
-  hunks?: DiffHunk[];
-}
-
-export interface DiffHunk {
-  oldStart: number;
-  newStart: number;
-  oldLines: number;
-  newLines: number;
-  content: string;
-}
-
-// ── VCS ──
-export interface VCSStatus {
-  branch: string;
-  dirty: boolean;
-  ahead: number;
-  behind: number;
-}
-
-// ── Context helpers ──
-export interface SessionContext {
-  files: string[];
-  capabilities: string[];
-}
-
-export interface SessionHistory {
-  messages: Message[];
-}
-
-// ── Theme ──
-export type ThemeName = "tokyo" | "dracula" | "nord" | "gruvbox" | "onedark" | "catppuccin";
-
-export interface Theme {
-  name: ThemeName;
-  label: string;
-  colors: {
-    bg: string;
-    bgSecondary: string;
-    bgTertiary: string;
-    surface: string;
-    border: string;
-    text: string;
-    textSecondary: string;
-    textMuted: string;
-    primary: string;
-    primaryText: string;
-    secondary: string;
-    danger: string;
-    success: string;
-    warning: string;
-    accent: string;
-  };
-}

mobile/hooks/useApi.ts

@@ -1,322 +0,0 @@
-import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
-import * as api from "../lib/api";
-
-// ── Health ──
-
-export function useHealth() {
-  return useQuery({
-    queryKey: ["health"],
-    queryFn: api.getHealth,
-    refetchInterval: 10000,
-    retry: 3,
-  });
-}
-
-// ── Config ──
-
-export function useConfig() {
-  return useQuery({
-    queryKey: ["config"],
-    queryFn: api.getConfig,
-  });
-}
-
-export function usePatchConfig() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: api.patchConfig,
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["config"] }),
-  });
-}
-
-// ── Sessions ──
-
-export function useSessions() {
-  return useQuery({
-    queryKey: ["sessions"],
-    queryFn: api.getSessions,
-  });
-}
-
-export function useActiveSessions() {
-  return useQuery({
-    queryKey: ["sessions", "active"],
-    queryFn: api.getActiveSessions,
-  });
-}
-
-export function useSession(id: string) {
-  return useQuery({
-    queryKey: ["session", id],
-    queryFn: () => api.getSession(id),
-    enabled: !!id,
-  });
-}
-
-export function useCreateSession() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (options?: { title?: string; agent?: string; model?: string; directory?: string }) =>
-      api.createSession(options),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["sessions"] }),
-  });
-}
-
-export function useDeleteSession() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (id: string) => api.deleteSession(id),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["sessions"] }),
-  });
-}
-
-export function usePatchSession() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: ({ id, data }: { id: string; data: { title?: string; agent?: string; model?: string } }) =>
-      api.patchSession(id, data),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["sessions"] }),
-  });
-}
-
-export function useSessionTodos(sessionId: string) {
-  return useQuery({
-    queryKey: ["todos", sessionId],
-    queryFn: () => api.getSessionTodos(sessionId),
-    enabled: !!sessionId,
-  });
-}
-
-// ── Messages ──
-
-export function useMessages(sessionId: string) {
-  return useQuery({
-    queryKey: ["messages", sessionId],
-    queryFn: () => api.getMessages(sessionId),
-    enabled: !!sessionId,
-  });
-}
-
-export function useSendMessage() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: ({ sessionId, content }: { sessionId: string; content: string }) =>
-      api.sendMessage(sessionId, content),
-    onSuccess: (_, vars) => {
-      qc.invalidateQueries({ queryKey: ["messages", vars.sessionId] });
-      qc.invalidateQueries({ queryKey: ["sessions"] });
-    },
-  });
-}
-
-export function useAbortSession() {
-  return useMutation({
-    mutationFn: (sessionId: string) => api.abortSession(sessionId),
-  });
-}
-
-export function useCompactSession() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (sessionId: string) => api.compactSession(sessionId),
-    onSuccess: (_, sessionId) => {
-      qc.invalidateQueries({ queryKey: ["messages", sessionId] });
-    },
-  });
-}
-
-export function useShareSession() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (sessionId: string) => api.shareSession(sessionId),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["sessions"] }),
-  });
-}
-
-export function useForkSession() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (sessionId: string) => api.forkSession(sessionId),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["sessions"] }),
-  });
-}
-
-// ── Session diff / revert ──
-
-export function useSessionDiff(sessionId: string) {
-  return useQuery({
-    queryKey: ["diff", sessionId],
-    queryFn: () => api.getSessionDiff(sessionId),
-    enabled: !!sessionId,
-  });
-}
-
-// ── Permissions ──
-
-export function usePermissionRequests() {
-  return useQuery({
-    queryKey: ["permissions", "requests"],
-    queryFn: api.getPermissionRequests,
-    refetchInterval: 5000,
-  });
-}
-
-export function useSavedPermissions() {
-  return useQuery({
-    queryKey: ["permissions", "saved"],
-    queryFn: api.getSavedPermissions,
-  });
-}
-
-export function useReplyPermission() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: ({
-      sessionId,
-      requestId,
-      allow,
-    }: {
-      sessionId: string;
-      requestId: string;
-      allow: boolean;
-    }) => api.replyPermission(sessionId, requestId, allow),
-    onSuccess: () => {
-      qc.invalidateQueries({ queryKey: ["permissions"] });
-    },
-  });
-}
-
-// ── Questions ──
-
-export function useQuestionRequests() {
-  return useQuery({
-    queryKey: ["questions", "requests"],
-    queryFn: api.getQuestionRequests,
-    refetchInterval: 5000,
-  });
-}
-
-export function useReplyQuestion() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: ({
-      sessionId,
-      requestId,
-      answer,
-    }: {
-      sessionId: string;
-      requestId: string;
-      answer: string;
-    }) => api.replyQuestion(sessionId, requestId, answer),
-    onSuccess: () => {
-      qc.invalidateQueries({ queryKey: ["questions"] });
-    },
-  });
-}
-
-// ── Providers / Models ──
-
-export function useProviders() {
-  return useQuery({
-    queryKey: ["providers"],
-    queryFn: api.getProviders,
-  });
-}
-
-export function useModels() {
-  return useQuery({
-    queryKey: ["models"],
-    queryFn: api.getModels,
-  });
-}
-
-// ── Agent / Command / Skill ──
-
-export function useAgents() {
-  return useQuery({
-    queryKey: ["agents"],
-    queryFn: api.getAgents,
-  });
-}
-
-export function useCommands() {
-  return useQuery({
-    queryKey: ["commands"],
-    queryFn: api.getCommands,
-  });
-}
-
-export function useSkills() {
-  return useQuery({
-    queryKey: ["skills"],
-    queryFn: api.getSkills,
-  });
-}
-
-// ── Files ──
-
-export function useListFiles(dir: string = ".") {
-  return useQuery({
-    queryKey: ["files", dir],
-    queryFn: () => api.listFiles(dir),
-  });
-}
-
-export function useFileContent(path: string) {
-  return useQuery({
-    queryKey: ["fileContent", path],
-    queryFn: () => api.readFile(path),
-    enabled: !!path,
-  });
-}
-
-export function useFindFiles(query: string, dir?: string) {
-  return useQuery({
-    queryKey: ["findFiles", query, dir],
-    queryFn: () => api.findFiles(query, dir),
-    enabled: query.length > 0,
-  });
-}
-
-export function useFindSymbols(query: string) {
-  return useQuery({
-    queryKey: ["findSymbols", query],
-    queryFn: () => api.findSymbols(query),
-    enabled: query.length > 0,
-  });
-}
-
-// ── VCS ──
-
-export function useVCSStatus() {
-  return useQuery({
-    queryKey: ["vcs"],
-    queryFn: api.getVCSStatus,
-    refetchInterval: 15000,
-  });
-}
-
-// ── PTY ──
-
-export function usePTYs() {
-  return useQuery({
-    queryKey: ["pty"],
-    queryFn: api.getPTYs,
-  });
-}
-
-export function useCreatePTY() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (shell?: string) => api.createPTY(shell),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["pty"] }),
-  });
-}
-
-export function useDeletePTY() {
-  const qc = useQueryClient();
-  return useMutation({
-    mutationFn: (id: string) => api.deletePTY(id),
-    onSuccess: () => qc.invalidateQueries({ queryKey: ["pty"] }),
-  });
-}

mobile/hooks/useConnection.ts

@@ -1,65 +0,0 @@
-import { useState, useEffect, useCallback, useRef } from "react";
-import {
-  getConnectionManager,
-  type ConnectionState,
-} from "../lib/connection-manager";
-import type { ServerEvent } from "../constants/types";
-
-export interface UseConnectionReturn {
-  state: ConnectionState;
-  connect: (sessionId?: string) => void;
-  disconnect: () => void;
-  switchSession: (sessionId: string | null) => void;
-  isConnected: boolean;
-}
-
-export function useConnection(sessionId?: string): UseConnectionReturn {
-  const [state, setState] = useState<ConnectionState>("disconnected");
-  const manager = useRef(getConnectionManager());
-
-  useEffect(() => {
-    const unsub = manager.current.onStateChange(setState);
-    return unsub;
-  }, []);
-
-  // Auto-connect on mount
-  useEffect(() => {
-    manager.current.connect(sessionId);
-    return () => {
-      // Don't disconnect on unmount — keep connection alive
-    };
-  }, [sessionId]);
-
-  const connect = useCallback(
-    (sid?: string) => manager.current.connect(sid ?? sessionId),
-    [sessionId]
-  );
-
-  const disconnect = useCallback(() => manager.current.disconnect(), []);
-
-  const switchSession = useCallback(
-    (sid: string | null) => manager.current.switchSession(sid),
-    []
-  );
-
-  return {
-    state,
-    connect,
-    disconnect,
-    switchSession,
-    isConnected: state === "connected",
-  };
-}
-
-export function useConnectionEvents(
-  onEvent: (event: ServerEvent) => void
-) {
-  const callbackRef = useRef(onEvent);
-  callbackRef.current = onEvent;
-
-  useEffect(() => {
-    const manager = getConnectionManager();
-    const unsub = manager.onEvent((event) => callbackRef.current(event));
-    return unsub;
-  }, []);
-}

mobile/hooks/useSSE.ts

@@ -1,156 +0,0 @@
-import { useState, useCallback, useRef, useEffect } from "react";
-import { subscribeEvents, parseSSELines } from "../lib/api";
-import type { ServerEvent, Message, MessagePart } from "../constants/types";
-
-export interface SSEState {
-  connected: boolean;
-  streaming: boolean;
-  error: string | null;
-  events: ServerEvent[];
-}
-
-export function useSSE(sessionId?: string) {
-  const [state, setState] = useState<SSEState>({
-    connected: false,
-    streaming: false,
-    error: null,
-    events: [],
-  });
-
-  const abortRef = useRef<AbortController | null>(null);
-  const bufferRef = useRef("");
-  const reconnectTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
-
-  const connect = useCallback(async () => {
-    setState((s) => ({ ...s, error: null }));
-
-    try {
-      const response = await subscribeEvents(sessionId);
-      abortRef.current = new AbortController();
-      setState((s) => ({ ...s, connected: true, streaming: true }));
-
-      const reader = response.body?.getReader();
-      if (!reader) throw new Error("No readable stream");
-
-      const decoder = new TextDecoder();
-
-      while (true) {
-        const { done, value } = await reader.read();
-        if (done) break;
-
-        bufferRef.current += decoder.decode(value, { stream: true });
-        const { events, remaining } = parseSSELines(bufferRef.current);
-        bufferRef.current = remaining;
-
-        if (events.length > 0) {
-          setState((s) => ({
-            ...s,
-            events: [...s.events, ...events],
-          }));
-        }
-      }
-
-      setState((s) => ({ ...s, connected: false, streaming: false }));
-    } catch (err: unknown) {
-      if (err instanceof Error && err.name !== "AbortError") {
-        setState((s) => ({
-          ...s,
-          connected: false,
-          streaming: false,
-          error: err.message,
-        }));
-      }
-    }
-  }, [sessionId]);
-
-  const disconnect = useCallback(() => {
-    abortRef.current?.abort();
-    if (reconnectTimer.current) {
-      clearTimeout(reconnectTimer.current);
-    }
-    setState({ connected: false, streaming: false, error: null, events: [] });
-  }, []);
-
-  const clearEvents = useCallback(() => {
-    setState((s) => ({ ...s, events: [] }));
-  }, []);
-
-  // Auto-reconnect on disconnect
-  useEffect(() => {
-    if (!state.connected && !state.streaming && sessionId) {
-      reconnectTimer.current = setTimeout(() => {
-        connect();
-      }, 3000);
-    }
-    return () => {
-      if (reconnectTimer.current) clearTimeout(reconnectTimer.current);
-    };
-  }, [state.connected, state.streaming, sessionId, connect]);
-
-  // Cleanup on unmount
-  useEffect(() => {
-    return () => {
-      abortRef.current?.abort();
-    };
-  }, []);
-
-  return {
-    ...state,
-    connect,
-    disconnect,
-    clearEvents,
-  };
-}
-
-// ── Derived helpers ──
-
-/** Extract the latest assistant message from events */
-export function getLatestAssistantMessage(events: ServerEvent[]): Message | null {
-  for (let i = events.length - 1; i >= 0; i--) {
-    const ev = events[i];
-    if (ev.type === "message.created" || ev.type === "message.updated") {
-      const msg = ev.properties as Message;
-      if (msg.role === "assistant") return msg;
-    }
-  }
-  return null;
-}
-
-/** Extract all messages from events in order */
-export function getMessagesFromEvents(events: ServerEvent[]): Message[] {
-  const map = new Map<string, Message>();
-
-  for (const ev of events) {
-    if (ev.type === "message.created") {
-      const msg = ev.properties as Message;
-      map.set(msg.id, msg);
-    } else if (ev.type === "message.updated") {
-      const partial = ev.properties as Partial<Message> & { id: string };
-      const existing = map.get(partial.id);
-      if (existing) {
-        map.set(partial.id, { ...existing, ...partial });
-      }
-    } else if (ev.type === "message.part.updated") {
-      const { messageID, part } = ev.properties as {
-        messageID: string;
-        part: MessagePart;
-        sessionID: string;
-      };
-      const existing = map.get(messageID);
-      if (existing) {
-        const partIdx = existing.parts.findIndex(
-          (p) => JSON.stringify(p) === JSON.stringify(part)
-        );
-        const newParts = [...existing.parts];
-        if (partIdx >= 0) {
-          newParts[partIdx] = part;
-        } else {
-          newParts.push(part);
-        }
-        map.set(messageID, { ...existing, parts: newParts });
-      }
-    }
-  }
-
-  return Array.from(map.values());
-}

mobile/lib/api.ts

@@ -1,434 +0,0 @@
-import { getServerUrl, getAuthHeader, setServerUrl as persistServerUrl, setCredentials, clearAuth, setAuthType, setAuthValue } from "./storage";
-import type { AuthType } from "./storage";
-import type {
-  HealthResponse,
-  Session,
-  SessionStatus,
-  SessionListResponse,
-  Message,
-  MessagePart,
-  OpenCodeConfig,
-  Provider,
-  Model,
-  ModelListResponse,
-  FileEntry,
-  FileContent,
-  FindResult,
-  SymbolResult,
-  PTY,
-  Command,
-  Skill,
-  Agent,
-  DiffEntry,
-  VCSStatus,
-  PermissionRequest,
-  SavedPermission,
-  QuestionRequest,
-  Todo,
-  ServerEvent,
-} from "../constants/types";
-
-// ── Base request helper ──
-
-async function request<T>(
-  path: string,
-  options?: RequestInit
-): Promise<T> {
-  const base = getServerUrl();
-  const authHeaders = getAuthHeader();
-  const headers: Record<string, string> = {
-    "Content-Type": "application/json",
-    ...authHeaders,
-    ...((options?.headers as Record<string, string>) || {}),
-  };
-
-  const res = await fetch(`${base}${path}`, {
-    ...options,
-    headers,
-  });
-
-  if (!res.ok) {
-    const text = await res.text();
-    throw new Error(text || `HTTP ${res.status} ${res.statusText}`);
-  }
-
-  const contentType = res.headers.get("content-type") || "";
-  if (contentType.includes("application/json")) {
-    return res.json();
-  }
-  return res.text() as unknown as T;
-}
-
-/** Extract data array from { location, data } or { data } response */
-function extractData<T>(response: { data?: T[] } | T[]): T[] {
-  if (Array.isArray(response)) return response;
-  return response.data || [];
-}
-
-// ── Server URL / Credentials ──
-
-export function setServerUrl(url: string) {
-  persistServerUrl(url);
-}
-
-export function setServerCredentials(username: string, password: string) {
-  setCredentials(username, password);
-}
-
-// ── Health ──
-
-export function getHealth(): Promise<HealthResponse> {
-  return request("/api/health");
-}
-
-// ── Config ── (root endpoint, not /api/)
-
-export function getConfig(): Promise<OpenCodeConfig> {
-  return request("/config");
-}
-
-export function patchConfig(config: Partial<OpenCodeConfig>): Promise<void> {
-  return request("/config", { method: "PATCH", body: JSON.stringify(config) });
-}
-
-// ── Sessions ──
-
-export function getSessions(): Promise<Session[]> {
-  return request("/session");
-}
-
-export function getActiveSessions(): Promise<Session[]> {
-  return request("/session/active");
-}
-
-export function getSession(id: string): Promise<Session> {
-  return request(`/session/${id}`);
-}
-
-/** Get session via /api/ — returns {data: Session} */
-export function getSessionApi(id: string): Promise<Session> {
-  return request<{ data: Session }>(`/api/session/${id}`).then((r) => r.data);
-}
-
-export function createSession(options?: {
-  title?: string;
-  agent?: string;
-  model?: string;
-  directory?: string;
-}): Promise<Session> {
-  return request("/session", {
-    method: "POST",
-    body: JSON.stringify(options || {}),
-  });
-}
-
-export function deleteSession(id: string): Promise<void> {
-  return request(`/session/${id}`, { method: "DELETE" });
-}
-
-export function patchSession(
-  id: string,
-  data: { title?: string; agent?: string; model?: string }
-): Promise<Session> {
-  return request(`/session/${id}`, {
-    method: "PATCH",
-    body: JSON.stringify(data),
-  });
-}
-
-export function getSessionStatus(id: string): Promise<SessionStatus> {
-  return request(`/session/${id}`);
-}
-
-export function getSessionChildren(id: string): Promise<Session[]> {
-  return request<Session[]>(`/session/${id}/children`).catch(() => []);
-}
-
-export function getSessionTodos(id: string): Promise<Todo[]> {
-  return request(`/session/${id}/todo`);
-}
-
-// ── Messages ──
-
-export function getMessages(sessionId: string): Promise<Message[]> {
-  return request(`/session/${sessionId}/message`);
-}
-
-export function getMessage(sessionId: string, messageId: string): Promise<Message> {
-  return request(`/session/${sessionId}/message/${messageId}`);
-}
-
-export function deleteMessage(sessionId: string, messageId: string): Promise<void> {
-  return request(`/session/${sessionId}/message/${messageId}`, {
-    method: "DELETE",
-  });
-}
-
-// ── Send message (triggers SSE response) ──
-
-export interface MessageResponse {
-  info: {
-    id: string;
-    parentID?: string;
-    role: string;
-    sessionID: string;
-    modelID?: string;
-    providerID?: string;
-    time?: { created: number; completed?: number };
-    finish?: string;
-  };
-  parts: MessagePart[];
-}
-
-export function sendMessage(
-  sessionId: string,
-  content: string
-): Promise<MessageResponse> {
-  return request(`/session/${sessionId}/message`, {
-    method: "POST",
-    body: JSON.stringify({
-      parts: [{ type: "text", text: content }],
-    }),
-  });
-}
-
-// ── Session actions ──
-
-export function abortSession(sessionId: string): Promise<void> {
-  return request(`/session/${sessionId}/abort`, { method: "POST" });
-}
-
-export function initSession(sessionId: string): Promise<void> {
-  return request(`/session/${sessionId}/init`, { method: "POST" });
-}
-
-export function compactSession(sessionId: string): Promise<void> {
-  return request(`/session/${sessionId}/compact`, { method: "POST" });
-}
-
-export function summarizeSession(sessionId: string): Promise<void> {
-  return request(`/session/${sessionId}/summarize`, { method: "POST" });
-}
-
-export function shareSession(sessionId: string): Promise<{ url?: string }> {
-  return request(`/session/${sessionId}/share`, { method: "POST" });
-}
-
-export function forkSession(sessionId: string): Promise<Session> {
-  return request(`/session/${sessionId}/fork`, { method: "POST" });
-}
-
-// ── Session diff / revert ──
-
-export function getSessionDiff(sessionId: string): Promise<DiffEntry[]> {
-  return request(`/session/${sessionId}/diff`);
-}
-
-export function revertSessionStage(sessionId: string): Promise<void> {
-  return request(`/session/${sessionId}/revert`, { method: "POST" });
-}
-
-export function revertSessionClear(sessionId: string): Promise<void> {
-  return request(`/session/${sessionId}/unrevert`, { method: "POST" });
-}
-
-// ── Session history / context ──
-
-export function getSessionHistory(sessionId: string): Promise<{ messages: Message[] }> {
-  return request(`/session/${sessionId}/history`);
-}
-
-export function getSessionContext(sessionId: string): Promise<{ files: string[]; capabilities: string[] }> {
-  return request(`/session/${sessionId}/context`);
-}
-
-// ── Permissions ──
-
-export function getPermissionRequests(): Promise<PermissionRequest[]> {
-  return request("/permission");
-}
-
-export function getSavedPermissions(): Promise<SavedPermission[]> {
-  return request("/permission/saved");
-}
-
-export function deleteSavedPermission(id: string): Promise<void> {
-  return request(`/permission/saved/${id}`, { method: "DELETE" });
-}
-
-export function replyPermission(
-  sessionId: string,
-  requestId: string,
-  allow: boolean
-): Promise<void> {
-  return request(`/session/${sessionId}/permissions/${requestId}`, {
-    method: "POST",
-    body: JSON.stringify({ allow }),
-  });
-}
-
-// ── Questions ──
-
-export function getQuestionRequests(): Promise<QuestionRequest[]> {
-  return request("/question");
-}
-
-export function getSessionQuestions(sessionId: string): Promise<QuestionRequest[]> {
-  return request(`/session/${sessionId}/question`);
-}
-
-export function replyQuestion(
-  sessionId: string,
-  requestId: string,
-  answer: string
-): Promise<void> {
-  return request(`/question/${requestId}/reply`, {
-    method: "POST",
-    body: JSON.stringify({ answer }),
-  });
-}
-
-export function rejectQuestion(
-  sessionId: string,
-  requestId: string
-): Promise<void> {
-  return request(`/question/${requestId}/reject`, {
-    method: "POST",
-  });
-}
-
-// ── Providers ──
-
-export function getProviders(): Promise<Provider[]> {
-  return request<{ data: Provider[] }>("/api/provider").then((r) => r.data);
-}
-
-export function getProvider(id: string): Promise<Provider> {
-  return request(`/api/provider/${id}`);
-}
-
-// ── Models ──
-
-export function getModels(): Promise<Model[]> {
-  return request<{ data: Model[] }>("/api/model").then((r) => r.data);
-}
-
-// ── Agent / Command / Skill ──
-
-export function getAgents(): Promise<Agent[]> {
-  return request<{ data: Agent[] }>("/api/agent").then((r) => r.data);
-}
-
-export function getCommands(): Promise<Command[]> {
-  return request<{ data: Command[] }>("/api/command").then((r) => r.data);
-}
-
-export function getSkills(): Promise<Skill[]> {
-  return request<{ data: Skill[] }>("/api/skill").then((r) => r.data);
-}
-
-// ── Files ──
-
-export function listFiles(dir: string = "."): Promise<FileEntry[]> {
-  return request<{ data: FileEntry[] }>(`/api/fs/list?path=${encodeURIComponent(dir)}`).then((r) => r.data);
-}
-
-export function readFile(filePath: string): Promise<FileContent> {
-  return request(`/file/content?path=${encodeURIComponent(filePath)}`);
-}
-
-export function findFiles(query: string, dir?: string): Promise<FindResult[]> {
-  const params = new URLSearchParams({ query });
-  if (dir) params.set("path", dir);
-  return request(`/find/file?${params.toString()}`);
-}
-
-export function findSymbols(query: string): Promise<SymbolResult[]> {
-  return request(`/find/symbol?query=${encodeURIComponent(query)}`);
-}
-
-// ── VCS ──
-
-export function getVCSStatus(): Promise<VCSStatus> {
-  return request("/api/vcs/status");
-}
-
-// ── PTY ──
-
-export function getPTYs(): Promise<PTY[]> {
-  return request<{ data: PTY[] }>("/api/pty").then((r) => r.data);
-}
-
-export function createPTY(shell?: string): Promise<PTY> {
-  return request("/api/pty", {
-    method: "POST",
-    body: JSON.stringify({ shell }),
-  });
-}
-
-export function getPTY(id: string): Promise<PTY> {
-  return request(`/api/pty/${id}`);
-}
-
-export function deletePTY(id: string): Promise<void> {
-  return request(`/api/pty/${id}`, { method: "DELETE" });
-}
-
-export function getPTYConnectToken(id: string): Promise<{ token: string }> {
-  return request(`/api/pty/${id}/connect-token`, { method: "POST" });
-}
-
-// ── SSE Event Stream (returns raw Response for manual parsing) ──
-
-export async function subscribeEvents(
-  sessionId?: string
-): Promise<Response> {
-  const base = getServerUrl();
-  const authHeaders = getAuthHeader();
-  const url = sessionId
-    ? `${base}/session/${sessionId}/event`
-    : `${base}/event`;
-
-  const res = await fetch(url, {
-    headers: { Accept: "text/event-stream", ...authHeaders },
-  });
-
-  if (!res.ok) {
-    throw new Error(`SSE connection failed: ${res.status}`);
-  }
-
-  return res;
-}
-
-// ── SSE Parser helper ──
-
-export function parseSSELines(
-  buffer: string
-): { events: ServerEvent[]; remaining: string } {
-  const events: ServerEvent[] = [];
-  const lines = buffer.split("\n");
-  const remaining = lines.pop() || "";
-
-  let eventType = "";
-  let eventData = "";
-
-  for (const line of lines) {
-    if (line.startsWith("event: ")) {
-      eventType = line.slice(7).trim();
-    } else if (line.startsWith("data: ")) {
-      eventData = line.slice(6);
-    } else if (line === "") {
-      if (eventType && eventData) {
-        try {
-          events.push(JSON.parse(eventData) as ServerEvent);
-        } catch {
-          // skip malformed
-        }
-      }
-      eventType = "";
-      eventData = "";
-    }
-  }
-
-  return { events, remaining };
-}

mobile/lib/connection-manager.ts

@@ -1,285 +0,0 @@
-import { getHealth, subscribeEvents, parseSSELines } from "./api";
-import { getServerUrl, getCredentials } from "./storage";
-import type { ServerEvent } from "../constants/types";
-
-export type ConnectionState =
-  | "disconnected"
-  | "connecting"
-  | "connected"
-  | "reconnecting"
-  | "error";
-
-export type ConnectionListener = (state: ConnectionState) => void;
-export type EventListener = (event: ServerEvent) => void;
-
-interface ConnectionManagerOptions {
-  /** Max reconnect attempts before giving up (default: Infinity) */
-  maxRetries?: number;
-  /** Base delay in ms for exponential backoff (default: 1000) */
-  baseDelay?: number;
-  /** Max delay in ms (default: 30000) */
-  maxDelay?: number;
-  /** Health check interval in ms (default: 15000) */
-  heartbeatInterval?: number;
-  /** Timeout for health check in ms (default: 5000) */
-  healthTimeout?: number;
-}
-
-export class ConnectionManager {
-  private state: ConnectionState = "disconnected";
-  private retryCount = 0;
-  private maxRetries: number;
-  private baseDelay: number;
-  private maxDelay: number;
-  private heartbeatMs: number;
-  private healthTimeout: number;
-
-  private stateListeners: Set<ConnectionListener> = new Set();
-  private eventListeners: Set<EventListener> = new Set();
-
-  private heartbeatTimer: ReturnType<typeof setTimeout> | null = null;
-  private reconnectTimer: ReturnType<typeof setTimeout> | null = null;
-  private abortController: AbortController | null = null;
-  private sseBuffer = "";
-
-  /** Currently active SSE session subscription (null = global events) */
-  private activeSessionId: string | null = null;
-
-  constructor(options?: ConnectionManagerOptions) {
-    this.maxRetries = options?.maxRetries ?? Infinity;
-    this.baseDelay = options?.baseDelay ?? 1000;
-    this.maxDelay = options?.maxDelay ?? 30000;
-    this.heartbeatMs = options?.heartbeatInterval ?? 15000;
-    this.healthTimeout = options?.healthTimeout ?? 5000;
-  }
-
-  // ── State ──
-
-  getState(): ConnectionState {
-    return this.state;
-  }
-
-  isConnected(): boolean {
-    return this.state === "connected";
-  }
-
-  // ── Listeners ──
-
-  onStateChange(listener: ConnectionListener): () => void {
-    this.stateListeners.add(listener);
-    return () => this.stateListeners.delete(listener);
-  }
-
-  onEvent(listener: EventListener): () => void {
-    this.eventListeners.add(listener);
-    return () => this.eventListeners.delete(listener);
-  }
-
-  private setState(newState: ConnectionState) {
-    if (this.state === newState) return;
-    this.state = newState;
-    this.stateListeners.forEach((fn) => fn(newState));
-  }
-
-  private emitEvent(event: ServerEvent) {
-    this.eventListeners.forEach((fn) => fn(event));
-  }
-
-  // ── Connect ──
-
-  async connect(sessionId?: string) {
-    if (this.state === "connected" || this.state === "connecting") return;
-
-    this.activeSessionId = sessionId ?? null;
-    this.setState("connecting");
-
-    try {
-      await this.checkHealth();
-      this.retryCount = 0;
-      this.setState("connected");
-      this.startHeartbeat();
-      this.connectSSE();
-    } catch {
-      this.setState("error");
-      this.scheduleReconnect();
-    }
-  }
-
-  disconnect() {
-    this.stopHeartbeat();
-    this.stopReconnect();
-    this.abortController?.abort();
-    this.abortController = null;
-    this.sseBuffer = "";
-    this.retryCount = 0;
-    this.setState("disconnected");
-  }
-
-  // ── Health check ──
-
-  private async checkHealth(): Promise<void> {
-    const controller = new AbortController();
-    const timeout = setTimeout(() => controller.abort(), this.healthTimeout);
-
-    try {
-      const result = await Promise.race([
-        getHealth(),
-        new Promise<never>((_, reject) => {
-          controller.signal.addEventListener("abort", () =>
-            reject(new Error("Health check timeout"))
-          );
-        }),
-      ]);
-
-      clearTimeout(timeout);
-
-      if (!result.healthy) {
-        throw new Error("Server reports unhealthy");
-      }
-    } catch (err) {
-      clearTimeout(timeout);
-      throw err;
-    }
-  }
-
-  // ── Heartbeat ──
-
-  private startHeartbeat() {
-    this.stopHeartbeat();
-    this.heartbeatTimer = setInterval(async () => {
-      try {
-        await this.checkHealth();
-        // If we were in error state, recover
-        if (this.state === "error") {
-          this.retryCount = 0;
-          this.setState("connected");
-          this.connectSSE();
-        }
-      } catch {
-        if (this.state === "connected") {
-          this.setState("error");
-          this.scheduleReconnect();
-        }
-      }
-    }, this.heartbeatMs);
-  }
-
-  private stopHeartbeat() {
-    if (this.heartbeatTimer) {
-      clearInterval(this.heartbeatTimer);
-      this.heartbeatTimer = null;
-    }
-  }
-
-  // ── SSE ──
-
-  private connectSSE() {
-    this.abortController?.abort();
-    this.abortController = new AbortController();
-    this.sseBuffer = "";
-
-    const doConnect = async () => {
-      try {
-        const response = await subscribeEvents(this.activeSessionId ?? undefined);
-        const reader = response.body?.getReader();
-        if (!reader) throw new Error("No readable stream");
-
-        const decoder = new TextDecoder();
-
-        while (true) {
-          if (this.abortController?.signal.aborted) break;
-
-          const { done, value } = await reader.read();
-          if (done) break;
-
-          this.sseBuffer += decoder.decode(value, { stream: true });
-          const { events, remaining } = parseSSELines(this.sseBuffer);
-          this.sseBuffer = remaining;
-
-          for (const event of events) {
-            this.emitEvent(event);
-          }
-        }
-
-        // SSE ended normally — try reconnect
-        if (this.state === "connected") {
-          this.setState("error");
-          this.scheduleReconnect();
-        }
-      } catch (err) {
-        if (
-          this.abortController?.signal.aborted ||
-          this.state === "disconnected"
-        ) {
-          return;
-        }
-
-        console.warn("[ConnectionManager] SSE error:", err);
-        if (this.state === "connected") {
-          this.setState("error");
-          this.scheduleReconnect();
-        }
-      }
-    };
-
-    doConnect();
-  }
-
-  // ── Reconnect with exponential backoff ──
-
-  private scheduleReconnect() {
-    if (this.retryCount >= this.maxRetries) {
-      this.setState("disconnected");
-      return;
-    }
-
-    this.setState("reconnecting");
-
-    const delay = Math.min(
-      this.baseDelay * Math.pow(2, this.retryCount),
-      this.maxDelay
-    );
-    this.retryCount++;
-
-    this.reconnectTimer = setTimeout(() => {
-      this.connectSSE();
-      // Also check health
-      this.checkHealth()
-        .then(() => {
-          this.retryCount = 0;
-          this.setState("connected");
-        })
-        .catch(() => {
-          // Will retry again
-        });
-    }, delay);
-  }
-
-  private stopReconnect() {
-    if (this.reconnectTimer) {
-      clearTimeout(this.reconnectTimer);
-      this.reconnectTimer = null;
-    }
-  }
-
-  // ── Switch session subscription ──
-
-  switchSession(sessionId: string | null) {
-    if (this.activeSessionId === sessionId) return;
-    this.activeSessionId = sessionId;
-    if (this.state === "connected") {
-      this.connectSSE();
-    }
-  }
-}
-
-// ── Singleton ──
-
-let instance: ConnectionManager | null = null;
-
-export function getConnectionManager(options?: ConnectionManagerOptions): ConnectionManager {
-  if (!instance) {
-    instance = new ConnectionManager(options);
-  }
-  return instance;
-}

mobile/lib/query-provider.tsx

@@ -1,17 +0,0 @@
-import React from "react";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-
-const queryClient = new QueryClient({
-  defaultOptions: {
-    queries: {
-      staleTime: 5000,
-      refetchOnWindowFocus: false,
-    },
-  },
-});
-
-export function QueryProvider({ children }: { children: React.ReactNode }) {
-  return (
-    <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
-  );
-}

mobile/lib/storage.ts

@@ -1,134 +0,0 @@
-import AsyncStorage from "@react-native-async-storage/async-storage";
-import { ThemeName } from "../constants/types";
-
-export const storageKeys = {
-  serverUrl: "opencode_server_url",
-  authType: "opencode_auth_type",
-  authValue: "opencode_auth_value",
-  theme: "opencode_theme",
-  lastSessionId: "opencode_last_session_id",
-} as const;
-
-export type AuthType = "none" | "basic" | "bearer" | "apikey";
-
-const cache: Record<string, string | null> = {};
-
-async function get(key: string): Promise<string | null> {
-  if (cache[key] !== undefined) return cache[key];
-  const val = await AsyncStorage.getItem(key);
-  cache[key] = val;
-  return val;
-}
-
-async function set(key: string, value: string): Promise<void> {
-  cache[key] = value;
-  await AsyncStorage.setItem(key, value);
-}
-
-async function del(key: string): Promise<void> {
-  cache[key] = null;
-  await AsyncStorage.removeItem(key);
-}
-
-function getSync(key: string): string | null {
-  if (cache[key] !== undefined) return cache[key];
-  return null;
-}
-
-// Preload all keys on module load
-const _loaded = (async () => {
-  const entries = await AsyncStorage.multiGet(Object.values(storageKeys));
-  for (const [k, v] of entries) {
-    cache[k] = v;
-  }
-})();
-
-// ── Server URL ──
-
-export function getServerUrl(): string {
-  return getSync(storageKeys.serverUrl) || "http://127.0.0.1:4096";
-}
-
-export async function setServerUrl(url: string): Promise<void> {
-  await set(storageKeys.serverUrl, url);
-}
-
-// ── Auth ──
-
-export function getAuthType(): AuthType {
-  return (getSync(storageKeys.authType) as AuthType) || "none";
-}
-
-export async function setAuthType(type: AuthType): Promise<void> {
-  await set(storageKeys.authType, type);
-}
-
-export function getAuthValue(): string {
-  return getSync(storageKeys.authValue) || "";
-}
-
-export async function setAuthValue(value: string): Promise<void> {
-  await set(storageKeys.authValue, value);
-}
-
-export function getCredentials(): { username: string; password: string } {
-  const val = getAuthValue();
-  if (getAuthType() === "basic" && val.includes(":")) {
-    const [username, ...rest] = val.split(":");
-    return { username, password: rest.join(":") };
-  }
-  return { username: "", password: "" };
-}
-
-export async function setCredentials(username: string, password: string): Promise<void> {
-  await setAuthType("basic");
-  await setAuthValue(`${username}:${password}`);
-}
-
-export async function clearAuth(): Promise<void> {
-  await del(storageKeys.authType);
-  await del(storageKeys.authValue);
-}
-
-export function getAuthHeader(): Record<string, string> {
-  const type = getAuthType();
-  const value = getAuthValue();
-
-  if (!value) return {};
-
-  switch (type) {
-    case "basic": {
-      const creds = getCredentials();
-      if (creds.username) {
-        return { Authorization: `Basic ${btoa(`${creds.username}:${creds.password}`)}` };
-      }
-      return {};
-    }
-    case "bearer":
-      return { Authorization: `Bearer ${value}` };
-    case "apikey":
-      return { "X-API-Key": value };
-    default:
-      return {};
-  }
-}
-
-// ── Theme ──
-
-export function getTheme(): ThemeName {
-  return (getSync(storageKeys.theme) as ThemeName) || "tokyo";
-}
-
-export async function setTheme(theme: ThemeName): Promise<void> {
-  await set(storageKeys.theme, theme);
-}
-
-// ── Last session ──
-
-export function getLastSessionId(): string | undefined {
-  return getSync(storageKeys.lastSessionId) || undefined;
-}
-
-export async function setLastSessionId(id: string): Promise<void> {
-  await set(storageKeys.lastSessionId, id);
-}

mobile/package.json

@@ -1,38 +0,0 @@
-{
-  "name": "opencode-mobile",
-  "version": "1.0.0",
-  "main": "expo-router/entry",
-  "scripts": {
-    "start": "expo start",
-    "android": "expo start --android",
-    "ios": "expo start --ios",
-    "web": "expo start --web"
-  },
-  "dependencies": {
-    "@react-native-async-storage/async-storage": "2.1.2",
-    "@tanstack/react-query": "^5.60.6",
-    "expo": "~53.0.27",
-    "expo-asset": "~11.1.7",
-    "expo-constants": "~17.1.8",
-    "expo-font": "~13.3.2",
-    "expo-linking": "~7.1.7",
-    "expo-router": "~5.1.11",
-    "expo-secure-store": "~14.2.4",
-    "expo-splash-screen": "~0.30.10",
-    "expo-status-bar": "~2.2.3",
-    "expo-system-ui": "~5.0.11",
-    "lucide-react-native": "^0.460.0",
-    "react": "19.0.0",
-    "react-native": "0.79.6",
-    "react-native-gesture-handler": "~2.24.0",
-    "react-native-markdown-display": "^7.0.2",
-    "react-native-reanimated": "~3.17.4",
-    "react-native-safe-area-context": "5.4.0",
-    "react-native-screens": "~4.11.1",
-    "react-native-svg": "15.11.2"
-  },
-  "devDependencies": {
-    "@types/react": "~19.0.10",
-    "typescript": "~5.8.3"
-  }
-}

mobile/tests/integration.test.ts

@@ -1,251 +0,0 @@
-/**
- * End-to-end integration test for OpenCode Mobile client
- * Run against a live opencode serve instance
- *
- * Usage: npx tsx mobile/tests/integration.test.ts
- */
-
-const BASE = "http://127.0.0.1:4096";
-
-interface TestResult {
-  name: string;
-  passed: boolean;
-  error?: string;
-  duration: number;
-}
-
-const results: TestResult[] = [];
-
-async function test(name: string, fn: () => Promise<void>) {
-  const start = Date.now();
-  try {
-    await fn();
-    results.push({ name, passed: true, duration: Date.now() - start });
-    console.log(`  ✓ ${name} (${Date.now() - start}ms)`);
-  } catch (err: any) {
-    results.push({
-      name,
-      passed: false,
-      error: err.message,
-      duration: Date.now() - start,
-    });
-    console.log(`  ✗ ${name}: ${err.message}`);
-  }
-}
-
-function assert(condition: boolean, msg: string) {
-  if (!condition) throw new Error(msg);
-}
-
-async function api<T = any>(path: string, opts?: RequestInit): Promise<T> {
-  const res = await fetch(`${BASE}${path}`, {
-    headers: { "Content-Type": "application/json", ...opts?.headers },
-    ...opts,
-  });
-  if (!res.ok) throw new Error(`HTTP ${res.status}`);
-  return res.json();
-}
-
-// ── Tests ──
-
-async function run() {
-  console.log("\n=== OpenCode Integration Tests ===\n");
-
-  let sessionId: string;
-
-  // 1. Health
-  await test("GET /api/health", async () => {
-    const data = await api("/api/health");
-    assert(data.healthy === true, "not healthy");
-  });
-
-  // 2. Config (root endpoint — /api/config returns HTML)
-  await test("GET /config", async () => {
-    const data = await api("/config");
-    assert(typeof data === "object", "config is not object");
-  });
-
-  // 3. List sessions (root returns array)
-  await test("GET /session (list)", async () => {
-    const data = await api("/session");
-    assert(Array.isArray(data), "not array");
-  });
-
-  // 4. List sessions via /api/ (returns {data, cursor})
-  await test("GET /api/session (list)", async () => {
-    const data = await api("/api/session");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 5. Create session
-  await test("POST /session (create)", async () => {
-    const data = await api("/session", {
-      method: "POST",
-      body: JSON.stringify({ title: "Integration Test" }),
-    });
-    assert(data.id, "no id returned");
-    sessionId = data.id;
-  });
-
-  // 6. Get session (root)
-  await test("GET /session/{id}", async () => {
-    const data = await api(`/session/${sessionId}`);
-    assert(data.id === sessionId, "id mismatch");
-  });
-
-  // 7. Get session via /api/ (returns {data: Session})
-  await test("GET /api/session/{id}", async () => {
-    const data = await api(`/api/session/${sessionId}`);
-    assert(data.data?.id === sessionId, "id mismatch in data");
-  });
-
-  // 8. List messages (empty)
-  await test("GET /session/{id}/message (empty)", async () => {
-    const data = await api(`/session/${sessionId}/message`);
-    assert(Array.isArray(data), "not array");
-  });
-
-  // 9. Send message (requires {parts: [{type:'text', text:'...'}]})
-  await test("POST /session/{id}/message (send)", async () => {
-    const data = await api(`/session/${sessionId}/message`, {
-      method: "POST",
-      body: JSON.stringify({
-        parts: [{ type: "text", text: "Say exactly: integration test ok" }],
-      }),
-    });
-    assert(data.info || data.parts, "unexpected response shape");
-  });
-
-  // 10. SSE event stream (global endpoint)
-  await test("GET /event (SSE)", async () => {
-    const controller = new AbortController();
-    const timeout = setTimeout(() => controller.abort(), 4000);
-
-    const res = await fetch(`${BASE}/event`, {
-      headers: { Accept: "text/event-stream" },
-      signal: controller.signal,
-    });
-
-    clearTimeout(timeout);
-    assert(res.ok, `HTTP ${res.status}`);
-
-    const reader = res.body!.getReader();
-    const decoder = new TextDecoder();
-    let buffer = "";
-    let eventCount = 0;
-
-    const readTimeout = setTimeout(() => reader.cancel(), 3000);
-
-    while (eventCount < 1) {
-      const { done, value } = await reader.read();
-      if (done) break;
-      buffer += decoder.decode(value, { stream: true });
-      const lines = buffer.split("\n");
-      buffer = lines.pop() || "";
-      for (const line of lines) {
-        if (line.startsWith("data: ") || line.startsWith("event: ")) eventCount++;
-      }
-    }
-
-    clearTimeout(readTimeout);
-    reader.cancel();
-    assert(eventCount > 0, `no events (got ${eventCount})`);
-  });
-
-  // 11. Providers
-  await test("GET /api/provider", async () => {
-    const data = await api("/api/provider");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 12. Models
-  await test("GET /api/model", async () => {
-    const data = await api("/api/model");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 13. Agents
-  await test("GET /api/agent", async () => {
-    const data = await api("/api/agent");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 14. Commands
-  await test("GET /api/command", async () => {
-    const data = await api("/api/command");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 15. Skills
-  await test("GET /api/skill", async () => {
-    const data = await api("/api/skill");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 16. File list
-  await test("GET /api/fs/list", async () => {
-    const data = await api("/api/fs/list?path=.");
-    assert(Array.isArray(data.data), "data is not array");
-    assert(data.data.length > 0, "empty file list");
-  });
-
-  // 17. File content (root endpoint)
-  await test("GET /file/content", async () => {
-    const data = await api("/file/content?path=package.json");
-    assert(data.content || typeof data === "string", "no content");
-  });
-
-  // 18. Find files (root endpoint)
-  await test("GET /find/file", async () => {
-    const data = await api("/find/file?query=package");
-    assert(Array.isArray(data), "not array");
-  });
-
-  // 19. PTY list
-  await test("GET /api/pty", async () => {
-    const data = await api("/api/pty");
-    assert(Array.isArray(data.data), "data is not array");
-  });
-
-  // 20. VCS status
-  await test("GET /vcs/status", async () => {
-    const data = await api("/vcs/status");
-    assert(typeof data === "object", "not object");
-  });
-
-  // 21. Delete session
-  await test("DELETE /session/{id}", async () => {
-    await api(`/session/${sessionId}`, { method: "DELETE" });
-  });
-
-  // 22. Verify deleted
-  await test("GET /session/{id} after delete", async () => {
-    try {
-      await api(`/session/${sessionId}`);
-      assert(false, "should have thrown");
-    } catch {
-      // Expected
-    }
-  });
-
-  // Summary
-  console.log("\n=== Results ===\n");
-  const passed = results.filter((r) => r.passed).length;
-  const failed = results.filter((r) => !r.passed).length;
-  console.log(`  ${passed} passed, ${failed} failed out of ${results.length} tests`);
-
-  if (failed > 0) {
-    console.log("\n  Failed tests:");
-    results
-      .filter((r) => !r.passed)
-      .forEach((r) => console.log(`    - ${r.name}: ${r.error}`));
-  }
-
-  console.log("");
-  process.exit(failed > 0 ? 1 : 0);
-}
-
-run().catch((err) => {
-  console.error("Fatal:", err);
-  process.exit(1);
-});

mobile/tsconfig.json

@@ -1,15 +0,0 @@
-{
-  "extends": "expo/tsconfig.base",
-  "compilerOptions": {
-    "strict": true,
-    "paths": {
-      "@/*": [
-        "./*"
-      ]
-    }
-  },
-  "include": [
-    "**/*.ts",
-    "**/*.tsx"
-  ]
-}

nginx.conf

@@ -27,77 +27,7 @@ http {
         proxy_redirect ~^https?://[^/]+:4096/(.*)$ https://jishnupg-opencode-cli.hf.space/$1;
 
         # -------------------------------------------------------
-        # 1. OMNIROUTE AI GATEWAY (/omniroute, /v1, /_next, /assets)
-        # -------------------------------------------------------
-        location /omniroute/ {
-            proxy_pass http://127.0.0.1:20128/;
-            proxy_set_header Upgrade $http_upgrade;
-            proxy_set_header Connection "upgrade";
-            proxy_redirect /login /omniroute/login;
-            proxy_redirect /dashboard /omniroute/dashboard;
-            proxy_set_header Accept-Encoding "";
-            sub_filter_types text/javascript application/javascript application/json;
-            sub_filter 'href="/' 'href="/omniroute/';
-            sub_filter 'src="/' 'src="/omniroute/';
-            sub_filter 'action="/' 'action="/omniroute/';
-            sub_filter '="/_next/' '="/omniroute/_next/';
-            sub_filter '"/_next/' '"/omniroute/_next/';
-            sub_filter '="/assets/' '="/assets/';
-            sub_filter_once off;
-        }
-
-        location = /omniroute {
-            return 301 /omniroute/;
-        }
-
-        location /_next/ {
-            proxy_pass http://127.0.0.1:20128/_next/;
-        }
-
-        location /assets/ {
-            proxy_pass http://127.0.0.1:20128/assets/;
-        }
-
-        location /v1/ {
-            proxy_pass http://127.0.0.1:20128/v1/;
-        }
-
-        # -------------------------------------------------------
-        # 2. OPENCODE CLI SERVER (/server, /session, /project, etc.)
-        # -------------------------------------------------------
-        location /server/ {
-            proxy_pass http://127.0.0.1:4097/;
-            proxy_set_header Upgrade $http_upgrade;
-            proxy_set_header Connection "upgrade";
-            proxy_set_header Accept-Encoding "";
-            sub_filter_types text/javascript application/javascript;
-            sub_filter 'href="/' 'href="/server/';
-            sub_filter 'src="/' 'src="/server/';
-            sub_filter_once off;
-        }
-
-        location = /server {
-            return 301 /server/;
-        }
-
-        location /session    { proxy_pass http://127.0.0.1:4097; }
-        location /project    { proxy_pass http://127.0.0.1:4097; }
-        location /config     { proxy_pass http://127.0.0.1:4097; }
-        location /permission { proxy_pass http://127.0.0.1:4097; }
-        location /question   { proxy_pass http://127.0.0.1:4097; }
-        location /file       { proxy_pass http://127.0.0.1:4097; }
-        location /find       { proxy_pass http://127.0.0.1:4097; }
-        location /events     { proxy_pass http://127.0.0.1:4097; proxy_buffering off; }
-        location /event      { proxy_pass http://127.0.0.1:4097; proxy_buffering off; }
-
-        location /ws {
-            proxy_pass http://127.0.0.1:4097;
-            proxy_set_header Upgrade $http_upgrade;
-            proxy_set_header Connection "upgrade";
-        }
-
-        # -------------------------------------------------------
-        # 3. JELLYFIN MEDIA SERVER (/jellyfin)
+        # 1. JELLYFIN MEDIA SERVER (/jellyfin)
         # -------------------------------------------------------
         location /jellyfin/ {
             proxy_pass http://127.0.0.1:8096/;