skill
Claude Squad
UnreviewedLaunch and manage 4 concurrent Claude Code remote control sessions via tmux. Includes a Gallia Viewer management dashboard with live status, start/restart/stop controls, watchdog auto-restart, and aut
<!DOCTYPE html>
<html>
<head><script>(function(){var n=0;function show(p,m){var el=document.createElement('div');el.style.cssText='position:fixed;left:0;right:0;background:#e04040;color:#fff;padding:6px 12px;z-index:'+(99999-n)+';font:13px/1.4 monospace;white-space:pre-wrap;border-bottom:1px solid #b02020;top:'+n*30+'px';el.textContent=p+m;document.body.appendChild(el);n++}window.onerror=function(msg,src,line){show('ERROR '+(src||'').split('/').pop()+':'+line+' \u2014 ',msg)};window.addEventListener('unhandledrejection',function(e){show('REJECT \u2014 ',e.reason&&e.reason.message||e.reason||'unknown')})})()</script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Claude Squad — All Running</title>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
background: #0d1117;
color: #e6edf3;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
min-height: 100vh;
display: flex;
align-items: flex-start;
justify-content: center;
padding: 16px;
}
.explainer {
width: 100%;
max-width: 520px;
padding: 20px 24px;
margin: 0 auto;
}
.explainer h2 {
font-size: 16px;
color: #00b8b0;
font-weight: 600;
margin-bottom: 4px;
}
.exp-subtitle {
font-size: 12px;
color: #8b949e;
margin-bottom: 16px;
}
.squad-help-wrap { position: relative; display: inline-flex; }
.squad-help-icon {
display: inline-flex; align-items: center; justify-content: center;
width: 20px; height: 20px; border-radius: 50%;
background: #21262d; color: #8b949e; font-size: 12px; font-weight: 700;
cursor: help; border: 1px solid #30363d;
}
.squad-help-tooltip {
display: none; position: absolute; top: 32px; left: 50%; transform: translateX(-50%); z-index: 100;
background: #161b22; border: 1px solid #30363d; border-radius: 8px; padding: 14px 16px; width: 340px;
box-shadow: 0 8px 24px rgba(0,0,0,0.4); font-size: 12px; font-weight: 400; line-height: 1.5; color: #c9d1d9;
}
.squad-help-wrap:hover .squad-help-tooltip { display: block; }
.squad-card {
background: #161b22; border: 1px solid #30363d; border-radius: 8px;
padding: 14px 16px; cursor: pointer; transition: border-color 0.15s; position: relative;
}
.squad-card:hover { border-color: #484f58; }
.squad-card.selected { border-left: 3px solid; }
.squad-card-restart {
position: absolute; top: 8px; right: 8px; background: none; border: none;
color: #484f58; cursor: pointer; font-size: 14px; padding: 2px 4px; border-radius: 4px; line-height: 1;
}
.squad-card-restart:hover { color: #c9d1d9; background: #21262d; }
.btn {
border: none; border-radius: 6px; padding: 6px 16px; font-size: 12px;
font-weight: 600; cursor: pointer; color: #fff;
}
.btn-green { background: #238636; }
.btn-yellow { background: #9e6a03; }
.btn-red { background: #da3633; }
.btn:hover { opacity: 0.9; }
code {
background: #21262d; padding: 1px 5px; border-radius: 3px; font-size: 11px;
}
</style>
</head>
<body>
<div class="explainer">
<h2 style="display:flex;align-items:center;gap:10px;">
<span style="display:inline-block;width:10px;height:10px;border-radius:50%;background:#3fb950;"></span>
Claude Squad
<span class="squad-help-wrap">
<span class="squad-help-icon">?</span>
<div class="squad-help-tooltip">
<div style="font-weight:600;color:#e6edf3;margin-bottom:6px;">What is Claude Squad?</div>
<div style="margin-bottom:8px;">Launches <strong>4 parallel Claude Code</strong> remote control (RC) sessions — Alpha, Beta, Gamma, Delta — each controllable from the <strong>Claude phone app</strong>.</div>
<div style="font-weight:600;color:#e6edf3;margin-bottom:6px;">Why tmux?</div>
<div style="margin-bottom:8px;">Each session runs in a <strong>tmux terminal</strong> so it persists even if you disconnect. Tmux also lets us capture the full conversation history and monitor status without interrupting the session.</div>
<div style="font-weight:600;color:#e6edf3;margin-bottom:6px;">Connecting from your phone</div>
<div>Open the <strong>Claude app</strong> on your phone. The RC sessions appear automatically. Each runs <code>claude rc</code> in its own tmux session.</div>
</div>
</span>
</h2>
<div class="exp-subtitle">All 4 sessions running <span style="color:#484f58;margin-left:8px;">(adom)</span></div>
<!-- Action buttons -->
<div style="display:flex;gap:8px;margin:14px 0 6px;">
<button class="btn btn-yellow">Restart Squad</button>
<button class="btn btn-red">Stop Squad</button>
</div>
<!-- Session cards grid -->
<div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0;">
<!-- Alpha (selected) -->
<div class="squad-card selected" style="border-color:#58a6ff;border-left-color:#58a6ff;">
<button class="squad-card-restart" title="Restart alpha">↻</button>
<div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:rgba(88,166,255,0.15);color:#58a6ff;font-weight:700;font-size:14px;">A</span>
<div style="flex:1;">
<div style="color:#e6edf3;font-size:13px;font-weight:600;">Alpha</div>
<div style="color:#8b949e;font-size:11px;font-family:monospace;">adom-alpha</div>
</div>
<span style="display:inline-flex;align-items:center;gap:5px;font-size:11px;color:#3fb950;">
<span style="display:inline-block;width:7px;height:7px;border-radius:50%;background:#3fb950;"></span>
Running
</span>
</div>
</div>
<!-- Beta -->
<div class="squad-card">
<button class="squad-card-restart" title="Restart beta">↻</button>
<div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:rgba(210,168,255,0.15);color:#d2a8ff;font-weight:700;font-size:14px;">B</span>
<div style="flex:1;">
<div style="color:#e6edf3;font-size:13px;font-weight:600;">Beta</div>
<div style="color:#8b949e;font-size:11px;font-family:monospace;">adom-beta</div>
</div>
<span style="display:inline-flex;align-items:center;gap:5px;font-size:11px;color:#3fb950;">
<span style="display:inline-block;width:7px;height:7px;border-radius:50%;background:#3fb950;"></span>
Running
</span>
</div>
</div>
<!-- Gamma -->
<div class="squad-card">
<button class="squad-card-restart" title="Restart gamma">↻</button>
<div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:rgba(63,185,80,0.15);color:#3fb950;font-weight:700;font-size:14px;">C</span>
<div style="flex:1;">
<div style="color:#e6edf3;font-size:13px;font-weight:600;">Gamma</div>
<div style="color:#8b949e;font-size:11px;font-family:monospace;">adom-gamma</div>
</div>
<span style="display:inline-flex;align-items:center;gap:5px;font-size:11px;color:#3fb950;">
<span style="display:inline-block;width:7px;height:7px;border-radius:50%;background:#3fb950;"></span>
Running
</span>
</div>
</div>
<!-- Delta -->
<div class="squad-card">
<button class="squad-card-restart" title="Restart delta">↻</button>
<div style="display:flex;align-items:center;gap:10px;margin-bottom:8px;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:rgba(210,169,34,0.15);color:#d29922;font-weight:700;font-size:14px;">D</span>
<div style="flex:1;">
<div style="color:#e6edf3;font-size:13px;font-weight:600;">Delta</div>
<div style="color:#8b949e;font-size:11px;font-family:monospace;">adom-delta</div>
</div>
<span style="display:inline-flex;align-items:center;gap:5px;font-size:11px;color:#3fb950;">
<span style="display:inline-block;width:7px;height:7px;border-radius:50%;background:#3fb950;"></span>
Running
</span>
</div>
</div>
</div>
<!-- Watchdog controls -->
<div style="background:#161b22;border:1px solid #30363d;border-radius:8px;padding:14px 16px;margin:8px 0;">
<div style="display:flex;align-items:center;justify-content:space-between;">
<div style="display:flex;align-items:center;gap:8px;">
<span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#3fb950;"></span>
<span style="color:#e6edf3;font-size:13px;font-weight:600;">Watchdog</span>
<span style="color:#484f58;font-size:11px;">Auto-restarts dead sessions every 15s</span>
</div>
<label style="position:relative;display:inline-block;width:36px;height:20px;cursor:pointer;">
<input type="checkbox" checked style="opacity:0;width:0;height:0;">
<span style="position:absolute;top:0;left:0;right:0;bottom:0;border-radius:10px;transition:0.2s;background:#238636;"></span>
<span style="position:absolute;top:2px;left:18px;width:16px;height:16px;border-radius:50%;background:#fff;transition:0.2s;"></span>
</label>
</div>
<div style="display:flex;gap:16px;margin-top:8px;color:#8b949e;font-size:11px;">
<span>Last check: 3s ago</span>
<span>Restarts: 0</span>
</div>
<!-- Auto-start on boot -->
<div style="margin-top:10px;border-top:1px solid #21262d;padding-top:10px;display:flex;align-items:center;justify-content:space-between;">
<div style="display:flex;align-items:center;gap:8px;">
<span style="color:#e6edf3;font-size:12px;">Start on boot</span>
<span style="color:#484f58;font-size:11px;">Auto-launches squad when server starts</span>
</div>
<label style="display:flex;align-items:center;gap:6px;cursor:pointer;">
<input type="checkbox" checked style="width:14px;height:14px;accent-color:#238636;cursor:pointer;">
</label>
</div>
</div>
<!-- Chat output for selected session -->
<div style="margin-top:8px;">
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;">
<h3 style="margin:0;font-size:14px;color:#58a6ff;text-transform:capitalize;">Alpha — Chat Output</h3>
<button style="background:#21262d;color:#c9d1d9;border:1px solid #30363d;border-radius:6px;padding:4px 12px;font-size:11px;cursor:pointer;">Refresh</button>
</div>
<pre style="background:#0d1117;color:#c9d1d9;border:1px solid #30363d;border-radius:8px;padding:14px;font-size:11px;font-family:'SF Mono','Fira Code',monospace;line-height:1.5;overflow:auto;max-height:500px;white-space:pre-wrap;word-break:break-word;">
╭────────────────────────────────────────────╮
│ ✻ Claude Code rc mode │
│ │
│ Remote control session started. │
│ Session ID: f8a2c3d1-4e5b-6789-abcd-ef01 │
│ │
│ Waiting for commands... │
╰────────────────────────────────────────────╯
> User: Add error handling to the API endpoints
I'll add error handling to the API endpoints. Let me
start by reading the current server code.
Read server.js (248 lines)
I can see several endpoints without proper error
handling. Let me add try/catch blocks and consistent
error responses.
Edit server.js:
+ Added try/catch to GET /api/components
+ Added try/catch to POST /api/search
+ Added try/catch to PUT /api/settings
+ Added consistent error response format
All 3 endpoints now return structured errors:
{ error: true, message: "...", code: 500 }
> User: Run the tests
Running tests...
$ npm test
PASS tests/api.test.js (4 tests)
PASS tests/search.test.js (7 tests)
All 11 tests passed.</pre>
</div>
<div style="color:#484f58;font-size:10px;text-align:center;margin-top:16px;">
Demo — simulated squad data
</div>
</div>
</body>
</html>