Kernel Control Panel

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_250":251,"_252":253},"routes/_app.x.$handle.$name",{"_106":105,"_38":51,"_114":96,"_33":61,"_13":14,"_115":-5,"_11":116,"_117":118,"_119":120,"_121":122,"_123":124,"_26":-5,"_125":-5,"_126":-5,"_127":31,"_128":129,"_130":65,"_131":-5,"_132":-5,"_133":134},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_49":50,"_38":51,"_44":52,"_53":-5,"_54":31,"_55":56,"_57":56,"_58":59,"_60":61,"_19":62,"_63":37,"_64":65,"_66":-5,"_67":-5,"_68":69,"_70":71,"_72":73,"_74":75,"_76":77,"_78":-5,"_79":80,"_81":80,"_82":83,"_84":83,"_85":83,"_86":80,"_87":80,"_88":89,"_90":91,"_92":93,"_94":31},"version",19,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","8a3f8148-86be-4c31-a98b-3a332fb36550","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":29,"_30":31,"_32":31,"_33":34,"_35":34},"file",{"_36":37,"_38":34,"_39":40,"_41":43,"_44":45,"_46":14,"_47":48,"_30":31},"previous",{"_36":37,"_38":34,"_39":40,"_41":42},"deleted",false,"deletedHere","path","main.ts","latestPath","fileId","7388d0b8-1f8b-11f1-9f3b-42dde27851f2","name","fileType","http","content","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 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 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 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 return new Response(getHTML(), {\n headers: { \"Content-Type\": \"text/html; charset=utf-8\" },\n });\n}\n\nfunction getHTML(): string {\n return `\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","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: Create Proxy\n if (path === \"/api/create-proxy\" && method === \"POST\") {\n try {\n const body = await req.json() as { country?: string; region?: string; city?: string };\n const { country = \"US\", region = \"\", city = \"\" } = body;\n \n // Mock response\n const proxyId = `proxy_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;\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: String(error) \n }, { status: 400 });\n }\n }\n\n // API: Create Browser\n if (path === \"/api/create-browser\" && method === \"POST\") {\n try {\n const body = await req.json() as { proxyId?: string };\n const { proxyId = \"unknown\" } = body;\n \n // Mock response\n const cdpUrl = `wss://cdp.kernel.example.com/session/${proxyId}`;\n const liveUrl = `https://live.kernel.example.com/view/${proxyId}`;\n return Response.json({ \n success: true, \n cdpUrl, \n liveUrl \n });\n } catch (error) {\n return Response.json({ \n success: false, \n error: String(error) \n }, { status: 400 });\n }\n }\n\n // API: Get Profiles\n if (path === \"/api/profiles\" && method === \"GET\") {\n const profiles = [\n { \n id: 1, \n proxyId: \"proxy_1742142857_a1b2c3\", \n time: new Date(Date.now() - 3600000).toLocaleTimeString(), \n liveUrl: \"https://live.kernel.example.com/view/1\" \n },\n { \n id: 2, \n proxyId: \"proxy_1742142800_d4e5f6\", \n time: new Date(Date.now() - 1800000).toLocaleTimeString(), \n liveUrl: \"https://live.kernel.example.com/view/2\" \n },\n ];\n return Response.json({ profiles });\n }\n\n // Serve HTML UI\n const html = `\n\n\n \n \n 🖥️ Kernel Control Panel\n \n\n\n

\n \n

\n \n \n

🌍 Proxy Config

\n Region\n \n

\n City\n \n

\n \n \n

IDLE

📋 Logs

\n \n

\n \n\n`;\n\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html; charset=utf-8\" },\n });\n}\n","createdAt",["D",1773482382223],"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","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",{"_106":105,"_113":109},"org",{"_106":105,"_107":-5,"_108":109,"_19":62,"_110":111,"_112":31},"branch",{"_13":95,"_38":96,"_49":48,"_97":50,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":-5,"_103":51,"_104":105},"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",{"_49":50,"_38":51,"_44":245,"_53":-5,"_54":31,"_55":56,"_57":56,"_58":59,"_60":61,"_19":62,"_63":37,"_64":65,"_66":-5,"_67":-5,"_68":69,"_70":71,"_72":73,"_74":75,"_76":246,"_78":-5,"_79":80,"_81":80,"_82":83,"_84":83,"_85":83,"_86":80,"_87":80,"_88":247,"_90":248,"_92":249,"_94":31},"tree",[212,213,214,215,216,217,218,219],"files",[212,213,214,215,216,217,218,219],"counts",{"_201":69,"_202":203,"_204":69,"_205":206,"_207":208},"contents",[135,136,137,138,139,140,141,142],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_49":194,"_38":195,"_36":196,"_146":-5,"_47":48,"_46":197,"_148":65,"_44":198,"_13":69,"_39":26,"_41":199,"_30":31,"_151":-5,"_33":200},{"_49":187,"_38":188,"_36":189,"_146":-5,"_47":48,"_46":190,"_148":65,"_44":191,"_13":69,"_39":26,"_41":192,"_30":31,"_151":-5,"_33":193},{"_49":180,"_38":181,"_36":182,"_146":-5,"_47":48,"_46":183,"_148":65,"_44":184,"_13":69,"_39":26,"_41":185,"_30":31,"_151":-5,"_33":186},{"_49":172,"_38":173,"_36":174,"_146":-5,"_47":48,"_46":175,"_148":65,"_44":176,"_13":177,"_39":26,"_41":178,"_30":31,"_151":-5,"_33":179},{"_49":165,"_38":166,"_36":167,"_146":-5,"_47":48,"_46":168,"_148":65,"_44":169,"_13":69,"_39":26,"_41":170,"_30":31,"_151":-5,"_33":171},{"_49":157,"_38":158,"_36":159,"_146":-5,"_47":48,"_46":160,"_148":65,"_44":161,"_13":162,"_39":26,"_41":163,"_30":31,"_151":-5,"_33":164},{"_49":153,"_38":34,"_36":37,"_146":-5,"_47":48,"_46":14,"_148":31,"_44":154,"_13":155,"_39":40,"_41":43,"_30":31,"_151":-5,"_33":156},{"_49":143,"_38":144,"_36":145,"_146":-5,"_47":48,"_46":147,"_148":65,"_44":149,"_13":69,"_39":26,"_41":150,"_30":31,"_151":-5,"_33":152},"8609c396-1f8b-11f1-97cf-42dde27851f2","utils.ts","8609c42c-1f8b-11f1-97cf-42dde27851f2","parentId",15,"latest",["D",1773481953466],"/**\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","label",[144],"859773da-1f8c-11f1-bdc6-42dde27851f2",["D",1773482382223],2,[34],"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",[158],"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",[166],"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",[173],"b6b8e170-1f8b-11f1-9232-42dde27851f2","SETUP.md","b6b8e224-1f8b-11f1-9232-42dde27851f2",18,["D",1773482035158],"# 🚀 Setup & Deployment Guide\n\n## ✅ Đã Hoàn Thành\n\nKernel Control Panel đã được **nâng cấp thành công** từ Python Tkinter sang TypeScript/Web!\n\n### 📁 Cấu Trúc Dự Án\n\n```\nbuonhayvui1404/kernel/\n├── main.ts # ⭐ HTTP endpoint chính (giao diện web)\n├── browser_manager.ts # TypeScript class quản lý proxy/browser\n├── utils.ts # Helper functions & database operations\n├── README.md # Tài liệu đầy đủ\n├── QUICKSTART.md # Hướng dẫn nhanh\n├── SETUP.md # File này\n├── gui_app.py # (Cũ - có thể xóa)\n└── browser_manager.py # (Cũ - có thể xóa)\n```\n\n## 🌐 Truy Cập Live\n\n**Endpoint URL:**\n```\nhttps://buonhayvui1404--7388d0b81f8b11f19f3b42dde27851f2.web.val.run\n```\n\n### Tính Năng Giao Diện\n\n✅ **CONTROL Tab**\n- ⚙️ Cấu hình proxy (Region, City)\n- ▶️ Nút START - Khởi động hệ thống\n- ⏹️ Nút STOP - Dừng hệ thống\n- 📊 Status indicator (IDLE, RUNNING, ERROR)\n- 📋 Real-time system logs\n\n✅ **PROFILES Tab**\n- 🔄 Refresh danh sách profiles\n- 📂 Hiển thị proxy sessions đã tạo\n- 🔗 OPEN - Mở live view\n- 🗑️ DEL - Xóa profile\n\n✅ **Giao Diện Design**\n- 🎨 Theme Dark Mode (Neon Green)\n- 📱 Responsive (Desktop + Mobile)\n- ⚡ Smooth Animations\n- 🔌 Zero Dependencies (Pure HTML/CSS/JS)\n\n## 🔧 Tích Hợp với API Kernel\n\n### Option 1: Sử dụng BrowserManager Class\n\n```typescript\nimport { BrowserManager } from \"./browser_manager.ts\";\n\nconst apiKey = Deno.env.get(\"KERNEL_API_KEY\");\nconst manager = new BrowserManager(apiKey);\n\n// Tạo proxy\nconst proxyId = await manager.createProxy({\n country: \"US\",\n region: \"California\",\n city: \"Los Angeles\"\n});\n\n// Tạo browser session\nconst session = await manager.createBrowserSession(proxyId);\nconsole.log(session.liveViewUrl); // Live view URL\n```\n\n### Option 2: Direct API Call\n\n```typescript\nconst response = 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: `proxy_${Date.now()}`,\n config: { country: \"US\", region, city }\n })\n});\n```\n\n## 💾 Database Setup\n\nĐể lưu trữ profiles & logs bền vững, sử dụng SQLite:\n\n### Khởi Tạo Database\n\n```typescript\nimport { initializeDatabase, saveProfile, getProfiles } from \"./utils.ts\";\n\n// Gọi một lần khi app start\nawait initializeDatabase();\n```\n\n### Lưu Profile\n\n```typescript\nawait saveProfile(proxyId, cdpUrl, liveViewUrl);\n```\n\n### Lấy Profiles\n\n```typescript\nconst profiles = await getProfiles(); // Mảng profiles\n```\n\n### Xóa Profile\n\n```typescript\nawait deleteProfile(profileId);\n```\n\n## 🔐 Environment Variables\n\nCấu hình trong Val Town settings:\n\n| Key | Value | Mô Tả |\n|-----|-------|-------|\n| `KERNEL_API_KEY` | `your-api-key` | API key từ Kernel |\n| `KERNEL_API_URL` | `https://api.kernel.com` | (Tùy chọn) |\n| `PROXY_TIMEOUT` | `3600` | (Tùy chọn) Timeout proxy |\n\n## 📊 API Endpoints\n\n### GET /\nTrả về HTML giao diện chính\n\n### POST /api/create-proxy\nTạo proxy mới\n\n**Request:**\n```json\n{\n \"country\": \"US\",\n \"region\": \"California\",\n \"city\": \"Los Angeles\"\n}\n```\n\n**Response:**\n```json\n{\n \"success\": true,\n \"proxyId\": \"proxy_1742123456789\"\n}\n```\n\n### POST /api/create-browser\nTạo browser session\n\n**Request:**\n```json\n{\n \"proxyId\": \"proxy_1742123456789\"\n}\n```\n\n**Response:**\n```json\n{\n \"success\": true,\n \"cdpUrl\": \"wss://cdp.kernel.com/...\",\n \"liveUrl\": \"https://live.kernel.com/...\"\n}\n```\n\n### GET /api/profiles\nLấy danh sách profiles\n\n**Response:**\n```json\n{\n \"profiles\": [\n {\n \"id\": 1,\n \"proxyId\": \"proxy_...\",\n \"time\": \"10:30:45\",\n \"liveUrl\": \"https://...\"\n }\n ]\n}\n```\n\n## 🎯 Customization\n\n### Thay đổi Màu Sắc\n\nTrong `getHTML()` function, tìm section `

Diff · v19