@momo-kits/mcp-expo 1.0.3 → 2.0.0-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/mcp-expo",
-  "version": "1.0.3",
+  "version": "2.0.0-beta.2",
   "description": "MCP server: push AI-generated code to Expo and get LAN URL for Expo Go demo",
   "type": "module",
   "main": "server.mjs",
@@ -8,7 +8,8 @@
     "mcp-expo": "./server.mjs"
   },
   "scripts": {
-    "start": "node server.mjs"
+    "start": "node server.mjs",
+    "remote": "node remote-server.mjs"
   },
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.0.0"

package/remote-server.mjs

@@ -0,0 +1,313 @@
+#!/usr/bin/env node
+/**
+ * Remote Expo Server
+ *
+ * HTTP API chạy trên server (có sẵn Expo + dependencies).
+ * Nhận code từ MCP client, ghi vào App.tsx, chạy Metro, trả URL.
+ *
+ * Endpoints:
+ *   POST /push    - { code, reset? } → ghi App.tsx, start/reload Metro
+ *   POST /stop    - Dừng Metro
+ *   GET  /status  - Trạng thái Metro + Expo URL
+ *   GET  /health  - Health check
+ *
+ * Usage:
+ *   node remote-server.mjs                     # default port 3210
+ *   PORT=4000 node remote-server.mjs           # custom port
+ *   API_KEY=secret123 node remote-server.mjs   # with auth
+ */
+
+import http from 'http';
+import path from 'path';
+import fs from 'fs';
+import os from 'os';
+import { spawn } from 'child_process';
+import { fileURLToPath } from 'url';
+
+// ── Config ───────────────────────────────────────────────────────────────────
+
+const PORT = parseInt(process.env.PORT || '3210', 10);
+const API_KEY = process.env.API_KEY || ''; // empty = no auth
+const TEMPLATE_DIR = process.env.MCP_EXPO_TEMPLATE_DIR
+  || path.join(path.dirname(fileURLToPath(import.meta.url)), 'template');
+const APP_FILE = path.join(TEMPLATE_DIR, 'App.tsx');
+const METRO_START_TIMEOUT_MS = 90_000;
+
+// ── State ─────────────────────────────────────────────────────────────────────
+
+let metroProcess = null;
+let expoUrl = null;
+let isExpoRunning = false;
+
+// ── Helpers ───────────────────────────────────────────────────────────────────
+
+function log(...args) {
+  console.log(`[remote-expo ${new Date().toISOString()}]`, ...args);
+}
+
+function writeAppTsx(code) {
+  fs.writeFileSync(APP_FILE, code, 'utf8');
+  log(`Wrote App.tsx (${code.length} chars)`);
+}
+
+function getLocalIP() {
+  const nets = os.networkInterfaces();
+  for (const name of Object.keys(nets)) {
+    for (const net of nets[name]) {
+      if (net.family === 'IPv4' && !net.internal) {
+        return net.address;
+      }
+    }
+  }
+  return null;
+}
+
+function extractExpoUrl(line) {
+  const lanMatch = line.match(/(exp(?:o)?:\/\/(?:10\.\d+\.\d+.\d+|172\.(?:1[6-9]|2\d|3[01])\.\d+|\d+\.\d+\.\d+.\d+|192\.168\.\d+.\d+):\d+)/);
+  if (lanMatch) return lanMatch[1];
+  const expMatch = line.match(/(exp(?:o)?:\/\/[^\s]+)/);
+  if (expMatch) return expMatch[1];
+  const tunnelMatch = line.match(/(https?:\/\/[a-zA-Z0-9.-]+\.tunnel\.expo\.test)/);
+  if (tunnelMatch) return tunnelMatch[1];
+  return null;
+}
+
+function isMetroAlive() {
+  return metroProcess !== null && metroProcess.exitCode === null && !metroProcess.killed;
+}
+
+function stopMetro() {
+  if (!metroProcess) return;
+  metroProcess.kill('SIGTERM');
+  metroProcess = null;
+  isExpoRunning = false;
+  expoUrl = null;
+  log('Metro stopped.');
+}
+
+async function ensureDeps() {
+  const nodeModulesPath = path.join(TEMPLATE_DIR, 'node_modules');
+  if (!fs.existsSync(nodeModulesPath)) {
+    log('Installing template dependencies...');
+    await new Promise((res, rej) => {
+      const install = spawn('npm', ['install', '--silent'], { cwd: TEMPLATE_DIR, stdio: 'pipe' });
+      install.on('close', (code) => code === 0 ? res() : rej(new Error(`npm install failed (code ${code})`)));
+    });
+    log('Dependencies installed.');
+  }
+}
+
+async function startExpoMetro() {
+  await ensureDeps();
+
+  return new Promise((resolve, reject) => {
+    let settled = false;
+
+    const timer = setTimeout(() => {
+      if (!settled) {
+        settled = true;
+        reject(new Error(`Metro start timeout (${METRO_START_TIMEOUT_MS / 1000}s).`));
+      }
+    }, METRO_START_TIMEOUT_MS);
+
+    log(`Starting Expo Metro in ${TEMPLATE_DIR}...`);
+
+    metroProcess = spawn('npx', ['expo', 'start', '--lan', '--port', '8081'], {
+      cwd: TEMPLATE_DIR,
+      stdio: ['pipe', 'pipe', 'pipe'],
+      env: { ...process.env, FORCE_COLOR: '0' },
+    });
+
+    metroProcess.stdout.setEncoding('utf8');
+    metroProcess.stderr.setEncoding('utf8');
+
+    const onData = (streamName) => (data) => {
+      if (settled && streamName === 'stdout') return; // reduce noise after settled
+      const text = data.toString();
+      const lines = text.split('\n');
+      for (const line of lines) {
+        if (line.trim()) log(`[${streamName}]`, line.trim());
+
+        if (line.includes('Use port') && line.includes('?')) {
+          metroProcess.stdin.write('y\n');
+          log('[stdin] sent "y"');
+        }
+
+        if (!settled) {
+          const url = extractExpoUrl(line);
+          if (url) {
+            expoUrl = url;
+            settled = true;
+            clearTimeout(timer);
+            resolve(url);
+            return;
+          }
+          if (line.includes('Waiting on http://localhost:')) {
+            const localIP = getLocalIP();
+            if (localIP) {
+              expoUrl = `exp://${localIP}:8081`;
+              log(`Detected LAN IP: ${localIP} → ${expoUrl}`);
+              settled = true;
+              clearTimeout(timer);
+              resolve(expoUrl);
+              return;
+            }
+          }
+        }
+      }
+    };
+
+    metroProcess.stdout.on('data', onData('stdout'));
+    metroProcess.stderr.on('data', onData('stderr'));
+
+    metroProcess.on('error', (err) => {
+      if (!settled) { settled = true; clearTimeout(timer); reject(new Error(`Metro error: ${err.message}`)); }
+    });
+
+    metroProcess.on('exit', (code) => {
+      if (!settled) {
+        settled = true; clearTimeout(timer);
+        reject(new Error(`Metro exited unexpectedly (code ${code}).`));
+      } else {
+        isExpoRunning = false;
+        log(`Metro exited (code ${code}) — state reset.`);
+      }
+    });
+  });
+}
+
+// ── HTTP helpers ─────────────────────────────────────────────────────────────
+
+function readBody(req) {
+  return new Promise((resolve, reject) => {
+    let body = '';
+    req.on('data', (chunk) => { body += chunk; });
+    req.on('end', () => resolve(body));
+    req.on('error', reject);
+  });
+}
+
+function json(res, status, data) {
+  const payload = JSON.stringify(data);
+  res.writeHead(status, {
+    'Content-Type': 'application/json',
+    'Content-Length': Buffer.byteLength(payload),
+  });
+  res.end(payload);
+}
+
+function checkAuth(req, res) {
+  if (!API_KEY) return true;
+  const auth = req.headers['authorization'] || '';
+  if (auth === `Bearer ${API_KEY}`) return true;
+  json(res, 401, { ok: false, message: 'Unauthorized' });
+  return false;
+}
+
+// ── Routes ───────────────────────────────────────────────────────────────────
+
+async function handlePush(req, res) {
+  try {
+    const body = JSON.parse(await readBody(req));
+    const { code, reset = false } = body;
+
+    if (!code || typeof code !== 'string') {
+      return json(res, 400, { ok: false, message: 'Missing "code" field' });
+    }
+
+    writeAppTsx(code);
+
+    if (reset || !isMetroAlive()) {
+      stopMetro();
+      await startExpoMetro();
+      isExpoRunning = true;
+    } else {
+      log('Code updated — Metro running, HMR will reload.');
+    }
+
+    json(res, 200, {
+      ok: true,
+      message: isMetroAlive()
+        ? 'Code updated. App reloading via HMR.'
+        : 'Done. Scan QR with Expo Go.',
+      expoUrl,
+    });
+  } catch (err) {
+    log('Error in /push:', err.message);
+    json(res, 500, { ok: false, message: err.message });
+  }
+}
+
+async function handleStop(req, res) {
+  stopMetro();
+  json(res, 200, { ok: true, message: 'Metro stopped.' });
+}
+
+async function handleStatus(req, res) {
+  json(res, 200, {
+    isRunning: isMetroAlive(),
+    expoUrl,
+    pid: metroProcess ? metroProcess.pid : null,
+    templateDir: TEMPLATE_DIR,
+  });
+}
+
+async function handleHealth(req, res) {
+  json(res, 200, { ok: true, uptime: process.uptime() });
+}
+
+// ── HTTP Server ──────────────────────────────────────────────────────────────
+
+const server = http.createServer(async (req, res) => {
+  // CORS for convenience
+  res.setHeader('Access-Control-Allow-Origin', '*');
+  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
+  res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization');
+
+  if (req.method === 'OPTIONS') {
+    res.writeHead(204);
+    return res.end();
+  }
+
+  const url = new URL(req.url, `http://localhost:${PORT}`);
+  const route = `${req.method} ${url.pathname}`;
+
+  log(`→ ${route}`);
+
+  if (!checkAuth(req, res)) return;
+
+  try {
+    if (route === 'POST /push') return await handlePush(req, res);
+    if (route === 'POST /stop') return await handleStop(req, res);
+    if (route === 'GET /status') return await handleStatus(req, res);
+    if (route === 'GET /health') return await handleHealth(req, res);
+
+    json(res, 404, { ok: false, message: 'Not found' });
+  } catch (err) {
+    log('Unhandled error:', err);
+    json(res, 500, { ok: false, message: 'Internal server error' });
+  }
+});
+
+// ── Start ────────────────────────────────────────────────────────────────────
+
+server.listen(PORT, '0.0.0.0', () => {
+  log(`Remote Expo server listening on http://0.0.0.0:${PORT}`);
+  log(`Template dir: ${TEMPLATE_DIR}`);
+  if (API_KEY) log('Auth: API key required');
+  else log('Auth: disabled (set API_KEY env to enable)');
+  log('');
+  log('Endpoints:');
+  log(`  POST http://localhost:${PORT}/push   - Push code & run`);
+  log(`  POST http://localhost:${PORT}/stop   - Stop Metro`);
+  log(`  GET  http://localhost:${PORT}/status - Get status`);
+  log(`  GET  http://localhost:${PORT}/health - Health check`);
+  log('');
+  log('Expose via ngrok:');
+  log(`  ngrok http ${PORT}`);
+});
+
+// ── Graceful shutdown ─────────────────────────────────────────────────────────
+
+process.on('SIGTERM', () => { log('SIGTERM'); stopMetro(); process.exit(0); });
+process.on('SIGINT', () => { log('SIGINT'); stopMetro(); process.exit(0); });