refactor: UI cleanup - move respawn controls, remove mode label, fix dir width

- Move respawn controls from toolbar to session options modal
- Remove unnecessary Mode label from session options (visible in tab)
- Increase directory input width from 200px to 350px
- Add RTL direction to directory display to show end of long paths
- Add respawn status indicator with stop/configure buttons in modal

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
arkon
2026-01-19 02:06:37 +01:00
co-authored by Claude Opus 4.5
parent 3be3595907
commit 363b6d1147
4 changed files with 127 additions and 21 deletions
+46 -1
View File
@@ -1167,14 +1167,59 @@ class ClaudemanApp {
this.editingSessionId = sessionId;
document.getElementById('sessionNameInput').value = session.name || '';
document.getElementById('sessionModeDisplay').textContent = session.mode === 'shell' ? 'Shell' : 'Claude';
document.getElementById('sessionDirDisplay').textContent = session.workingDir || 'Unknown';
// Update respawn status display
const respawnStatus = document.getElementById('sessionRespawnStatus');
const stopBtn = document.getElementById('sessionStopRespawnBtn');
const configBtn = document.getElementById('sessionConfigRespawnBtn');
if (this.respawnStatus[sessionId]) {
respawnStatus.classList.add('active');
respawnStatus.querySelector('.respawn-status-text').textContent =
`Active (${this.respawnStatus[sessionId].state || 'running'})`;
stopBtn.style.display = '';
configBtn.textContent = 'Reconfigure';
} else {
respawnStatus.classList.remove('active');
respawnStatus.querySelector('.respawn-status-text').textContent = 'Not active';
stopBtn.style.display = 'none';
configBtn.textContent = 'Configure Respawn';
}
// Only show respawn section for claude mode sessions with a running process
const respawnSection = document.getElementById('sessionRespawnSection');
if (session.mode === 'claude' && session.pid) {
respawnSection.style.display = '';
} else {
respawnSection.style.display = 'none';
}
document.getElementById('sessionOptionsModal').classList.add('active');
// Focus the name input
setTimeout(() => document.getElementById('sessionNameInput').focus(), 100);
}
async stopRespawnFromOptions() {
if (!this.editingSessionId) return;
try {
await fetch(`/api/sessions/${this.editingSessionId}/respawn/stop`, { method: 'POST' });
delete this.respawnTimers[this.editingSessionId];
// Update the modal display
const respawnStatus = document.getElementById('sessionRespawnStatus');
respawnStatus.classList.remove('active');
respawnStatus.querySelector('.respawn-status-text').textContent = 'Not active';
document.getElementById('sessionStopRespawnBtn').style.display = 'none';
document.getElementById('sessionConfigRespawnBtn').textContent = 'Configure Respawn';
this.showToast('Respawn stopped', 'success');
} catch (err) {
this.showToast('Failed to stop respawn', 'error');
}
}
closeSessionOptions() {
this.editingSessionId = null;
document.getElementById('sessionOptionsModal').classList.remove('active');