Kernel Control Panel

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_223":224,"_225":226},"routes/_app.x.$handle.$name",{"_104":103,"_37":48,"_112":94,"_32":58,"_13":14,"_113":-5,"_11":114,"_115":116,"_117":118,"_119":120,"_121":122,"_26":-5,"_123":-5,"_124":-5,"_125":30,"_126":127,"_128":63,"_129":-5,"_130":-5,"_131":132},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_46":47,"_37":48,"_41":49,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":56,"_57":58,"_19":59,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":87,"_88":89,"_90":91,"_92":30},"version",15,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","e1c78555-49d5-4866-a2b0-f0307bd4e4b7","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":33,"_38":26,"_39":40,"_41":42,"_43":14,"_44":45,"_29":30},"previous","deleted",false,"deletedHere","path","utils.ts","latestPath","fileId","8609c42c-1f8b-11f1-97cf-42dde27851f2","name","fileType","content","/**\n * Utility functions for Kernel Control Panel\n * Handles storage, logging, and data management\n */\n\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\ninterface Profile {\n id: number;\n proxyId: string;\n cdpUrl: string;\n liveUrl?: string;\n timestamp: number;\n timeStr: string;\n}\n\ninterface LogEntry {\n id?: number;\n timestamp: string;\n level: \"INFO\" | \"ERROR\" | \"WARN\";\n message: string;\n}\n\n/**\n * Initialize database tables\n */\nexport async function initializeDatabase(): Promise {\n try {\n // Create profiles table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS profiles (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n proxy_id TEXT NOT NULL,\n cdp_url TEXT NOT NULL,\n live_url TEXT,\n timestamp REAL NOT NULL,\n time_str TEXT NOT NULL,\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n // Create logs table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS logs (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n timestamp TEXT NOT NULL,\n level TEXT NOT NULL,\n message TEXT NOT NULL,\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n console.log(\"✓ Database initialized\");\n } catch (error) {\n console.error(\"Error initializing database:\", error);\n }\n}\n\n/**\n * Save a profile to database\n */\nexport async function saveProfile(\n proxyId: string,\n cdpUrl: string,\n liveUrl?: string\n): Promise {\n const timestamp = Date.now();\n const timeStr = new Date().toLocaleTimeString();\n\n try {\n const result = await sqlite.execute({\n sql: `\n INSERT INTO profiles (proxy_id, cdp_url, live_url, timestamp, time_str)\n VALUES (?, ?, ?, ?, ?)\n `,\n args: [proxyId, cdpUrl, liveUrl || null, timestamp, timeStr],\n });\n\n const profile: Profile = {\n id: Number(result.lastInsertRowid) || 0,\n proxyId,\n cdpUrl,\n liveUrl,\n timestamp,\n timeStr,\n };\n\n return profile;\n } catch (error) {\n console.error(\"Error saving profile:\", error);\n throw error;\n }\n}\n\n/**\n * Get all profiles, sorted by timestamp descending\n */\nexport async function getProfiles(): Promise {\n try {\n const result = await sqlite.execute(`\n SELECT id, proxy_id, cdp_url, live_url, timestamp, time_str\n FROM profiles\n ORDER BY timestamp DESC\n LIMIT 50\n `);\n\n return result.rows.map((row) => ({\n id: row.id as number,\n proxyId: row.proxy_id as string,\n cdpUrl: row.cdp_url as string,\n liveUrl: row.live_url as string | undefined,\n timestamp: row.timestamp as number,\n timeStr: row.time_str as string,\n }));\n } catch (error) {\n console.error(\"Error getting profiles:\", error);\n return [];\n }\n}\n\n/**\n * Delete a profile by ID\n */\nexport async function deleteProfile(id: number): Promise {\n try {\n await sqlite.execute({\n sql: \"DELETE FROM profiles WHERE id = ?\",\n args: [id],\n });\n return true;\n } catch (error) {\n console.error(\"Error deleting profile:\", error);\n return false;\n }\n}\n\n/**\n * Log a message to database\n */\nexport async function logMessage(\n level: \"INFO\" | \"ERROR\" | \"WARN\",\n message: string\n): Promise {\n const timestamp = new Date().toISOString();\n\n try {\n await sqlite.execute({\n sql: `\n INSERT INTO logs (timestamp, level, message)\n VALUES (?, ?, ?)\n `,\n args: [timestamp, level, message],\n });\n } catch (error) {\n console.error(\"Error logging message:\", error);\n }\n}\n\n/**\n * Get recent logs\n */\nexport async function getLogs(limit: number = 100): Promise {\n try {\n const result = await sqlite.execute(`\n SELECT id, timestamp, level, message\n FROM logs\n ORDER BY created_at DESC\n LIMIT ?\n `, [limit]);\n\n return (result.rows as Array<{\n id: number;\n timestamp: string;\n level: \"INFO\" | \"ERROR\" | \"WARN\";\n message: string;\n }>).reverse();\n } catch (error) {\n console.error(\"Error getting logs:\", error);\n return [];\n }\n}\n\n/**\n * Clear old logs (older than N days)\n */\nexport async function clearOldLogs(daysOld: number = 7): Promise {\n try {\n const cutoffDate = new Date(Date.now() - daysOld * 24 * 60 * 60 * 1000);\n\n const result = await sqlite.execute({\n sql: `\n DELETE FROM logs\n WHERE created_at < ?\n `,\n args: [cutoffDate.toISOString()],\n });\n\n return result.rowsAffected || 0;\n } catch (error) {\n console.error(\"Error clearing logs:\", error);\n return 0;\n }\n}\n\n/**\n * Format a date to readable string\n */\nexport function formatDate(timestamp: number): string {\n const date = new Date(timestamp);\n return date.toLocaleTimeString(\"en-US\", {\n hour: \"2-digit\",\n minute: \"2-digit\",\n second: \"2-digit\",\n });\n}\n\n/**\n * Truncate string for display\n */\nexport function truncate(str: string, length: number = 16): string {\n return str.length > length ? str.slice(0, length) + \"...\" : str;\n}\n\n/**\n * Validate proxy ID format\n */\nexport function isValidProxyId(proxyId: string): boolean {\n return /^proxy_[a-zA-Z0-9]+$/.test(proxyId) || proxyId.length > 8;\n}\n\n/**\n * Generate a unique session ID\n */\nexport function generateSessionId(): string {\n return `session_${Date.now()}_${Math.random().toString(36).slice(2, 9)}`;\n}\n","createdAt",["D",1773481953466],"branchVersion","branchId","defea1e8-1f8a-11f1-9dea-42dde27851f2","id","defde8f2-1f8a-11f1-9dea-42dde27851f2","kernel",["D",1773481673231],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Kernel Control Panel - Web UI for proxy & browser management","imageUrl","","019ceb5c-6caf-756b-adbd-4861b5ab6dee","pinnedFileId","7388d0b8-1f8b-11f1-9f3b-42dde27851f2","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019ceb5c-6caf-756b-adbd-4c6cbb08afaf","tursoName","defde8f21f8a11f19dea42dde27851f2","tursoHostname","defde8f21f8a11f19dea42dde27851f2-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789528252206],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_104":103,"_111":107},"org",{"_104":103,"_105":-5,"_106":107,"_19":59,"_108":109,"_110":30},"branch",{"_13":93,"_37":94,"_46":45,"_95":47,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":48,"_102":103},"isOwned",22,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","buonhayvui1404","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzNBdlp1NXpMS3Zra3JwR0lZQkRoTlpNNUw2USJ9","tier","free","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_46":47,"_37":48,"_41":218,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":56,"_57":58,"_19":59,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":67,"_68":69,"_70":71,"_72":73,"_74":219,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":220,"_88":221,"_90":222,"_92":30},"tree",[193,194,195,196,197,198],"files",[193,194,195,196,197,198],"counts",{"_182":67,"_183":184,"_185":67,"_186":187,"_188":189},"contents",[133,134,135,136,137,138],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_46":175,"_37":176,"_35":177,"_140":-5,"_44":45,"_43":178,"_141":63,"_41":179,"_13":67,"_38":26,"_39":180,"_29":30,"_143":-5,"_32":181},{"_46":167,"_37":168,"_35":169,"_140":-5,"_44":45,"_43":170,"_141":63,"_41":171,"_13":172,"_38":26,"_39":173,"_29":30,"_143":-5,"_32":174},{"_46":160,"_37":161,"_35":162,"_140":-5,"_44":45,"_43":163,"_141":63,"_41":164,"_13":67,"_38":26,"_39":165,"_29":30,"_143":-5,"_32":166},{"_46":152,"_37":153,"_35":154,"_140":-5,"_44":45,"_43":155,"_141":63,"_41":156,"_13":157,"_38":26,"_39":158,"_29":30,"_143":-5,"_32":159},{"_46":145,"_37":146,"_35":61,"_140":-5,"_44":45,"_43":147,"_141":30,"_41":148,"_13":67,"_38":149,"_39":150,"_29":30,"_143":-5,"_32":151},{"_46":139,"_37":33,"_35":36,"_140":-5,"_44":45,"_43":14,"_141":63,"_41":142,"_13":67,"_38":26,"_39":40,"_29":30,"_143":-5,"_32":144},"8609c396-1f8b-11f1-97cf-42dde27851f2","parentId","latest",["D",1773481953466],"label",[33],"7388d018-1f8b-11f1-9f3b-42dde27851f2","main.ts",12,["D",1773481922437],"http","export default async function(req: Request): Promise {\n const method = req.method;\n const url = new URL(req.url);\n const path = url.pathname;\n\n // API Routes\n if (path === \"/api/create-proxy\" && method === \"POST\") {\n const body = await req.json();\n const { country = \"US\", region, city } = body;\n\n try {\n // TODO: Replace with actual Kernel API call\n // const proxy = await kernelClient.proxies.create({\n // type: \"residential\",\n // name: `tiktok_auto_proxy_${Date.now()}`,\n // config: { country, region, city }\n // });\n \n const proxyId = `proxy_${Date.now()}`;\n return Response.json({ \n success: true, \n proxyId, \n message: `Proxy created: ${proxyId}` \n });\n } catch (error) {\n return Response.json({ \n success: false, \n error: (error as Error).message \n }, { status: 500 });\n }\n }\n\n if (path === \"/api/create-browser\" && method === \"POST\") {\n const body = await req.json();\n const { proxyId } = body;\n\n try {\n // TODO: Replace with actual Kernel API call\n // const browser = await kernelClient.browsers.create({\n // proxy_id: proxyId,\n // headless: false,\n // stealth: true,\n // timeout_seconds: 3600\n // });\n \n const cdpUrl = `wss://cdp.example.com/${proxyId}`;\n const liveUrl = `https://live.example.com/${proxyId}`;\n return Response.json({ success: true, cdpUrl, liveUrl });\n } catch (error) {\n return Response.json({ \n success: false, \n error: (error as Error).message \n }, { status: 500 });\n }\n }\n\n if (path === \"/api/profiles\" && method === \"GET\") {\n // TODO: Load from database\n return Response.json({\n profiles: [\n { id: 1, proxyId: \"proxy_1742....\", time: \"10:30:45\", liveUrl: \"https://example.com\" },\n { id: 2, proxyId: \"proxy_1741....\", time: \"10:15:22\", liveUrl: \"https://example.com\" },\n ]\n });\n }\n\n // Main HTML UI\n const html = `\n\n\n \n \n Kernel Control Panel\n \n\n\n

\n \n\n

\n \n \n

\n\n

\n \n

🌍 Proxy Config

\n \n

\n Region\n \n

\n\n

\n City\n \n

\n\n

\n \n \n

\n\n

IDLE

\n\n

📋 System Logs

\n\n \n

\n \n

\n\n

\n\n \n\n\\`;\n\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html; charset=utf-8\" },\n });\n}\n",[146],"64d7d3ca-1f8b-11f1-a9a6-42dde27851f2","gui_app.py","06eae464-1f8b-11f1-a108-42dde27851f2",11,["D",1773481897785],4,"export default async function(req: Request): Promise {\n const method = req.method;\n const url = new URL(req.url);\n const path = url.pathname;\n\n // API Routes\n if (path === \"/api/create-proxy\" && method === \"POST\") {\n const body = await req.json();\n const { country = \"US\", region, city } = body;\n\n try {\n // Placeholder - replace with actual Kernel API call\n const proxyId = `proxy_${Date.now()}`;\n return Response.json({ success: true, proxyId, message: `Proxy created: ${proxyId}` });\n } catch (error) {\n return Response.json({ success: false, error: (error as Error).message }, { status: 500 });\n }\n }\n\n if (path === \"/api/create-browser\" && method === \"POST\") {\n const body = await req.json();\n const { proxyId } = body;\n\n try {\n // Placeholder - replace with actual Kernel API call\n const cdpUrl = `wss://cdp.example.com/${proxyId}`;\n const liveUrl = `https://live.example.com/${proxyId}`;\n return Response.json({ success: true, cdpUrl, liveUrl });\n } catch (error) {\n return Response.json({ success: false, error: (error as Error).message }, { status: 500 });\n }\n }\n\n if (path === \"/api/profiles\" && method === \"GET\") {\n // Placeholder - return sample profiles\n return Response.json({\n profiles: [\n { id: 1, proxyId: \"proxy_123...\", time: \"10:30:45\", liveUrl: \"https://example.com\" },\n { id: 2, proxyId: \"proxy_456...\", time: \"10:15:22\", liveUrl: \"https://example.com\" },\n ]\n });\n }\n\n // Main HTML Page\n const html = \\`\n\n\n \n \n TTS Kernel Control\n \n\n\n

\n \n\n

\n \n \n

\n\n

\n \n

⚙️ PROXY CONFIG

\n \n

\n Region (optional)\n \n

\n\n

\n City (optional)\n \n

\n\n

\n \n \n

\n\n

IDLE

\n\n

📋 LOGS

\n\n \n

\n \n

\n\n

\n\n \n\n\\`;\n\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html; charset=utf-8\" },\n });\n}\n",[153],"77777fbc-1f8b-11f1-9708-42dde27851f2","browser_manager.ts","7777805c-1f8b-11f1-9708-42dde27851f2",13,["D",1773481929034],"/**\n * Browser Manager - Handles proxy and browser creation via Kernel API\n * Convert Python code to TypeScript for Val Town\n */\n\ninterface ProxyConfig {\n country: string;\n region?: string;\n city?: string;\n}\n\ninterface BrowserSession {\n cdpUrl: string;\n liveViewUrl?: string;\n proxyId: string;\n createdAt: Date;\n}\n\nclass BrowserManager {\n private apiKey: string;\n private baseUrl: string = \"https://api.kernel.example.com\"; // Replace with actual Kernel API URL\n\n constructor(apiKey: string) {\n this.apiKey = apiKey;\n }\n\n /**\n * Creates a residential proxy with specific location\n */\n async createProxy(config: ProxyConfig): Promise {\n const locationInfo = `${config.country}${config.region ? `, ${config.region}` : \"\"}${config.city ? `, ${config.city}` : \"\"}`;\n \n console.log(`Creating Residential Proxy (${locationInfo})...`);\n\n try {\n const response = await fetch(`${this.baseUrl}/proxies`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Authorization\": `Bearer ${this.apiKey}`,\n },\n body: JSON.stringify({\n type: \"residential\",\n name: `tiktok_auto_proxy_${Date.now()}`,\n config: {\n country: config.country,\n ...(config.region && { region: config.region }),\n ...(config.city && { city: config.city }),\n },\n }),\n });\n\n if (!response.ok) {\n throw new Error(`HTTP ${response.status}: ${response.statusText}`);\n }\n\n const data = await response.json() as { id: string };\n console.log(`Proxy Created Successfully: ${data.id} (${locationInfo})`);\n return data.id;\n } catch (error) {\n console.error(`Error creating proxy: ${(error as Error).message}`);\n throw error;\n }\n }\n\n /**\n * Creates a browser session using the specified proxy\n */\n async createBrowserSession(proxyId: string): Promise {\n console.log(`Creating Browser Session with Proxy ID: ${proxyId}...`);\n\n try {\n const response = await fetch(`${this.baseUrl}/browsers`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Authorization\": `Bearer ${this.apiKey}`,\n },\n body: JSON.stringify({\n proxy_id: proxyId,\n headless: false,\n stealth: true,\n timeout_seconds: 3600,\n }),\n });\n\n if (!response.ok) {\n throw new Error(`HTTP ${response.status}: ${response.statusText}`);\n }\n\n const data = await response.json() as {\n cdp_ws_url: string;\n browser_live_view_url?: string;\n };\n\n console.log(`Browser Created. CDP URL: ${data.cdp_ws_url}`);\n\n const session: BrowserSession = {\n cdpUrl: data.cdp_ws_url,\n liveViewUrl: data.browser_live_view_url,\n proxyId,\n createdAt: new Date(),\n };\n\n if (data.browser_live_view_url) {\n console.log(`Live View: ${data.browser_live_view_url}`);\n }\n\n return session;\n } catch (error) {\n console.error(`Error creating browser session: ${(error as Error).message}`);\n throw error;\n }\n }\n}\n\nexport { BrowserManager, ProxyConfig, BrowserSession };\n",[161],"fdb7bf8e-1f8a-11f1-a35a-42dde27851f2","browser_manager.py","f0fdf916-1f8a-11f1-9dea-42dde27851f2",5,["D",1773481724769],3,"import logging\nimport time\nfrom kernel import Kernel\n\nlogger = logging.getLogger(__name__)\n\nclass BrowserManager:\n def __init__(self, api_key):\n self.client = Kernel(api_key=api_key)\n\n def create_proxy(self, country=\"US\", region=None, city=None):\n \"\"\"Creates a residential proxy with specific location.\"\"\"\n location_info = f\"{country}\"\n if region: location_info += f\", {region}\"\n if city: location_info += f\", {city}\"\n \n logger.info(f\"Creating Residential Proxy ({location_info})...\")\n try:\n config = {\"country\": country}\n if region:\n config[\"region\"] = region\n if city:\n config[\"city\"] = city\n \n proxy = self.client.proxies.create(\n type=\"residential\",\n name=f\"tiktok_auto_proxy_{int(time.time())}\",\n config=config\n )\n logger.info(f\"Proxy Created Successfully: {proxy.id} ({location_info})\")\n return proxy.id\n except Exception as e:\n logger.error(f\"Error creating proxy: {e}\")\n raise\n\n def create_browser_session(self, proxy_id):\n \"\"\"Creates a browser session using the specified proxy.\"\"\"\n logger.info(f\"Creating Browser Session with Proxy ID: {proxy_id}...\")\n try:\n browser = self.client.browsers.create(\n proxy_id=proxy_id,\n headless=False,\n stealth=True, # Enable Stealth Mode to avoid detection\n timeout_seconds=3600\n )\n logger.info(f\"Browser Created. CDP URL: {browser.cdp_ws_url}\")\n \n if hasattr(browser, 'browser_live_view_url'):\n logger.info(f\"Live View: {browser.browser_live_view_url}\")\n # Optional: Automatically open live view for debugging\n # import webbrowser\n # webbrowser.open(browser.browser_live_view_url)\n return browser.cdp_ws_url, browser.browser_live_view_url\n \n return browser.cdp_ws_url, None\n except Exception as e:\n logger.error(f\"Error creating browser session: {e}\")\n raise",[168],"8040b276-1f8b-11f1-9708-42dde27851f2","README.md","8040b3e8-1f8b-11f1-9708-42dde27851f2",14,["D",1773481943771],"# 🖥️ Kernel Control Panel\n\nMột giao diện điều khiển hiệu suất cao, nhỏ gọn và đẹp cho hệ thống Kernel TTS được chuyển đổi từ Python sang TypeScript cho Val Town.\n\n## ✨ Tính Năng\n\n- **⚙️ Control Tab**: Tạo proxy, khởi động hệ thống, xem logs theo thời gian thực\n- **📁 Profiles Tab**: Quản lý các phiên làm việc đã lưu\n- **🎨 Giao Diện Hiện Đại**: Theme dark mode với hiệu ứng neon green\n- **📱 Responsive**: Hoạt động tốt trên desktop và mobile\n- **⚡ Hiệu Suất Cao**: Chạy 100% trên Val Town serverless\n\n## 🚀 Cách Sử Dụng\n\n### 1. Truy Cập Giao Diện\n\nTruy cập endpoint HTTP của val:\n```\nhttps://buonhayvui1404--.web.val.run\n```\n\n### 2. Cấu Hình Proxy\n\n- Nhập `Region` (tùy chọn): e.g., \"California\"\n- Nhập `City` (tùy chọn): e.g., \"Los Angeles\"\n- Click **▶ START** để khởi động\n\n### 3. Xem Logs\n\nTất cả hoạt động sẽ được ghi nhật ký theo thời gian thực:\n- 🟢 `INFO` - Thông tin chung\n- 🔴 `ERROR` - Lỗi\n- 🟠 `WARN` - Cảnh báo\n\n### 4. Quản Lý Profiles\n\nTab **📁 PROFILES**:\n- **REFRESH**: Tải lại danh sách\n- **OPEN**: Mở live view trong trình duyệt\n- **DEL**: Xóa profile\n\n## 📋 Cấu Trúc File\n\n```\nkernel/\n├── main.ts # HTTP endpoint chính với giao diện UI\n├── browser_manager.ts # Quản lý proxy và browser sessions\n├── gui_app.py # File Python cũ (có thể xóa)\n├── browser_manager.py # File Python cũ (có thể xóa)\n└── README.md # File này\n```\n\n## 🔧 Tích Hợp API Kernel\n\nĐể tích hợp với API Kernel thực tế, cập nhật các phần sau:\n\n### 1. Trong `main.ts`, hàm `/api/create-proxy`:\n\n```typescript\n// Thay thế:\nconst proxyId = `proxy_${Date.now()}`;\n\n// Với:\nconst proxyRes = await fetch('https://api.kernel.com/proxies', {\n method: 'POST',\n headers: {\n 'Authorization': `Bearer ${Deno.env.get('KERNEL_API_KEY')}`,\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify({\n type: \"residential\",\n name: `tiktok_auto_${Date.now()}`,\n config: { country, region, city }\n })\n});\nconst proxy = await proxyRes.json();\nconst proxyId = proxy.id;\n```\n\n### 2. Thêm Environment Variables:\n\n```\nKERNEL_API_KEY: \n```\n\n### 3. Sử dụng BrowserManager:\n\n```typescript\nimport { BrowserManager } from \"./browser_manager.ts\";\n\nconst manager = new BrowserManager(Deno.env.get(\"KERNEL_API_KEY\")!);\nconst proxyId = await manager.createProxy({ country: \"US\", region, city });\nconst session = await manager.createBrowserSession(proxyId);\n```\n\n## 🎨 Tùy Chỉnh Giao Diện\n\nThay đổi màu sắc trong CSS:\n\n- **Primary Color**: `#00ff00` (neon green)\n- **Secondary Color**: `#1a1a2e` (dark blue)\n- **Background**: `#0f0f23` (dark black)\n- **Accent**: `#00aa00` (button green)\n\n## 📊 Logs Storage\n\nHiện tại logs được lưu trong memory. Để lưu trữ bền vững, sử dụng Val Town SQLite:\n\n```typescript\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nawait sqlite.execute(`\n CREATE TABLE IF NOT EXISTS logs (\n id INTEGER PRIMARY KEY,\n timestamp TEXT,\n level TEXT,\n message TEXT\n )\n`);\n```\n\n## 🔐 Bảo Mật\n\n- Tất cả API requests đều được ghi log\n- Environment variables được bảo vệ bởi Val Town\n- Không lưu trữ credentials trong code\n\n## 📝 Changelog\n\n### v2.0 (Current)\n- ✅ Chuyển đổi từ Python tkinter sang Web UI\n- ✅ TypeScript + Deno runtime\n- ✅ Giao diện theme dark mode\n- ✅ Responsive design\n- ✅ Real-time logs\n\n### v1.0 (Legacy)\n- Python tkinter GUI application\n\n## 🆘 Troubleshooting\n\n### Giao diện không tải\n- Kiểm tra endpoint URL có chính xác không\n- Xóa cache trình duyệt (Ctrl+Shift+Del)\n\n### API không kết nối\n- Kiểm tra KERNEL_API_KEY environment variable\n- Xác nhận API endpoint URL\n\n### Logs không hiển thị\n- Kiểm tra browser console (F12)\n- Xem execution logs trên Val Town dashboard\n\n## 📞 Support\n\nCần giúp? Kiểm tra:\n- Val Town docs: https://docs.val.town\n- Browser Console (F12) cho error messages\n- Network tab để debug API calls\n\n---\n\n**Made with 💚 for Val Town**\n",[176],"pulls","branches",1,"forks","envVars",{"_190":184,"_192":67},"connections",{"_190":67,"_191":67},"count","unfilledCount","emptyCount",{"_46":175,"_37":176,"_35":177,"_140":-5,"_44":45,"_43":178,"_141":63,"_41":215,"_13":67,"_38":26,"_39":180,"_29":30,"_143":-5,"_200":216,"_32":217},{"_46":167,"_37":168,"_35":169,"_140":-5,"_44":45,"_43":170,"_141":63,"_41":212,"_13":172,"_38":26,"_39":173,"_29":30,"_143":-5,"_200":213,"_32":214},{"_46":160,"_37":161,"_35":162,"_140":-5,"_44":45,"_43":163,"_141":63,"_41":209,"_13":67,"_38":26,"_39":165,"_29":30,"_143":-5,"_200":210,"_32":211},{"_46":152,"_37":153,"_35":154,"_140":-5,"_44":45,"_43":155,"_141":63,"_41":206,"_13":157,"_38":26,"_39":158,"_29":30,"_143":-5,"_200":207,"_32":208},{"_46":145,"_37":146,"_35":61,"_140":-5,"_44":45,"_43":147,"_141":30,"_41":203,"_13":67,"_38":149,"_39":150,"_29":30,"_143":-5,"_200":204,"_32":205},{"_46":139,"_37":33,"_35":36,"_140":-5,"_44":45,"_43":14,"_141":63,"_41":199,"_13":67,"_38":26,"_39":40,"_29":30,"_143":-5,"_200":201,"_32":202},["D",1773481953466],"children",[],[33],["D",1773481922437],[],[146],["D",1773481897785],[],[153],["D",1773481929034],[],[161],["D",1773481724769],[],[168],["D",1773481943771],[],[176],["D",1773481673231],["D",1789528252206],{"_104":103,"_111":107},{"_104":103,"_105":-5,"_106":107,"_19":59,"_108":109,"_110":30},{"_13":93,"_37":94,"_46":45,"_95":47,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":48,"_102":103},"ctx",{"_86":-5,"_130":256,"_257":258,"_259":260,"_261":30,"_262":30,"_263":30,"_264":63,"_265":-5,"_266":-7,"_267":-7,"_268":67,"_269":30,"_270":30,"_271":-5,"_272":30,"_273":30,"_274":30,"_275":-5},"ENV",{"_227":228,"_229":230,"_231":94,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247,"_248":249,"_250":251,"_252":253,"_254":255},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v15