create-walle 0.2.1 → 0.3.1

package/bin/create-walle.js

@@ -81,7 +81,8 @@ function install(targetDir) {
   const ownerName = detectName().replace(/[\r\n=]/g, '').trim().slice(0, 200);
   const timezone = detectTimezone();
   const nameParts = ownerName.split(/\s+/);
-  const port = process.env.WALLE_PORT || '4567';
+  const port = process.env.CTM_PORT || '3456';
+  const wallePort = String(parseInt(port) + 1);
 
   console.log(`  ${DIM}Owner:    ${ownerName}${RESET}`);
   console.log(`  ${DIM}Timezone: ${timezone}${RESET}`);
@@ -110,6 +111,7 @@ function install(targetDir) {
     '# ANTHROPIC_API_KEY=sk-ant-...',
     '',
     `CTM_PORT=${port}`,
+    `WALL_E_PORT=${wallePort}`,
     '',
     '# SLACK_TOKEN=',
     '# SLACK_OWNER_USER_ID=',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-walle",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "description": "Set up Wall-E — your personal digital twin",
   "bin": {
     "create-walle": "bin/create-walle.js"

package/template/claude-task-manager/public/index.html

@@ -3792,6 +3792,7 @@ function startRenameReviewTitle(titleEl) {
       titleEl.textContent = newName;
       renderFilteredSessions();
       renderSessionList();
+      renderTabs();
     } else {
       titleEl.textContent = currentText;
     }
@@ -3836,6 +3837,7 @@ function startRenameRecentSession(sessionId, spanEl) {
     }
     renderFilteredSessions();
     renderSessionList();
+    renderTabs();
   }
 
   input.addEventListener('blur', finish);

package/template/claude-task-manager/public/setup.html

@@ -197,11 +197,27 @@
         btn.textContent = 'Connecting...';
         const r = await fetch('/api/wall-e/slack/auth', { method: 'POST' });
         const d = await r.json();
-        if (d.url) {
-          window.open(d.url, '_blank');
-          btn.textContent = 'Check browser...';
-        } else if (d.ok) {
+        if (d.ok && d.already) {
           btn.outerHTML = '<span class="badge badge-connected">Connected</span>';
+        } else if (d.ok) {
+          btn.textContent = 'Check browser...';
+          // Poll for completion (OAuth callback happens server-side)
+          let attempts = 0;
+          const poll = setInterval(async () => {
+            attempts++;
+            try {
+              const sr = await fetch('/api/setup/status');
+              const sd = await sr.json();
+              if (sd.slack_connected) {
+                clearInterval(poll);
+                btn.outerHTML = '<span class="badge badge-connected">Connected</span>';
+              } else if (attempts > 60) {
+                clearInterval(poll);
+                btn.textContent = 'Timed out';
+                btn.disabled = false;
+              }
+            } catch {}
+          }, 2000);
         } else {
           btn.textContent = d.error || 'Failed';
           btn.disabled = false;

package/template/claude-task-manager/server.js

@@ -21,7 +21,7 @@ const approvalAgent = require('./approval-agent');
 const { handleReviewApi, checkForChanges } = require('./api-reviews');
 const { sessions } = require('./server-state');
 
-// WALL-E API now served directly by the WALL-E process (port 3457)
+// WALL-E API served directly by the WALL-E process (default: CTM_PORT + 1)
 // Frontend connects to it via CORS. Keep proxy as fallback for environments where WALL-E isn't running separately.
 let handleWalleApi;
 try { handleWalleApi = require('../wall-e/api-walle').handleWalleApi; } catch {}
@@ -30,6 +30,7 @@ try { handleWalleApi = require('../wall-e/api-walle').handleWalleApi; } catch {}
 const CONFIG_DIR = process.env.CTM_DATA_DIR || path.join(process.env.HOME, '.walle', 'data');
 const CONFIG_FILE = path.join(CONFIG_DIR, 'config.json');
 const PORT = parseInt(process.env.CTM_PORT || '3456', 10);
+const WALLE_PORT = parseInt(process.env.WALL_E_PORT || String(PORT + 1), 10);
 const HOST = process.env.CTM_HOST || '127.0.0.1';
 
 function loadConfig() {
@@ -106,6 +107,26 @@ const server = http.createServer((req, res) => {
     }
   }
 
+  // Slack OAuth callback (browser redirect — no auth token, must be before auth check)
+  if (url.pathname === '/api/slack/callback' && req.method === 'GET') {
+    try {
+      const slackMcp = require('../wall-e/tools/slack-mcp');
+      const code = url.searchParams.get('code');
+      const state = url.searchParams.get('state');
+      slackMcp.handleOAuthCallback(code, state).then(result => {
+        res.writeHead(200, { 'Content-Type': 'text/html' });
+        res.end(result.html);
+      }).catch(err => {
+        res.writeHead(500, { 'Content-Type': 'text/html' });
+        res.end('<html><body>OAuth error: ' + err.message + '</body></html>');
+      });
+    } catch (e) {
+      res.writeHead(500, { 'Content-Type': 'text/html' });
+      res.end('<html><body>Slack module not available: ' + e.message + '</body></html>');
+    }
+    return;
+  }
+
   // API routes
   if (url.pathname.startsWith('/api/')) {
     if (!isLocalhost(req)) {
@@ -2096,8 +2117,7 @@ const _ctmStartTime = Date.now();
 
 function apiServicesStatus(req, res) {
   const ctmUptime = Math.floor((Date.now() - _ctmStartTime) / 1000);
-  // Check Wall-E on port 3457
-  execFile('lsof', ['-ti', ':3457'], (err, stdout) => {
+  execFile('lsof', ['-ti', ':' + WALLE_PORT], (err, stdout) => {
     const pids = (stdout || '').trim().split('\n').filter(Boolean);
     // Filter to only node processes
     let wallePid = null;
@@ -2114,7 +2134,7 @@ function apiServicesStatus(req, res) {
 }
 
 function apiStopWalle(req, res) {
-  execFile('lsof', ['-ti', ':3457'], (err, stdout) => {
+  execFile('lsof', ['-ti', ':' + WALLE_PORT], (err, stdout) => {
     const pids = (stdout || '').trim().split('\n').filter(Boolean);
     if (pids.length === 0) {
       res.writeHead(200, { 'Content-Type': 'application/json' });
@@ -2133,7 +2153,7 @@ function apiStartWalle(req, res) {
   const walleDir = path.join(__dirname, '..', 'wall-e');
   const agentScript = path.join(walleDir, 'agent.js');
   // Check if already running
-  execFile('lsof', ['-ti', ':3457'], (err, stdout) => {
+  execFile('lsof', ['-ti', ':' + WALLE_PORT], (err, stdout) => {
     const pids = (stdout || '').trim().split('\n').filter(Boolean);
     if (pids.length > 0) {
       res.writeHead(200, { 'Content-Type': 'application/json' });
@@ -2143,7 +2163,7 @@ function apiStartWalle(req, res) {
     const child = require('child_process').spawn(
       process.execPath,
       [agentScript],
-      { cwd: walleDir, detached: true, stdio: 'ignore', env: { ...process.env } }
+      { cwd: walleDir, detached: true, stdio: 'ignore', env: { ...process.env, WALL_E_PORT: String(WALLE_PORT) } }
     );
     child.unref();
     res.writeHead(200, { 'Content-Type': 'application/json' });
@@ -2181,8 +2201,8 @@ function apiRestartWalle(req, res) {
   const walleDir = path.join(__dirname, '..', 'wall-e');
   const agentScript = path.join(walleDir, 'agent.js');
 
-  // Kill existing Wall-E process on port 3457
-  execFile('lsof', ['-ti', ':3457'], (err, stdout) => {
+  // Kill existing Wall-E process
+  execFile('lsof', ['-ti', ':' + WALLE_PORT], (err, stdout) => {
     const pids = (stdout || '').trim().split('\n').filter(Boolean);
     for (const pid of pids) {
       try { process.kill(parseInt(pid), 'SIGTERM'); } catch {}
@@ -2193,7 +2213,7 @@ function apiRestartWalle(req, res) {
       const child = require('child_process').spawn(
         process.execPath,
         [agentScript],
-        { cwd: walleDir, detached: true, stdio: 'ignore', env: { ...process.env } }
+        { cwd: walleDir, detached: true, stdio: 'ignore', env: { ...process.env, WALL_E_PORT: String(WALLE_PORT) } }
       );
       child.unref();
       res.writeHead(200, { 'Content-Type': 'application/json' });

package/template/wall-e/api-walle.js

@@ -208,12 +208,14 @@ function handleWalleApi(req, res, url) {
   if (p === '/api/wall-e/slack/auth' && m === 'POST') {
     try {
       const slackMcp = require('./tools/slack-mcp');
-      slackMcp.authenticate().then(token => {
-        console.log('[wall-e] Slack OAuth completed');
-      }).catch(err => {
-        console.error('[wall-e] Slack OAuth failed:', err.message);
-      });
-      jsonResponse(res, { data: { message: 'OAuth flow started — check your browser' } });
+      // If already authenticated, return immediately
+      if (slackMcp.isAuthenticated()) {
+        jsonResponse(res, { ok: true, already: true });
+        return true;
+      }
+      // Start OAuth — opens browser, callback handled by CTM server route
+      slackMcp.authenticate();
+      jsonResponse(res, { ok: true, pending: true });
     } catch (e) {
       jsonResponse(res, { error: e.message }, 500);
     }

package/template/wall-e/tools/slack-mcp.js

@@ -6,9 +6,15 @@ const path = require('path');
 
 const SLACK_MCP_URL = 'https://mcp.slack.com/mcp';
 const CLIENT_ID = '1601185624273.8899143856786';
-const CALLBACK_PORT = 3118; // Must match the registered redirect_uri for this client ID
 const TOKEN_FILE = path.join(process.env.HOME, '.claude', 'wall-e-slack-token.json');
 
+// OAuth callback is handled by CTM server at /api/slack/callback
+// so it works on whatever port CTM is running on (no separate server needed).
+function getCallbackUrl() {
+  const port = process.env.CTM_PORT || '3456';
+  return `http://localhost:${port}/api/slack/callback`;
+}
+
 // ── Token persistence ──
 
 function loadToken() {
@@ -37,120 +43,109 @@ function generatePKCE() {
   return { verifier, challenge };
 }
 
+// Pending OAuth state (set during authenticate, consumed by handleOAuthCallback)
+let _pendingOAuth = null;
+
 /**
- * Start OAuth flow: opens browser, waits for callback.
- * Returns the access token.
+ * Start OAuth flow: opens browser, callback handled by CTM server.
+ * Returns immediately — the token is saved when CTM receives the callback.
  */
-async function authenticate() {
+function authenticate() {
   // Check if we already have a valid token
   const existing = loadToken();
   if (existing && existing.access_token) {
-    // TODO: check expiry if available
     return existing.access_token;
   }
 
   const { verifier, challenge } = generatePKCE();
   const state = crypto.randomBytes(16).toString('hex');
+  const redirectUri = getCallbackUrl();
 
-  return new Promise((resolve, reject) => {
-    const timeout = setTimeout(() => {
-      server.close();
-      reject(new Error('OAuth flow timed out (120s). Please try again.'));
-    }, 120000);
-
-    const server = http.createServer(async (req, res) => {
-      const url = new URL(req.url, `http://localhost:${CALLBACK_PORT}`);
-      if (url.pathname !== '/callback') {
-        res.writeHead(404);
-        res.end('Not found');
-        return;
-      }
-
-      const code = url.searchParams.get('code');
-      const returnedState = url.searchParams.get('state');
-
-      if (returnedState !== state) {
-        res.writeHead(400);
-        res.end('State mismatch. Please try again.');
-        clearTimeout(timeout);
-        server.close();
-        reject(new Error('OAuth state mismatch'));
-        return;
-      }
-
-      if (!code) {
-        res.writeHead(400);
-        res.end('No authorization code received.');
-        clearTimeout(timeout);
-        server.close();
-        reject(new Error('No authorization code'));
-        return;
-      }
-
-      try {
-        // Exchange code for token (MCP uses v2.user.access endpoint)
-        const tokenResp = await fetch('https://slack.com/api/oauth.v2.user.access', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-          body: new URLSearchParams({
-            client_id: CLIENT_ID,
-            code,
-            code_verifier: verifier,
-            redirect_uri: `http://localhost:${CALLBACK_PORT}/callback`,
-          }),
-        });
-        const tokenData = await tokenResp.json();
-
-        if (!tokenData.ok) {
-          throw new Error(`Slack OAuth error: ${tokenData.error}`);
-        }
-
-        // Save token (v2.user.access returns tokens at top level, not nested under authed_user)
-        const tokenInfo = {
-          access_token: tokenData.access_token || tokenData.authed_user?.access_token,
-          refresh_token: tokenData.refresh_token,
-          team_id: tokenData.team?.id || tokenData.team_id,
-          team_name: tokenData.team?.name,
-          user_id: tokenData.user_id || tokenData.authed_user?.id,
-          scope: tokenData.scope || tokenData.authed_user?.scope,
-          obtained_at: new Date().toISOString(),
-        };
-        saveToken(tokenInfo);
-
-        res.writeHead(200, { 'Content-Type': 'text/html' });
-        res.end('<html><body style="font-family:system-ui;text-align:center;padding:40px"><h2>WALL-E connected to Slack!</h2><p>You can close this tab.</p></body></html>');
-
-        clearTimeout(timeout);
-        server.close();
-        resolve(tokenInfo.access_token);
-      } catch (err) {
-        res.writeHead(500);
-        res.end('Token exchange failed: ' + err.message);
-        clearTimeout(timeout);
-        server.close();
-        reject(err);
-      }
-    });
+  _pendingOAuth = { verifier, state, redirectUri, createdAt: Date.now() };
 
-    server.listen(CALLBACK_PORT, () => {
-      // Scopes from Slack MCP's .well-known/oauth-authorization-server
-      const scopes = 'search:read.public,search:read.private,search:read.mpim,search:read.im,search:read.files,search:read.users,chat:write,channels:history,groups:history,mpim:history,im:history,canvases:read,users:read,users:read.email';
-      const authUrl = `https://slack.com/oauth/v2_user/authorize?client_id=${CLIENT_ID}&scope=${encodeURIComponent(scopes)}&redirect_uri=${encodeURIComponent(`http://localhost:${CALLBACK_PORT}/callback`)}&state=${state}&code_challenge=${challenge}&code_challenge_method=S256`;
-      console.log('[slack-mcp] Opening browser for Slack OAuth...');
-      console.log('[slack-mcp] Auth URL:', authUrl);
-
-      // Open browser
-      const { execFile } = require('child_process');
-      execFile('open', [authUrl], (err) => {
-        if (err) console.error('[slack-mcp] Failed to open browser:', err.message);
-      });
-    });
+  const scopes = 'search:read.public,search:read.private,search:read.mpim,search:read.im,search:read.files,search:read.users,chat:write,channels:history,groups:history,mpim:history,im:history,canvases:read,users:read,users:read.email';
+  const authUrl = `https://slack.com/oauth/v2_user/authorize?client_id=${CLIENT_ID}&scope=${encodeURIComponent(scopes)}&redirect_uri=${encodeURIComponent(redirectUri)}&state=${state}&code_challenge=${challenge}&code_challenge_method=S256`;
 
-    server.on('error', (err) => {
-      clearTimeout(timeout);
-      reject(new Error(`OAuth server failed: ${err.message}`));
-    });
+  console.log('[slack-mcp] Opening browser for Slack OAuth...');
+  console.log('[slack-mcp] Callback URL:', redirectUri);
+
+  const { execFile } = require('child_process');
+  execFile('open', [authUrl], (err) => {
+    if (err) console.error('[slack-mcp] Failed to open browser:', err.message);
   });
+
+  return null; // Token not yet available — will be set by callback
+}
+
+/**
+ * Handle the OAuth callback from Slack (called by CTM server route).
+ * Returns { ok, html } or { error, html }.
+ */
+async function handleOAuthCallback(code, returnedState) {
+  if (!_pendingOAuth) {
+    return { error: 'No pending OAuth flow. Click "Connect" again.', html: errorPage('No pending OAuth flow. Go back and click Connect again.') };
+  }
+
+  // Expire after 10 minutes
+  if (Date.now() - _pendingOAuth.createdAt > 600000) {
+    _pendingOAuth = null;
+    return { error: 'OAuth flow expired.', html: errorPage('OAuth flow expired. Go back and click Connect again.') };
+  }
+
+  if (returnedState !== _pendingOAuth.state) {
+    _pendingOAuth = null;
+    return { error: 'State mismatch.', html: errorPage('OAuth state mismatch. Please try again.') };
+  }
+
+  if (!code) {
+    _pendingOAuth = null;
+    return { error: 'No code.', html: errorPage('No authorization code received from Slack.') };
+  }
+
+  try {
+    const tokenResp = await fetch('https://slack.com/api/oauth.v2.user.access', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+      body: new URLSearchParams({
+        client_id: CLIENT_ID,
+        code,
+        code_verifier: _pendingOAuth.verifier,
+        redirect_uri: _pendingOAuth.redirectUri,
+      }),
+    });
+    const tokenData = await tokenResp.json();
+
+    _pendingOAuth = null;
+
+    if (!tokenData.ok) {
+      return { error: tokenData.error, html: errorPage('Slack OAuth error: ' + tokenData.error) };
+    }
+
+    const tokenInfo = {
+      access_token: tokenData.access_token || tokenData.authed_user?.access_token,
+      refresh_token: tokenData.refresh_token,
+      team_id: tokenData.team?.id || tokenData.team_id,
+      team_name: tokenData.team?.name,
+      user_id: tokenData.user_id || tokenData.authed_user?.id,
+      scope: tokenData.scope || tokenData.authed_user?.scope,
+      obtained_at: new Date().toISOString(),
+    };
+    saveToken(tokenInfo);
+
+    console.log('[slack-mcp] OAuth completed — team:', tokenInfo.team_name);
+    return { ok: true, html: successPage() };
+  } catch (err) {
+    _pendingOAuth = null;
+    return { error: err.message, html: errorPage('Token exchange failed: ' + err.message) };
+  }
+}
+
+function successPage() {
+  return '<html><body style="font-family:system-ui;text-align:center;padding:60px;background:#0d1117;color:#e6edf3"><h2 style="color:#3fb950">Wall-E connected to Slack!</h2><p style="color:#8b949e">You can close this tab and return to the setup page.</p></body></html>';
+}
+
+function errorPage(msg) {
+  return '<html><body style="font-family:system-ui;text-align:center;padding:60px;background:#0d1117;color:#e6edf3"><h2 style="color:#f85149">Slack Connection Failed</h2><p style="color:#8b949e">' + msg + '</p></body></html>';
 }
 
 // ── MCP HTTP client ──
@@ -287,4 +282,4 @@ if (require.main === module) {
   }
 }
 
-module.exports = { authenticate, callSlackMcp, listSlackTools, isAuthenticated, loadToken, clearToken };
+module.exports = { authenticate, handleOAuthCallback, callSlackMcp, listSlackTools, isAuthenticated, loadToken, clearToken };