Projets/homelab_automation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add terminal session management with heartbeat monitoring, idle timeout detection, session reuse logic, and command history panel UI with search and filtering capabilities
Tests / Backend Tests (Python) (3.10) (push) Has been cancelled
Details
Tests / Backend Tests (Python) (3.11) (push) Has been cancelled
Details
Tests / Backend Tests (Python) (3.12) (push) Has been cancelled
Details
Tests / Frontend Tests (JS) (push) Has been cancelled
Details
Tests / Integration Tests (push) Has been cancelled
Details
Tests / All Tests Passed (push) Has been cancelled
Details

Browse Source
This commit is contained in:
bruno
2025-12-18 13:49:40 -05:00
parent 493668f746
commit 5bc12d0729
74 changed files with 14849 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/index.html
+283
View File
@@ -3154,6 +3154,210 @@
color: #ef4444;
}
/* Terminal History Panel */
.terminal-history-panel {
background: #1e1e2e;
border-bottom: 1px solid #374151;
max-height: 300px;
overflow: hidden;
display: flex;
flex-direction: column;
}
.terminal-history-header {
padding: 0.75rem 1rem;
background: #1a1a2e;
display: flex;
align-items: center;
gap: 1rem;
flex-shrink: 0;
}
.terminal-history-search {
flex: 1;
display: flex;
align-items: center;
background: #0f0f1a;
border: 1px solid #374151;
border-radius: 0.5rem;
padding: 0 0.75rem;
gap: 0.5rem;
}
.terminal-history-search i {
color: #6b7280;
}
.terminal-history-search input {
flex: 1;
background: transparent;
border: none;
outline: none;
color: #fff;
padding: 0.5rem 0;
font-size: 0.875rem;
}
.terminal-history-search input::placeholder {
color: #6b7280;
}
.terminal-history-clear-search {
background: none;
border: none;
color: #6b7280;
cursor: pointer;
padding: 0.25rem;
display: flex;
align-items: center;
justify-content: center;
}
.terminal-history-clear-search:hover {
color: #9ca3af;
}
.terminal-history-actions {
display: flex;
align-items: center;
gap: 0.5rem;
}
.terminal-history-scope {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.75rem;
color: #9ca3af;
cursor: pointer;
}
.terminal-history-scope input {
width: 1rem;
height: 1rem;
accent-color: #7c3aed;
}
.terminal-history-list {
flex: 1;
overflow-y: auto;
padding: 0.5rem;
}
.terminal-history-item {
display: flex;
align-items: center;
padding: 0.5rem 0.75rem;
border-radius: 0.375rem;
cursor: pointer;
transition: background 0.15s;
gap: 0.75rem;
}
.terminal-history-item:hover {
background: rgba(124, 58, 237, 0.15);
}
.terminal-history-cmd {
flex: 1;
min-width: 0;
}
.terminal-history-cmd code {
font-family: 'JetBrains Mono', 'Fira Code', monospace;
font-size: 0.8125rem;
color: #a5b4fc;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
}
.terminal-history-meta {
display: flex;
align-items: center;
gap: 0.5rem;
flex-shrink: 0;
}
.terminal-history-time {
font-size: 0.6875rem;
color: #6b7280;
}
.terminal-history-count {
font-size: 0.625rem;
color: #7c3aed;
background: rgba(124, 58, 237, 0.2);
padding: 0.125rem 0.375rem;
border-radius: 9999px;
}
.terminal-history-host {
font-size: 0.6875rem;
color: #4ade80;
background: rgba(74, 222, 128, 0.1);
padding: 0.125rem 0.375rem;
border-radius: 0.25rem;
}
.terminal-history-actions-inline {
display: flex;
gap: 0.25rem;
opacity: 0;
transition: opacity 0.15s;
}
.terminal-history-item:hover .terminal-history-actions-inline {
opacity: 1;
}
.terminal-history-action {
background: rgba(55, 65, 81, 0.5);
border: none;
color: #9ca3af;
padding: 0.375rem;
border-radius: 0.25rem;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
}
.terminal-history-action:hover {
background: rgba(124, 58, 237, 0.3);
color: #fff;
}
.terminal-history-empty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem;
color: #6b7280;
gap: 0.5rem;
}
.terminal-history-empty i {
font-size: 1.5rem;
}
.terminal-history-loading {
display: flex;
align-items: center;
justify-content: center;
padding: 2rem;
color: #9ca3af;
gap: 0.5rem;
}
#terminalHistoryBtn.active {
background: #7c3aed;
color: #fff;
}
/* Mobile responsive */
@media (max-width: 768px) {
.terminal-drawer-panel {
@@ -3166,6 +3370,85 @@
display: none;
}
}
/* =====================================================
Session Limit Modal Styles
===================================================== */
.session-limit-modal {
max-width: 500px;
width: 90%;
}
.session-limit-message {
color: #e5e7eb;
margin-bottom: 1rem;
}
.session-limit-reuse {
background: rgba(34, 197, 94, 0.1);
border: 1px solid rgba(34, 197, 94, 0.3);
border-radius: 0.5rem;
padding: 1rem;
margin-bottom: 1rem;
}
.session-limit-reuse p {
color: #4ade80;
margin-bottom: 0.75rem;
}
.session-limit-list {
margin-bottom: 1rem;
}
.session-limit-list h4 {
color: #9ca3af;
font-size: 0.875rem;
margin-bottom: 0.75rem;
}
.session-limit-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.75rem;
background: rgba(55, 65, 81, 0.5);
border-radius: 0.5rem;
margin-bottom: 0.5rem;
transition: opacity 0.3s ease;
}
.session-limit-item-info {
display: flex;
align-items: center;
gap: 0.75rem;
}
.session-limit-host {
color: #fff;
font-weight: 500;
}
.session-limit-mode {
color: #9ca3af;
font-size: 0.75rem;
padding: 0.125rem 0.5rem;
background: rgba(107, 114, 128, 0.3);
border-radius: 0.25rem;
}
.session-limit-age {
color: #9ca3af;
font-size: 0.75rem;
}
.session-limit-actions {
display: flex;
justify-content: flex-end;
gap: 0.5rem;
padding-top: 1rem;
border-top: 1px solid #374151;
}
</style>
</head>
<body>