feat: add Kill All button to monitor panel + center close modal

- Add Kill All button with confirmation dialog to monitor panel header
- Button shows red X icon, confirms before killing all sessions
- Center-align close session modal options for better UX

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
arkon
2026-01-19 07:57:13 +01:00
co-authored by Claude Opus 4.5
parent 45a1d09665
commit 6a5beb3afa
3 changed files with 41 additions and 1 deletions
+29
View File
@@ -1561,6 +1561,35 @@ class ClaudemanApp {
}
}
async killAllSessions() {
const count = this.screenSessions?.length || 0;
if (count === 0) {
alert('No sessions to kill');
return;
}
const confirmed = confirm(`Kill all ${count} session(s)? This cannot be undone.`);
if (!confirmed) return;
try {
const res = await fetch('/api/sessions', { method: 'DELETE' });
const data = await res.json();
if (data.success) {
// Clear local state
this.sessions.clear();
this.screenSessions = [];
this.activeSessionId = null;
this.renderSessionTabs();
this.renderScreenSessions();
this.terminal.clear();
this.terminal.reset();
}
} catch (err) {
console.error('Failed to kill all sessions:', err);
alert('Failed to kill sessions: ' + err.message);
}
}
renderScreenSessions() {
const body = document.getElementById('screenSessionsBody');
+1
View File
@@ -133,6 +133,7 @@
<div class="monitor-panel-header">
<span>Monitor</span>
<div class="monitor-panel-actions">
<button class="btn-icon-sm btn-danger-sm" onclick="app.killAllSessions()" title="Kill all sessions">&#x2715;</button>
<button class="btn-icon-sm" onclick="app.reconcileScreens()" title="Refresh screens">&#x21BB;</button>
<button class="btn-icon-sm" onclick="app.toggleMonitorPanel()" title="Toggle panel" id="monitorToggleBtn">&#x25BC;</button>
</div>
+11 -1
View File
@@ -697,6 +697,15 @@ body {
background: var(--bg-hover);
}
.btn-danger-sm {
color: #ff6b6b;
}
.btn-danger-sm:hover {
color: #fff;
background: #dc3545;
}
.form-row {
margin-bottom: 0.75rem;
}
@@ -890,7 +899,8 @@ body {
.close-option {
display: flex;
flex-direction: column;
align-items: flex-start;
align-items: center;
text-align: center;
padding: 0.75rem 1rem;
background: var(--bg-hover);
border: 1px solid var(--border);