codex-overleaf-link 2.5.0 → 2.6.0

package/extension/src/content/sessionMenuView.js

@@ -11,6 +11,7 @@
       getPanel,
       getSessionDisplayTitle,
       getState,
+      icons = null,
       isDisplayableSession,
       isSessionRunning,
       startNewSession,
@@ -20,19 +21,20 @@
 
     function applySessionLabel() {
       const trigger = getPanel().querySelector('[data-session-menu-trigger]');
-      if (trigger) {
-        trigger.title = tr('sessionMenuOpen');
-        trigger.setAttribute('aria-label', tr('sessionMenuOpen'));
-      }
       const textNode = getPanel().querySelector('[data-session-label-text]');
       const deleteButton = getPanel().querySelector('[data-session-delete]');
       const renameButton = getPanel().querySelector('[data-session-rename]');
       const renameInput = getPanel().querySelector('[data-session-rename-input]');
       const active = getActiveSession(getState());
+      const label = active && isDisplayableSession(active)
+        ? getSessionDisplayTitle(active)
+        : tr('newSessionFallback');
       if (textNode) {
-        textNode.textContent = active && isDisplayableSession(active)
-          ? getSessionDisplayTitle(active)
-          : tr('newSessionFallback');
+        textNode.textContent = label;
+      }
+      if (trigger) {
+        trigger.title = `${label} · ${tr('sessionMenuOpen')}`;
+        trigger.setAttribute('aria-label', `${tr('sessionMenuOpen')}: ${label}`);
       }
       if (deleteButton) {
         const running = active ? isSessionRunning(active) : false;
@@ -111,11 +113,15 @@
         .slice()
         .sort((a, b) => String(b.updatedAt || b.createdAt || '').localeCompare(String(a.updatedAt || a.createdAt || '')));
       for (const session of sessions) {
-        const row = document.createElement('button');
-        row.type = 'button';
+        const row = document.createElement('div');
         row.className = 'codex-session-menu-item';
+        row.setAttribute('role', 'none');
         row.dataset.active = session.id === state?.activeSessionId ? 'true' : 'false';
         row.dataset.running = isSessionRunning(session) ? 'true' : 'false';
+        const switchButton = document.createElement('button');
+        switchButton.type = 'button';
+        switchButton.className = 'codex-session-menu-switch';
+        switchButton.setAttribute('role', 'menuitem');
         const title = document.createElement('span');
         title.className = 'codex-session-menu-item-title';
         title.textContent = getSessionDisplayTitle(session);
@@ -127,26 +133,56 @@
         if (absoluteTs) {
           time.title = new Date(absoluteTs).toLocaleString();
         }
-        row.append(title, time);
-        row.addEventListener('click', event => {
+        switchButton.append(title, time);
+        switchButton.addEventListener('click', event => {
           event.stopPropagation();
           closeSessionMenu();
           if (session.id !== getState()?.activeSessionId) {
             switchSession(session.id);
           }
         });
+        const deleteButton = menuAction('codex-session-menu-item-delete', 'close', '',
+          row.dataset.running === 'true' ? tr('deleteRunningSession') : tr('deleteSession'),
+          () => deleteSessionWithConfirm(session.id));
+        deleteButton.setAttribute('role', 'menuitem');
+        deleteButton.disabled = row.dataset.running === 'true';
+        row.append(switchButton, deleteButton);
         menu.append(row);
       }
-      const createButton = document.createElement('button');
-      createButton.type = 'button';
-      createButton.className = 'codex-session-menu-new';
-      createButton.textContent = `+ ${tr('newSession')}`;
-      createButton.addEventListener('click', event => {
+      const footer = document.createElement('div');
+      footer.className = 'codex-session-menu-footer';
+      const active = getActiveSession(state);
+      const running = active ? isSessionRunning(active) : false;
+      const soleEmpty = Boolean(active) && !isDisplayableSession(active) && (state?.sessions || []).length <= 1;
+      const createButton = menuAction('codex-session-menu-new', 'plus', tr('sessionMenuNewShort'), tr('newSession'), () => startNewSession());
+      const renameButton = menuAction('codex-session-menu-rename', 'pencil', tr('sessionMenuRenameShort'), tr('renameSession'), () => beginActiveSessionRename());
+      renameButton.disabled = !active;
+      const deleteButton = menuAction('codex-session-menu-delete', 'close', tr('sessionMenuDeleteShort'),
+        running ? tr('deleteRunningSession') : tr('deleteSession'), () => {
+          if (getState()?.activeSessionId) deleteSessionWithConfirm(getState().activeSessionId);
+        });
+      deleteButton.disabled = !active || running || soleEmpty;
+      footer.append(createButton, renameButton, deleteButton);
+      menu.append(footer);
+    }
+
+    function menuAction(className, iconName, label, description, onSelect) {
+      const button = document.createElement('button');
+      button.type = 'button';
+      button.className = className;
+      button.title = description;
+      button.setAttribute('aria-label', description);
+      const glyph = icons?.svg?.(iconName);
+      if (glyph) button.insertAdjacentHTML('beforeend', glyph);
+      const text = document.createElement('span');
+      text.textContent = label;
+      button.append(text);
+      button.addEventListener('click', event => {
         event.stopPropagation();
         closeSessionMenu();
-        startNewSession();
+        onSelect();
       });
-      menu.append(createButton);
+      return button;
     }
 
     function beginActiveSessionRename() {

package/extension/src/content/sessionPersistence.js

@@ -74,20 +74,40 @@
       .filter(record => !deleted.has(record.id))
       .map(record => [record.id, record]));
     const mergedRecords = sessionRecords.map(record => StorageDb.mergeSessionReviewState?.(
-      record, existingById.get(record.id), options.reviewRunIds
+      record, existingById.get(record.id), options.reviewRunIds, { shared: StorageDb.sharedSessionsEnabled?.() === true }
     ) || record);
+    const reviewRunIds = new Set(options.reviewRunIds || []);
+    // Shared storage merges local edits and explicitly requested Undo markers
+    // against the page baseline. Legacy and ordinary stale saves keep the age guard.
     const writable = mergedRecords.filter(record => {
       const existing = existingById.get(record.id);
       if (!existing) return true;
-      return (Date.parse(record.updatedAt || '') || 0) >= (Date.parse(existing.updatedAt || '') || 0);
+      return (Date.parse(record.updatedAt || '') || 0) >= (Date.parse(existing.updatedAt || '') || 0)
+        || (StorageDb.sharedSessionsEnabled?.() === true
+          && (StorageDb.hasUnpersistedSharedSession?.(record) === true
+            || (record.runs || []).some(run => reviewRunIds.has(run.id) && run.undoOwnerProtocol === 1)));
     });
     const cleanedExisting = existingSessions.filter((record, index) =>
       record !== rawExistingSessions[index] && !writable.some(item => item.id === record.id)
     );
     if (cleanedExisting.length || writable.length) {
-      const written = await StorageDb.putRecords('sessions', [...cleanedExisting, ...writable], {
-        reviewRunIds: options.reviewRunIds
-      });
+      const reviewReceipts = [];
+      if (StorageDb.sharedSessionsEnabled?.() === true && reviewRunIds.size) {
+        for (const record of writable) {
+          const ids = (record.runs || []).filter(run => reviewRunIds.has(run.id)).map(run => run.id);
+          if (ids.length) reviewReceipts.push(await StorageDb.putSessionReviewState(record, ids));
+        }
+      }
+      let written;
+      try {
+        written = await StorageDb.putRecords('sessions', [...cleanedExisting, ...writable], {
+          reviewRunIds: options.reviewRunIds, reviewReceipts
+        });
+      } catch (error) {
+        if (error.code === 'shared_session_conflict' && reviewReceipts.length)
+          Object.defineProperty(error, 'reviewReceipts', { value: reviewReceipts, configurable: true });
+        throw error;
+      }
       // Check the actual durable result, including a decision already saved
       // from another origin, instead of acknowledging only the proposed view.
       return written.filter(record => writable.some(candidate => candidate.id === record.id));

package/extension/src/content/settingsPanel.js

@@ -9,8 +9,10 @@
 
   function codexIcon(name) {
     const icons = {
+      archive: '<rect x="2.5" y="3" width="11" height="3.2" rx=".8"/><path d="M3.5 6.2v6.3a1 1 0 0 0 1 1h7a1 1 0 0 0 1-1V6.2"/><path d="M6.5 9h3"/>',
       appearance: '<path d="M8 2.2v1.1"/><path d="M8 12.7v1.1"/><path d="M2.2 8h1.1"/><path d="M12.7 8h1.1"/><path d="m3.9 3.9.8.8"/><path d="m11.3 11.3.8.8"/><path d="m12.1 3.9-.8.8"/><path d="m4.7 11.3-.8.8"/><circle cx="8" cy="8" r="2.4"/>',
       bolt: '<path d="M8.9 1.8 3.8 8.8h3.3l-.5 5.4 5.5-7.5H8.8z"/>',
+      close: '<path d="m4.6 4.6 6.8 6.8M11.4 4.6l-6.8 6.8"/>',
       database: '<ellipse cx="8" cy="4" rx="4.5" ry="1.9"/><path d="M3.5 4v4c0 1 2 1.9 4.5 1.9s4.5-.9 4.5-1.9V4"/><path d="M3.5 8v4c0 1 2 1.9 4.5 1.9s4.5-.9 4.5-1.9V8"/>',
       flask: '<path d="M6 2.5h4"/><path d="M7 2.5v4.1l-3.4 5.3A1.4 1.4 0 0 0 4.8 14h6.4a1.4 1.4 0 0 0 1.2-2.1L9 6.6V2.5"/><path d="M5.3 10.5h5.4"/>',
       history: '<path d="M4.2 3.4h7.6"/><path d="M4.2 8h7.6"/><path d="M4.2 12.6h4.6"/><path d="M2.2 3.4h.1"/><path d="M2.2 8h.1"/><path d="M2.2 12.6h.1"/>',
@@ -36,7 +38,9 @@
       container,
       callbacks: options.callbacks || {},
       i18n: options.i18n || null,
-      button: options.button || null
+      button: options.button || null,
+      // Names the open project in project-page scope lines; may return ''.
+      getProjectName: typeof options.getProjectName === 'function' ? options.getProjectName : null
     };
 
     container.innerHTML = `
@@ -211,6 +215,7 @@
                 <p class="codex-set-row-help" data-update-settings-summary data-i18n="softwareUpdatesHelp">Automatically checks signed stable releases for the Extension and Native Host.</p>
                 <p class="codex-set-note" data-update-settings-state aria-live="polite" hidden></p>
                 <button type="button" class="codex-set-btn" data-check-updates data-i18n="checkForUpdates">Check for updates</button>
+                <button type="button" class="codex-set-btn" data-restore-previous-version hidden>Restore previous version</button>
               </div>
             </div>
           </details>
@@ -242,7 +247,7 @@
               </label>
               <p class="codex-set-row-help" data-i18n="loadCodexLocalSkillsHelp">Pull skills from your local Codex installation.</p>
               <button type="button" class="codex-skills-entry" data-skills-entry>
-                <span class="codex-skills-entry-label" data-i18n="codexOverleafSkillsEntry">Codex Overleaf skills</span>
+                <span class="codex-skills-entry-label" data-i18n="skillsManageEntry">Manage skills</span>
                 <span class="codex-skills-entry-summary" data-skills-entry-summary></span>
                 <span class="codex-skills-entry-chevron" aria-hidden="true">›</span>
               </button>
@@ -252,9 +257,9 @@
       </section>
       <section class="codex-custom-instructions-panel codex-skills-panel" data-skills-screen>
         <div class="codex-custom-instructions-head">
-          <button type="button" data-skills-back title="Back" aria-label="Back">‹</button>
+          <button type="button" data-skills-back data-i18n-title="settingsBack" data-i18n-aria-label="settingsBack" title="Back" aria-label="Back">‹</button>
           <div>
-            <div class="codex-custom-instructions-title" data-i18n="codexOverleafSkillsTitle">Codex Overleaf skills</div>
+            <div class="codex-custom-instructions-title" data-i18n="localSkillsTitle">Skills</div>
           </div>
           <span class="codex-set-saved" data-set-saved hidden><svg class="codex-glyph" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="m3.5 8 3 3 6-6"/></svg><span data-i18n="settingsSaved">Saved</span></span>
         </div>
@@ -266,6 +271,9 @@
         </div>
         <div class="codex-skills-divider"></div>
         <div class="codex-local-skill-list" data-local-skill-list></div>
+        <div class="codex-skills-divider"></div>
+        <div class="codex-wb-skills-list-title codex-wb-skills-caption" data-i18n="codexLocalSkillsTitle">Local Codex skills</div>
+        <div class="codex-local-skill-list" data-codex-local-skill-list></div>
       </section>
     `;
 
@@ -331,6 +339,7 @@
         return host || null;
       },
       setProviderCloseGuard: guard => instance.workbench?.setProviderCloseGuard(guard),
+      revealGroup: key => instance.workbench?.revealGroup(key) || null,
       loadState: state => loadState(instance, state),
       readState: () => readState(instance),
       setStatus: (text, status) => setStatus(instance, text, status),
@@ -338,6 +347,7 @@
       setSkillsSummary: text => setSkillsSummary(instance, text),
       setProviderSummary: summary => setProviderSummary(instance, summary),
       refreshNotes: () => updateGovernanceNotes(instance),
+      refreshLocale: () => instance.workbench?.refresh(),
       destroy: () => destroy(instance),
       _instance: instance
     };
@@ -460,7 +470,9 @@
     };
   }
 
-  function setStatus(target, text, status = 'info') {
+  // options.page names the workbench page a message belongs to; the workbench
+  // shows it only while that page is active. Untagged messages show everywhere.
+  function setStatus(target, text, status = 'info', options = {}) {
     const instance = target?._instance || target;
     const element = instance?.container?.querySelector('[data-project-settings-status]');
     if (!element) {
@@ -468,6 +480,9 @@
     }
     element.textContent = text || '';
     element.dataset.status = status;
+    if (options.page) element.dataset.statusPage = options.page;
+    else delete element.dataset.statusPage;
+    instance.workbench?.refresh();
   }
 
   function clearStatus(target) {
@@ -478,6 +493,8 @@
     }
     element.textContent = '';
     delete element.dataset.status;
+    delete element.dataset.statusPage;
+    instance.workbench?.refresh();
   }
 
   function setSkillsSummary(target, text) {

package/extension/src/content/settingsWorkbench.js

@@ -4,21 +4,32 @@
 })(typeof globalThis !== 'undefined' ? globalThis : this, function () {
   'use strict';
 
-  const CATEGORIES = [
-    ['general', 'settingsWorkbenchGeneral', 'appearance'],
-    ['providers', 'settingsWorkbenchModels', 'bolt'],
-    ['context', 'settingsWorkbenchContext', 'database'],
-    ['instructions', 'settingsWorkbenchInstructions', 'pen'],
-    ['protection', 'settingsWorkbenchProtection', 'shield'],
-    ['history', 'settingsWorkbenchHistory', 'history'],
-    ['updates', 'softwareUpdatesTitle', 'software']
+  // The sidebar is split by scope; a page's section decides whether its groups
+  // need an open project. Pages: [id, label key, icon].
+  const SECTIONS = [
+    ['project', 'settingsScopeProjectTitle', [
+      ['writing', 'settingsWorkbenchWriting', 'pen'],
+      ['protection', 'settingsWorkbenchProtection', 'shield'],
+      ['cache', 'otSettingsTitle', 'flask'],
+      ['history', 'settingsWorkbenchChanges', 'history']
+    ]],
+    ['global', 'settingsScopeGlobalTitle', [
+      ['appearance', 'appearanceTitle', 'appearance'],
+      ['providers', 'settingsWorkbenchModels', 'bolt'],
+      ['context', 'settingsWorkbenchContextSkills', 'database'],
+      ['storage', 'storageTitle', 'archive'],
+      ['updates', 'softwareUpdatesTitle', 'software']
+    ]]
   ];
   const GROUP_PAGES = {
-    appearance: 'general', 'writing-style': 'general', providers: 'providers', 'context-loading': 'context',
-    experimental: 'context', personalization: 'instructions', protection: 'protection',
-    privacy: 'protection', history: 'history', storage: 'history', updates: 'updates'
+    'writing-style': 'writing', personalization: 'writing', protection: 'protection', privacy: 'protection',
+    experimental: 'cache', history: 'history', appearance: 'appearance', providers: 'providers',
+    'context-loading': 'context', skills: 'context', storage: 'storage', updates: 'updates'
   };
-  const PROJECT_GROUPS = new Set(['writing-style', 'personalization', 'protection', 'privacy', 'experimental', 'history']);
+  // Groups without a mapping keep their original scope.
+  const FALLBACK_PAGES = { project: 'writing', global: 'context' };
+  // The skills list opens in place of the page that holds the Skills group.
+  const SKILLS_PAGE = 'context';
 
   function mount(instance, options = {}) {
     const container = instance.container, doc = container.ownerDocument;
@@ -50,93 +61,94 @@
     const status = settings.querySelector('[data-project-settings-status]');
     const dialog = make('dialog', 'codex-settings-workbench');
     dialog.setAttribute('aria-labelledby', 'codex-settings-workbench-title');
-    const header = make('header', 'codex-wb-header');
-    const heading = make('div', 'codex-wb-heading');
-    const title = make('h2', '', 'settingsWorkbenchTitle');
+    const title = make('h2', 'codex-wb-title', 'settingsWorkbenchTitle');
     title.id = 'codex-settings-workbench-title';
-    heading.append(title, make('p', '', 'settingsWorkbenchSubtitle'));
     closeButton.classList.add('codex-wb-close');
-    closeButton.textContent = '\u00d7';
-    header.append(heading, closeButton);
+    if (options.icon) closeButton.innerHTML = options.icon('close'); // Static, repository-owned icon path.
+    else closeButton.textContent = '\u00d7';
     originalHead?.remove();
 
     const layout = make('div', 'codex-wb-layout');
     const sidebar = make('aside', 'codex-wb-sidebar');
-    const filters = make('div', 'codex-wb-filters');
-    filters.setAttribute('role', 'group');
-    const allFilter = button('', 'settingsWorkbenchAll');
-    const projectFilter = button('', 'settingsScopeProjectTitle');
-    filters.append(allFilter, projectFilter);
     const nav = make('nav', 'codex-wb-nav');
     nav.setAttribute('role', 'tablist');
     nav.setAttribute('aria-orientation', 'vertical');
-    const brand = make('div', 'codex-wb-brand');
-    brand.textContent = 'Codex Overleaf Link';
-    sidebar.append(filters, nav, brand);
+    sidebar.append(title, nav);
     const main = make('div', 'codex-wb-main');
     const body = make('div', 'codex-wb-body');
     const footer = make('footer', 'codex-wb-footer');
     if (status) { status.setAttribute('aria-live', 'polite'); footer.append(status); }
     main.append(body, footer);
     layout.append(sidebar, main);
-    dialog.append(header, layout);
-    const pages = new Map(), navButtons = new Map(), groups = [];
-    let active = 'general', filter = 'all', returnFocus = null, destroyed = false;
+    // The close button floats over the content's top-right corner.
+    dialog.append(layout, closeButton);
+    const pages = new Map(), navButtons = new Map(), pageScopes = new Map(), sectionLabels = new Map(), groups = [];
+    let active = 'writing', returnFocus = null, destroyed = false;
     let providerRequested = false, providerCloseGuard = null, closing = null;
 
-    for (const [id, key, icon] of CATEGORIES) {
-      const page = make('section', 'codex-wb-page');
-      page.id = 'codex-settings-page-' + id;
-      page.dataset.workbenchPage = id;
-      page.setAttribute('role', 'tabpanel');
-      page.setAttribute('aria-labelledby', 'codex-settings-nav-' + id);
-      page.hidden = true;
-      page.append(make('h3', 'codex-wb-page-title', key));
-      pages.set(id, page);
-      const tab = button('codex-wb-nav-button');
-      tab.id = 'codex-settings-nav-' + id;
-      tab.setAttribute('role', 'tab');
-      tab.setAttribute('aria-controls', page.id);
-      if (options.icon) {
-        const glyph = make('span', 'codex-wb-nav-icon');
-        glyph.innerHTML = options.icon(icon); // Static, repository-owned icon paths only.
-        tab.append(glyph);
+    for (const [scope, sectionKey, items] of SECTIONS) {
+      // Visual section heading; each tab references it as its description.
+      const label = make('div', 'codex-wb-nav-section', sectionKey);
+      label.id = 'codex-settings-nav-section-' + scope;
+      label.setAttribute('aria-hidden', 'true');
+      nav.append(label);
+      sectionLabels.set(scope, label);
+      for (const [id, key, icon] of items) {
+        const page = make('section', 'codex-wb-page');
+        page.id = 'codex-settings-page-' + id;
+        page.dataset.workbenchPage = id;
+        page.setAttribute('role', 'tabpanel');
+        page.setAttribute('aria-labelledby', 'codex-settings-nav-' + id);
+        page.hidden = true;
+        page.append(make('h3', 'codex-wb-page-title', key), make('p', 'codex-wb-page-scope'));
+        pages.set(id, page);
+        pageScopes.set(id, scope);
+        const tab = button('codex-wb-nav-button');
+        tab.id = 'codex-settings-nav-' + id;
+        tab.setAttribute('role', 'tab');
+        tab.setAttribute('aria-controls', page.id);
+        tab.setAttribute('aria-describedby', label.id);
+        if (options.icon) {
+          const glyph = make('span', 'codex-wb-nav-icon');
+          glyph.innerHTML = options.icon(icon); // Static, repository-owned icon paths only.
+          tab.append(glyph);
+        }
+        tab.append(make('span', '', key));
+        listen(tab, 'click', () => select(id));
+        nav.append(tab);
+        navButtons.set(id, tab);
       }
-      tab.append(make('span', '', key));
-      listen(tab, 'click', () => select(id));
-      nav.append(tab);
-      navButtons.set(id, tab);
     }
-    function addGroup(node, category, projectOnly) {
+    function addGroup(node, category) {
+      const projectOnly = pageScopes.get(category) === 'project';
       node.hidden = true;
       node.dataset.workbenchScope = projectOnly ? 'project' : 'global';
       const summary = node.querySelector('summary');
-      const badge = make('span', 'codex-wb-scope-label',
-        projectOnly ? 'settingsScopeProjectTitle' : 'settingsScopeGlobalTitle');
-      (summary || node).append(badge);
+      if (summary) {
+        // Groups are plain sections: always open while their page is shown.
+        summary.tabIndex = -1;
+        listen(summary, 'click', event => event.preventDefault());
+      }
       pages.get(category).append(node);
-      groups.push({ node, category, projectOnly, expanded: true });
+      groups.push({ node, category, projectOnly });
     }
+    const fallbackPage = scope => FALLBACK_PAGES[
+      scope && !scope.classList.contains('codex-project-settings-scope--global') ? 'project' : 'global'];
     // Move existing controls rather than copying them. Their listeners, unsaved
     // values, identity, validation and persistence callbacks remain attached.
     for (const group of Array.from(settings.querySelectorAll('[data-set-group]'))) {
       const key = group.dataset.setGroup;
-      const originalScope = group.closest('.codex-project-settings-scope');
-      const projectOnly = PROJECT_GROUPS.has(key)
-        || (!GROUP_PAGES[key] && originalScope && !originalScope.classList.contains('codex-project-settings-scope--global'));
-      addGroup(group, GROUP_PAGES[key] || 'instructions', Boolean(projectOnly));
+      addGroup(group, GROUP_PAGES[key] || fallbackPage(group.closest('.codex-project-settings-scope')));
     }
-    // Preserve non-card controls, including the legacy skill-loading entry.
-    // Scope headings are replaced by labels on the actual groups.
+    // Preserve non-card controls. The sidebar sections replace the scope headings.
     for (const scope of Array.from(settings.querySelectorAll('.codex-project-settings-scope'))) {
       scope.querySelectorAll('.codex-project-settings-scope-title').forEach(node => node.remove());
-      if (scope.children.length) {
-        addGroup(scope, 'instructions', !scope.classList.contains('codex-project-settings-scope--global'));
-      } else scope.remove();
+      if (scope.children.length) addGroup(scope, fallbackPage(scope));
+      else scope.remove();
     }
     for (const node of Array.from(settings.children)) {
       if (node === status) continue;
-      addGroup(node, 'instructions', false);
+      addGroup(node, FALLBACK_PAGES.global);
     }
     const providerHost = make('div', 'codex-wb-provider-host');
     providerHost.dataset.providerSettingsHost = '';
@@ -218,31 +230,62 @@
         && /^\/project\/[^/]+/.test(win?.location?.pathname || '');
     }
     function available(item) {
-      return (!item.projectOnly || hasProject()) && (filter !== 'project' || item.projectOnly);
+      return !item.projectOnly || hasProject();
+    }
+    // A page whose only visible group repeats the page title hides that group's
+    // title; the group header keeps only its Saved mark.
+    function refreshSoleSections() {
+      for (const page of pages.values()) {
+        const pageGroups = Array.from(page.querySelectorAll('.codex-set-group'));
+        const visibleGroups = pageGroups.filter(node => !node.hidden);
+        const pageTitle = page.querySelector('.codex-wb-page-title')?.textContent.trim();
+        for (const node of pageGroups) {
+          const groupTitle = node.querySelector('.codex-set-group-head .codex-set-group-title');
+          const sole = visibleGroups.length === 1 && visibleGroups[0] === node
+            && groupTitle && groupTitle.textContent.trim() === pageTitle;
+          if (sole) node.dataset.soleSection = 'true';
+          else delete node.dataset.soleSection;
+        }
+      }
+    }
+    // Each page states its scope once, under its title.
+    function renderPageScope(page, scope, projectName) {
+      const line = page.querySelector('.codex-wb-page-scope');
+      if (!line) return;
+      const text = t(scope === 'project' ? 'settingsPageScopeProject' : 'settingsPageScopeGlobal');
+      if (scope !== 'project' || !projectName) { line.textContent = text; return; }
+      const name = doc.createElement('b');
+      name.textContent = projectName;
+      line.replaceChildren(text + ' \u00b7 ', name);
     }
     function refresh() {
       if (destroyed) return;
-      if (!hasProject()) filter = 'all';
-      if (panel.dataset.view === 'skills') { active = 'instructions'; filter = 'all'; }
+      if (panel.dataset.view === 'skills') active = SKILLS_PAGE;
       const availablePages = new Set(groups.filter(available).map(item => item.category));
-      if (!availablePages.has(active)) active = CATEGORIES.find(([id]) => availablePages.has(id))?.[0] || 'general';
+      if (!availablePages.has(active)) active = Array.from(navButtons.keys()).find(id => availablePages.has(id)) || 'appearance';
       for (const node of dialog.querySelectorAll('[data-i18n]')) {
         // Existing controls use their established translation pass; update the
         // newly owned chrome only, without replacing controls or skill rows.
-        if (node.closest('.codex-wb-header, .codex-wb-nav, .codex-wb-filters, .codex-wb-footer')
+        if (node.closest('.codex-wb-nav, .codex-wb-footer')
+          || node.classList.contains('codex-wb-title')
           || node.classList.contains('codex-wb-page-title')
-          || node.classList.contains('codex-wb-scope-label')
           || node.classList.contains('codex-wb-theme-caption')
           || node.classList.contains('codex-wb-skills-caption')) node.textContent = t(node.dataset.i18n);
       }
-      projectFilter.disabled = !hasProject();
-      projectFilter.title = hasProject() ? t('settingsWorkbenchProjectFilter') : t('settingsWorkbenchOpenProject');
-      filters.setAttribute('aria-label', t('settingsWorkbenchFilter'));
+      const projectName = hasProject() ? String(instance.getProjectName?.() || '').trim() : '';
+      for (const [id, page] of pages) renderPageScope(page, pageScopes.get(id), projectName);
+      for (const [scope, label] of sectionLabels) {
+        label.hidden = !Array.from(pageScopes).some(([id, pageScope]) => pageScope === scope && availablePages.has(id));
+      }
       nav.setAttribute('aria-label', t('settingsWorkbenchCategories'));
-      allFilter.setAttribute('aria-pressed', String(filter === 'all'));
-      projectFilter.setAttribute('aria-pressed', String(filter === 'project'));
       closeButton.title = t('settingsWorkbenchClose');
       closeButton.setAttribute('aria-label', t('settingsWorkbenchClose'));
+      const skillsBack = skills?.querySelector('[data-skills-back]');
+      if (skillsBack) {
+        skillsBack.title = t('settingsBack');
+        skillsBack.setAttribute('aria-label', t('settingsBack'));
+      }
+      if (status) status.hidden = Boolean(status.dataset.statusPage) && status.dataset.statusPage !== active;
       for (const [id, tab] of navButtons) {
         tab.hidden = !availablePages.has(id);
         tab.setAttribute('aria-selected', String(id === active));
@@ -251,12 +294,11 @@
       }
       for (const item of groups) {
         const visible = available(item) && item.category === active && panel.dataset.view !== 'skills';
-        if (item.node.tagName === 'DETAILS' && item.node.hidden !== !visible) {
-          if (!visible) item.expanded = item.node.open;
-          item.node.open = visible && item.expanded;
-        }
+        // Opening a group when its page is shown keeps the lazy toggle loaders (history, storage).
+        if (item.node.tagName === 'DETAILS' && item.node.open !== visible) item.node.open = visible;
         item.node.hidden = !visible;
       }
+      refreshSoleSections();
       updateThemes();
     }
     function requestProviders() {
@@ -272,9 +314,17 @@
       try { Promise.resolve(instance.callbacks.onProvidersOpen()).catch(failed); }
       catch (error) { failed(error); }
     }
+    // Shows the page that holds a group and returns the group, or null when the
+    // group is unavailable (for example a project group outside a project).
+    function revealGroup(key) {
+      const item = groups.find(entry => entry.node.dataset?.setGroup === key);
+      if (!item || !available(item)) return null;
+      active = item.category;
+      refresh();
+      return item.node;
+    }
     function revealProviders() {
       active = 'providers';
-      filter = 'all';
       providerRequested = true;
       pages.get('providers').dataset.providerEmbedded = 'true';
       panel.dataset.view = 'settings';
@@ -325,13 +375,6 @@
       if (['settings', 'skills'].includes(panel.dataset.view)) show();
       else hide();
     };
-    listen(allFilter, 'click', () => { filter = 'all'; refresh(); });
-    listen(projectFilter, 'click', () => {
-      filter = 'project';
-      if (panel.dataset.view === 'skills') instance.callbacks.onSkillsBack?.();
-      refresh();
-      body.scrollTop = 0;
-    });
     listen(nav, 'keydown', event => {
       if (!['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) return;
       const tabs = Array.from(navButtons.values()).filter(tab => !tab.hidden);
@@ -358,7 +401,7 @@
     observer.observe(panel, { attributes: true, attributeFilter: ['data-view', 'data-settings-scope', 'data-theme'] });
     refresh();
     return {
-      show, hide, refresh, revealProviders,
+      show, hide, refresh, revealGroup, revealProviders,
       setProviderCloseGuard(guard) { providerCloseGuard = guard; },
       destroy() {
         destroyed = true;