From 438db357ff97e335f7ef85e9347aada37f6244a3 Mon Sep 17 00:00:00 2001 From: pewdiepie-archdaemon Date: Sat, 13 Jun 2026 22:11:45 +0900 Subject: [PATCH] =?UTF-8?q?Cookbook=20Active=20tab:=20header=20=E2=86=92?= =?UTF-8?q?=20Active,=20Reconnect=20=E2=86=92=20Reconnect=20tmux,=20sectio?= =?UTF-8?q?n=20dividers?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Header h2 inside the Active group now says "Active" (matches the renamed tab) instead of "Running". - Both context-menu Reconnect entries (the normal one and the recover-from-vanished-process fix) say "Reconnect tmux" so the user knows what the action actually does. - Sibling cookbook-server-section-* blocks inside the Active group get a top divider + 14px gap so transitions between server groups (local / remote-host / etc) read clearly. --- static/js/cookbookRunning.js | 12 ++++++------ static/style.css | 13 +++++++++++-- 2 files changed, 17 insertions(+), 8 deletions(-) diff --git a/static/js/cookbookRunning.js b/static/js/cookbookRunning.js index b13856c08..ec3057ea5 100644 --- a/static/js/cookbookRunning.js +++ b/static/js/cookbookRunning.js @@ -1642,7 +1642,7 @@ export function _renderRunningTab() { runTab.className = 'cookbook-tab'; runTab.dataset.backend = 'Running'; const _errCount = tasks.filter(t => t.status === 'error' || t.status === 'crashed').length; - runTab.innerHTML = `Running${activeCountHtml}${_errCount ? `` : ''}`; + runTab.innerHTML = `Active${activeCountHtml}${_errCount ? `` : ''}`; tabBar.insertBefore(runTab, tabBar.firstChild); runTab.addEventListener('click', () => { tabBar.querySelectorAll('.cookbook-tab').forEach(t => t.classList.remove('active')); @@ -1653,7 +1653,7 @@ export function _renderRunningTab() { }); } else if (runTab) { const _errCount2 = tasks.filter(t => t.status === 'error' || t.status === 'crashed').length; - runTab.innerHTML = tasks.length ? `Running${activeCountHtml}${_errCount2 ? '' : ''}` : 'Running'; + runTab.innerHTML = tasks.length ? `Active${activeCountHtml}${_errCount2 ? '' : ''}` : 'Active'; if (!hasContent) { if (runTab.classList.contains('active')) { const wfTab = tabBar.querySelector('.cookbook-tab[data-backend="Search"]'); @@ -1670,7 +1670,7 @@ export function _renderRunningTab() { group.dataset.backendGroup = 'Running'; group.innerHTML = '
' + '
' + - '

Running ' + activeCount + '

' + + '

Active ' + activeCount + '

' + '
' + '

Active downloads and serving processes.

' + '
'; @@ -1750,7 +1750,7 @@ export function _renderRunningTab() { // green when reachable, red if any serve task on it is crashed/unreachable. const _secDot = (key && allTasks.some(_serveTaskFailed)) ? 'fail' : 'ok'; const _dotTitle = key ? (_secDot === 'fail' ? 'Server not responding' : 'Reachable') : 'Local (this machine)'; - sec.insertAdjacentHTML('afterbegin', `
${esc(sg.name)}
`); + sec.insertAdjacentHTML('afterbegin', `
${esc(sg.name)}
`); } } @@ -2108,7 +2108,7 @@ export function _renderRunningTab() { }}); } if (task.status !== 'running' && task.status !== 'queued') { - items.push({ label: 'Reconnect', action: 'reconnect' }); + items.push({ label: 'Reconnect tmux', action: 'reconnect' }); } if (task.status === 'running') { items.push({ label: 'Stop', action: 'stop', danger: true }); @@ -2651,7 +2651,7 @@ async function _reconnectTask(el, task) { // capture-pane lets the existing _reconnectTask flow pick up // the real state (running, finished, or truly dead). const _reconnectFix = { - label: 'Reconnect', + label: 'Reconnect tmux', action: () => { _updateTask(task.sessionId, { status: 'running' }); el.dataset.status = 'running'; diff --git a/static/style.css b/static/style.css index e8ca7ed8d..26a9ad72b 100644 --- a/static/style.css +++ b/static/style.css @@ -19139,6 +19139,14 @@ body.gallery-selecting .gallery-dl-btn, margin-bottom: 6px; overflow: hidden; } +/* Divider between server-group sections in the Active tab so the + transition between e.g. local + remote-host server blocks reads + visually instead of running into each other. */ +.cookbook-group[data-backend-group="Running"] > [class*="cookbook-server-section-"] + [class*="cookbook-server-section-"] { + margin-top: 14px; + padding-top: 14px; + border-top: 1px solid color-mix(in srgb, var(--border) 65%, transparent); +} .cookbook-section-header { display: flex; align-items: center; @@ -19577,7 +19585,7 @@ body.gallery-selecting .gallery-dl-btn, border: 1px solid var(--border); border-radius: 4px; background: var(--bg); - font-size: 12px; /* match .cookbook-field-input so Context reads same size as Engine/Quant */ + font-size: 11px; /* slightly smaller than .cookbook-field-input so Context reads quieter next to Engine/Quant */ } .hwfit-ctx-control span { /* Match Quant/Engine select label style: no uppercase, no letter-spacing. */ @@ -21417,7 +21425,8 @@ body.gallery-selecting .gallery-dl-btn, .hwfit-toolbar input:focus { outline: none; border-color: var(--red); } .hwfit-toolbar .hwfit-server-select { min-width: 70px; flex-shrink: 0; } .hwfit-toolbar .hwfit-usecase { min-width: 70px; flex-shrink: 0; } -.hwfit-toolbar .hwfit-quant { min-width: 50px; flex-shrink: 0; } +.hwfit-toolbar .hwfit-quant { min-width: 0; width: 78px; flex-shrink: 0; font-size: 10px; } +.hwfit-toolbar .hwfit-engine { min-width: 0; width: 86px; flex-shrink: 0; font-size: 10px; } .hwfit-toolbar .hwfit-search { flex: 1; min-width: 80px; } /* Lower-opacity "Search models..." placeholder so it reads as a hint, not a label — matches the muted form-field feel of the inline filters. */