@yemi33/minions 0.1.2414 → 0.1.2415

package/dashboard/js/refresh.js

@@ -185,7 +185,7 @@ const RENDER_VERSIONS = {
   // Bumped to 4 by W-mqrdavob (Agents table: per-agent charter editor column).
   // Bumped to 5 by W-mr0qs0vw (Worker Pool: CC session idle-timeout field).
   // Bumped to 6 for the fleet ACP pool opt-in default and warning copy.
-  settings: 6,
+  settings: 7,
 };
 const _sectionCache = {};
 const _lastValueByKey = {};

package/dashboard/js/settings.js

@@ -713,6 +713,13 @@ async function openSettings() {
   // non-dispatch toggles that historically lived under Auto-fix; placed
   // adjacent to Auto-fix so operators following the legacy mental model find
   // the moved flags quickly.
+  // W-mryz3r7h — a section may opt into a collapsible rail fold by declaring a
+  // `group`. Grouped sections render as an indented child list beneath a fold
+  // header (see RAIL_GROUPS + the railHtml builder below); their PANES stay in
+  // the content area unchanged. Copilot/Claude Tuning + Budget + the former
+  // standalone Advanced pane now live under the "Advanced" fold (collapsed by
+  // default). The former standalone Advanced leaf is nested here too so there is
+  // only ever one thing labeled "Advanced".
   const sections = [
     { id: 'runtime', label: 'Agents Runtime & Models', featured: true, html: paneRuntime },
     { id: 'autofix', label: 'Auto-fix & Review Loop', featured: true, html: paneAutoFix },
@@ -723,15 +730,19 @@ async function openSettings() {
     { id: 'polling', label: 'Polling', html: panePolling },
     { id: 'concurrency', label: 'Concurrency & Timeouts', html: paneConcurrency },
     { id: 'worktree', label: 'Worker Pool & Worktrees', html: paneWorktree },
-    { id: 'copilot', label: 'Copilot Tuning', html: paneCopilot },
-    { id: 'claude', label: 'Claude Tuning', html: paneClaude },
     { id: 'harness', label: 'Runtime Harness', html: paneHarness },
-    { id: 'budget', label: 'Budget', html: paneBudget },
     { id: 'maxturns', label: 'Max Turns', html: paneMaxTurns },
     { id: 'features', label: 'Feature Flags', html: paneFeatures },
-    { id: 'advanced', label: 'Advanced', html: paneAdvanced },
+    { id: 'copilot', label: 'Copilot Tuning', html: paneCopilot, group: 'advanced' },
+    { id: 'claude', label: 'Claude Tuning', html: paneClaude, group: 'advanced' },
+    { id: 'budget', label: 'Budget', html: paneBudget, group: 'advanced' },
+    { id: 'advanced', label: 'Advanced', html: paneAdvanced, group: 'advanced' },
   ];
 
+  // Rail fold registry: group id → display label. Sections opt in via `group`.
+  const RAIL_GROUPS = { advanced: { label: 'Advanced' } };
+  const ADV_FOLD_KEY = 'minions.settings.advancedFoldOpen';
+
   // localStorage-persisted active tab. Falls back to the first section when no
   // saved value or the saved value points at a section we no longer render.
   const SAVED_TAB_KEY = 'minions.settings.activeTab';
@@ -741,12 +752,41 @@ async function openSettings() {
     if (saved && sections.some(s => s.id === saved)) activeTab = saved;
   } catch { /* localStorage may be blocked in some embeds */ }
 
-  const railHtml = sections.map(s =>
-    '<button class="settings-rail-btn' + (s.featured ? ' featured' : '') + (s.id === activeTab ? ' active' : '') + '" data-settings-tab="' + s.id + '" type="button">' +
+  // Compute the Advanced fold's initial expanded state. Default (no saved
+  // value) is COLLAPSED. Persisted choice survives reloads. If the restored
+  // active tab lives inside the fold, force it open so the active rail button
+  // is visible on load.
+  let advancedFoldOpen = false;
+  try { advancedFoldOpen = localStorage.getItem(ADV_FOLD_KEY) === '1'; } catch { /* localStorage may be blocked in some embeds */ }
+  if (sections.some(s => s.id === activeTab && s.group === 'advanced')) advancedFoldOpen = true;
+  const foldStates = { advanced: advancedFoldOpen };
+
+  const railBtnHtml = (s, child) =>
+    '<button class="settings-rail-btn' + (s.featured ? ' featured' : '') + (child ? ' settings-rail-btn--child' : '') + (s.id === activeTab ? ' active' : '') + '" data-settings-tab="' + s.id + '" type="button">' +
       '<span class="rail-label">' + escHtml(s.label) + '</span>' +
       '<span class="match-count" style="display:none">0</span>' +
-    '</button>'
-  ).join('');
+    '</button>';
+
+  // Walk the sections in order. Leaves render directly; the first grouped
+  // section emits the whole fold (header + indented child list), and later
+  // members of the same group are skipped (they were rendered with the header).
+  const renderedGroups = new Set();
+  const railHtml = sections.map(function(s) {
+    if (!s.group) return railBtnHtml(s, false);
+    if (renderedGroups.has(s.group)) return '';
+    renderedGroups.add(s.group);
+    const members = sections.filter(x => x.group === s.group);
+    const open = !!foldStates[s.group];
+    const label = (RAIL_GROUPS[s.group] && RAIL_GROUPS[s.group].label) || s.group;
+    return '<button class="settings-rail-fold' + (open ? ' open' : '') + '" data-settings-fold="' + s.group + '" type="button" aria-expanded="' + (open ? 'true' : 'false') + '">' +
+        '<span class="fold-chevron" aria-hidden="true"></span>' +
+        '<span class="rail-label">' + escHtml(label) + '</span>' +
+        '<span class="match-count" style="display:none">0</span>' +
+      '</button>' +
+      '<div class="settings-rail-group' + (open ? ' open' : '') + '" data-settings-group="' + s.group + '" role="group" aria-label="' + escHtml(label) + '">' +
+        members.map(m => railBtnHtml(m, true)).join('') +
+      '</div>';
+  }).join('');
 
   const panesHtml = sections.map(s =>
     '<div class="settings-pane' + (s.id === activeTab ? ' active' : '') + '" data-settings-pane="' + s.id + '">' +
@@ -806,6 +846,20 @@ async function openSettings() {
     });
   });
 
+  // ── Wire up fold headers (expand/collapse the Advanced group) ───────────
+  // <button> headers are keyboard-operable natively (Enter/Space fire click).
+  // The user's choice is persisted so it survives reloads; the render-time
+  // default is collapsed unless the active tab lives inside the fold.
+  body.querySelectorAll('[data-settings-fold]').forEach(function(btn) {
+    btn.addEventListener('click', function() {
+      const gid = btn.getAttribute('data-settings-fold');
+      const open = _toggleSettingsFold(gid);
+      if (gid === 'advanced') {
+        try { localStorage.setItem(ADV_FOLD_KEY, open ? '1' : '0'); } catch { /* ignore */ }
+      }
+    });
+  });
+
   // ── Cross-tab search box ───────────────────────────────────────────────
   // Filters every [data-search] row across every pane. Empty query restores
   // the active-tab view; non-empty query shows ALL panes with matches and
@@ -1257,6 +1311,32 @@ function _selectSettingsTab(id) {
   body.querySelectorAll('[data-settings-pane]').forEach(function(pane) {
     pane.classList.toggle('active', pane.getAttribute('data-settings-pane') === id);
   });
+  // If the selected tab lives inside a collapsed fold, expand the fold so its
+  // rail button is visible. The pane renders regardless of fold state.
+  const activeBtn = body.querySelector('[data-settings-tab="' + id + '"]');
+  const group = activeBtn && activeBtn.closest('[data-settings-group]');
+  if (group) {
+    group.classList.add('open');
+    const gid = group.getAttribute('data-settings-group');
+    const fold = body.querySelector('[data-settings-fold="' + gid + '"]');
+    if (fold) { fold.classList.add('open'); fold.setAttribute('aria-expanded', 'true'); }
+  }
+}
+
+// Expand/collapse a rail fold. Returns the resulting open state (or undefined
+// if the fold isn't mounted). `forceState` (boolean) sets an explicit state;
+// omitting it toggles. Keeps the header's aria-expanded + chevron in sync.
+function _toggleSettingsFold(groupId, forceState) {
+  const body = document.getElementById('modal-body');
+  if (!body) return undefined;
+  const fold = body.querySelector('[data-settings-fold="' + groupId + '"]');
+  const group = body.querySelector('[data-settings-group="' + groupId + '"]');
+  if (!fold || !group) return undefined;
+  const open = typeof forceState === 'boolean' ? forceState : !group.classList.contains('open');
+  group.classList.toggle('open', open);
+  fold.classList.toggle('open', open);
+  fold.setAttribute('aria-expanded', open ? 'true' : 'false');
+  return open;
 }
 
 function _applySettingsSearch(rawQuery) {
@@ -1281,6 +1361,25 @@ function _applySettingsSearch(rawQuery) {
       const badge = btn.querySelector('.match-count');
       if (badge) badge.style.display = 'none';
     });
+    // Restore each fold's resting state: persisted collapsed default, but kept
+    // open if an active child tab lives inside it (so the visible pane's rail
+    // button isn't hidden). Clears any search-driven fold badge/no-match.
+    body.querySelectorAll('[data-settings-fold]').forEach(function(fold) {
+      const gid = fold.getAttribute('data-settings-fold');
+      const group = body.querySelector('[data-settings-group="' + gid + '"]');
+      if (!group) return;
+      fold.classList.remove('no-match');
+      const foldBadge = fold.querySelector('.match-count');
+      if (foldBadge) foldBadge.style.display = 'none';
+      let open = false;
+      if (gid === 'advanced') {
+        try { open = localStorage.getItem('minions.settings.advancedFoldOpen') === '1'; } catch { /* ignore */ }
+      }
+      if (group.querySelector('[data-settings-tab].active')) open = true;
+      group.classList.toggle('open', open);
+      fold.classList.toggle('open', open);
+      fold.setAttribute('aria-expanded', open ? 'true' : 'false');
+    });
     return;
   }
 
@@ -1311,6 +1410,32 @@ function _applySettingsSearch(rawQuery) {
       }
     }
   });
+
+  // Fold handling during search: expand any fold that has a matching child so
+  // results aren't hidden behind a collapsed header, aggregate the child match
+  // counts onto the fold header badge, and dim folds with zero matches. Runs
+  // AFTER the per-pane loop so child rail badges are already computed.
+  body.querySelectorAll('[data-settings-fold]').forEach(function(fold) {
+    const gid = fold.getAttribute('data-settings-fold');
+    const group = body.querySelector('[data-settings-group="' + gid + '"]');
+    if (!group) return;
+    let total = 0;
+    let anyMatch = false;
+    group.querySelectorAll('[data-settings-tab]').forEach(function(cb) {
+      if (!cb.classList.contains('no-match')) anyMatch = true;
+      const badge = cb.querySelector('.match-count');
+      if (badge && badge.style.display !== 'none') total += Number(badge.textContent) || 0;
+    });
+    group.classList.toggle('open', anyMatch);
+    fold.classList.toggle('open', anyMatch);
+    fold.setAttribute('aria-expanded', anyMatch ? 'true' : 'false');
+    fold.classList.toggle('no-match', !anyMatch);
+    const foldBadge = fold.querySelector('.match-count');
+    if (foldBadge) {
+      foldBadge.textContent = String(total);
+      foldBadge.style.display = total > 0 ? 'inline-block' : 'none';
+    }
+  });
 }
 
 async function saveSettings() {
@@ -1682,7 +1807,7 @@ async function removeProject(name) {
   }
 }
 
-window.MinionsSettings = { openSettings, saveSettings, addProject, removeProject, resetSettingsToDefaults, _selectSettingsTab, _applySettingsSearch };
+window.MinionsSettings = { openSettings, saveSettings, addProject, removeProject, resetSettingsToDefaults, _selectSettingsTab, _applySettingsSearch, _toggleSettingsFold };
 
 // ── Settings embed mode (Slim UX parity — W-mrkpke07000i8ed5) ───────────
 // The Slim UX Settings modal embeds this LITERAL classic Settings surface in

package/dashboard/styles.css

@@ -1308,6 +1308,19 @@
   .settings-rail-btn.active { color: var(--blue); border-left-color: var(--blue); background: var(--surface); font-weight: 600; }
   .settings-rail-btn.no-match { opacity: 0.3; }
   .settings-rail-btn .match-count { font-size: var(--text-xs); color: var(--blue); background: var(--bg); border-radius: var(--radius-xl); padding: 1px 6px; min-width: 18px; text-align: center; }
+  /* W-mryz3r7h — collapsible rail fold ("Advanced"). The fold header is a real
+     <button> (keyboard-operable); child rail buttons live in a container that
+     is hidden unless the fold is .open. Children are indented under the header. */
+  .settings-rail-fold { display: flex; align-items: center; gap: var(--space-2); width: 100%; padding: var(--space-3) var(--space-6); background: transparent; border: none; border-left: 3px solid transparent; color: var(--muted); font-size: var(--text-md); font-weight: 400; font-family: inherit; cursor: pointer; text-align: left; transition: all var(--transition-fast); }
+  .settings-rail-fold:hover { color: var(--text); background: var(--surface); }
+  .settings-rail-fold.no-match { opacity: 0.3; }
+  .settings-rail-fold .rail-label { flex: 1; }
+  .settings-rail-fold .match-count { font-size: var(--text-xs); color: var(--blue); background: var(--bg); border-radius: var(--radius-xl); padding: 1px 6px; min-width: 18px; text-align: center; }
+  .settings-rail-fold .fold-chevron::before { content: '\25B8'; display: inline-block; font-size: var(--text-xs); color: var(--muted); transition: transform var(--transition-fast); }
+  .settings-rail-fold.open .fold-chevron::before { transform: rotate(90deg); }
+  .settings-rail-group { display: none; }
+  .settings-rail-group.open { display: block; }
+  .settings-rail-btn--child { padding-left: var(--space-9); }
   .settings-content { flex: 1; overflow-y: auto; padding: var(--space-7) var(--space-8); min-width: 0; }
   .settings-pane { display: none; }
   .settings-pane.active { display: block; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yemi33/minions",
-  "version": "0.1.2414",
+  "version": "0.1.2415",
   "description": "Multi-agent AI dev team that runs from ~/.minions/ — five autonomous agents share a single engine, dashboard, and knowledge base",
   "bin": {
     "minions": "bin/minions.js"