@oar-sh/oar 0.9.24 → 0.9.26

package/server/public/app/attachments-view.js

@@ -81,6 +81,8 @@ import {
   galleryNeighborIndex,
   galleryNeighbors,
   galleryPositionLabel,
+  galleryCanStep,
+  extendGallery,
 } from './viewer-gallery.mjs';
 import {
   deepestExistingAncestor,
@@ -672,9 +674,10 @@ function updateFilePreviewUiState() {
   if (bottomChrome) {
     bottomChrome.hidden = !gallery;
     document.getElementById('file-preview-position').textContent = galleryPositionLabel(gallery);
-    document.getElementById('file-preview-prev').disabled = galleryNeighborIndex(gallery, -1) === -1;
-    document.getElementById('file-preview-next').disabled = galleryNeighborIndex(gallery, 1) === -1;
+    document.getElementById('file-preview-prev').disabled = !galleryCanStep(gallery, -1);
+    document.getElementById('file-preview-next').disabled = !galleryCanStep(gallery, 1);
   }
+  renderGalleryDetails(gallery);
 }
 
 /**
@@ -1231,7 +1234,7 @@ export function openUploadedAttachmentViewer(name, contentUrl, mimeType, options
       kind: uploadPreviewKind(mimeType),
       name: String(name || 'attachment'),
       rawUrl: String(contentUrl || ''),
-      size: 0,
+      size: Number(options?.size) > 0 ? Number(options.size) : 0,
       contentType: String(mimeType || '').toLowerCase(),
     },
   });
@@ -1249,7 +1252,7 @@ export function openGalleryItem(item, gallery) {
   if (!item) return Promise.resolve(false);
   const source = item.source || gallery?.source || 'workspace';
   if (source === 'upload') {
-    openUploadedAttachmentViewer(item.name, item.href, item.mime, { gallery });
+    openUploadedAttachmentViewer(item.name, item.href, item.mime, { gallery, size: item.size });
     return Promise.resolve(true);
   }
   const open = source === 'workspace' ? openWorkspaceFilePreview : openDriveFilePreview;
@@ -1335,7 +1338,9 @@ export function renderFilePreview() {
   const kindLabel = String(payload.kind || 'text').toUpperCase();
   const langLabel = payload.language ? ` · ${payload.language}` : '';
   const truncatedLabel = payload.truncated ? ` · truncated to ${formatBytes(FILE_PREVIEW_MAX_BYTES)}` : '';
-  metaEl.textContent = `${kindLabel}${langLabel} · ${formatBytes(payload.size || 0)}${truncatedLabel}`;
+  // An attachment opened by its address may come without a size: no "0 B" then.
+  const sizeLabel = payload.size > 0 || filePreviewState.source !== 'upload' ? ` · ${formatBytes(payload.size || 0)}` : '';
+  metaEl.textContent = `${kindLabel}${langLabel}${sizeLabel}${truncatedLabel}`;
 
   const cardMeta = payload.size > 0 ? formatBytes(payload.size) : '';
 
@@ -1560,13 +1565,65 @@ export async function openWorkspaceFilePreviewFromRepo(rawPath, options = {}) {
 
 /** Show the file `delta` steps along the gallery; false at either end. */
 export async function stepFilePreviewGallery(delta) {
-  const gallery = filePreviewState.gallery;
-  const index = galleryNeighborIndex(gallery, delta);
+  let gallery = filePreviewState.gallery;
+  let index = galleryNeighborIndex(gallery, delta);
+  if (index === -1 && galleryCanStep(gallery, delta)) {
+    // A paged gallery: the next page is fetched and the step goes on into it.
+    let page = null;
+    try {
+      page = await gallery.loadMore();
+    } catch {
+      page = null;
+    }
+    if (filePreviewState.gallery !== gallery) return false;
+    gallery = extendGallery(gallery, page || { items: [], hasMore: false });
+    filePreviewState.gallery = gallery;
+    index = galleryNeighborIndex(gallery, delta);
+    if (index === -1) {
+      renderFilePreview();
+      return false;
+    }
+  }
   if (index === -1) return false;
   const next = galleryAt(gallery, index);
   return openGalleryItem(next.items[index], next);
 }
 
+// What a gallery says about its open item (the media gallery: session,
+// date, who sent it) and the buttons it adds ("Open in session", "Copy
+// path"), built here so the viewer markup stays the same for every gallery.
+function renderGalleryDetails(gallery) {
+  const toolbar = document.querySelector('#file-preview-chrome-top .file-preview-toolbar');
+  let caption = document.getElementById('file-preview-gallery-caption');
+  if (!caption && toolbar) {
+    caption = document.createElement('div');
+    caption.id = 'file-preview-gallery-caption';
+    caption.className = 'file-preview-meta';
+    toolbar.insertAdjacentElement('afterend', caption);
+  }
+  document.querySelectorAll('[data-gallery-action]').forEach((button) => button.remove());
+  const item = gallery?.items?.[gallery.index];
+  const details = item && typeof gallery.describe === 'function' ? gallery.describe(item) : null;
+  if (caption) {
+    caption.textContent = details?.caption || '';
+    caption.hidden = !details?.caption;
+  }
+  if (!toolbar || !Array.isArray(details?.actions)) return;
+  const anchor = document.getElementById('file-preview-copy-btn');
+  for (const action of details.actions) {
+    const button = document.createElement('button');
+    button.type = 'button';
+    button.className = 'file-preview-btn';
+    button.textContent = action.label;
+    button.dataset.galleryAction = action.id;
+    button.addEventListener('click', () => {
+      viewerControls.interaction();
+      void action.run(item);
+    });
+    toolbar.insertBefore(button, anchor || null);
+  }
+}
+
 // Preview payloads of the open file's neighbours, fetched ahead so a swipe
 // lands on the file and not on "Fetching…"; an image's bytes are asked for
 // too, under the very address the viewer will use. Entries are promises.
@@ -2935,8 +2992,8 @@ const viewerSwipe = createSwipeRecognizer({
       return;
     }
     // Past either end the content gives a little, then holds.
-    const toward = galleryNeighborIndex(filePreviewState.gallery, dx < 0 ? 1 : -1);
-    const shift = toward === -1 ? dx * 0.25 : dx;
+    // A page still to load counts as somewhere to go.
+    const shift = galleryCanStep(filePreviewState.gallery, dx < 0 ? 1 : -1) ? dx : dx * 0.25;
     bodyEl.style.transform = `translateX(${shift}px)`;
   },
   onEnd: ({ axis, swipe }) => {

package/server/public/app/bootstrap.js

@@ -161,6 +161,7 @@ import { loadKeepingLiveRows } from './transcript-reload-freshness.mjs';
 import { backgroundTasksSnapshotMark } from './background-tasks-view.mjs';
 import { newerPageReachesEnd } from './transcript-island.mjs';
 import { initPinnedMessagesView, openPinnedMessagesModal, setPinsConversation } from './pinned-messages-view.mjs';
+import { afterContextRender, initContextTabs, leaveContextTab, resetContextTab, wrapContextBody } from './context-media-tab.js';
 import { initHiddenMessagesView, openHiddenMessagesModal, setHiddenMessagesConversation } from './hidden-messages-view.mjs';
 import { bindChatSelectionGuard, chatSelectionGuard, isChatInteractionHeld } from './selection-guard.mjs';
 import { loadRepoBrowserTree, openRepoBrowser, closeRepoBrowser, setRepoBrowserSessionInfo, resetWorkspaceRepoBrowserForRootChange } from './attachments-view.js';
@@ -221,6 +222,13 @@ import {
   sessionLockNoteText,
   sessionLockProviderKey,
 } from './conversation-provider-indicator.mjs';
+import { imageQualityOptions } from './openai-image-composer.mjs';
+import { hideImageComposerControls, syncImageComposerControls } from './image-composer-ui.js';
+import {
+  onOpenAIImageSpendChange,
+  syncChatMenuImageCost,
+  syncOpenAIImageSpendBanner,
+} from './openai-image-cost-ui.js';
 import {
   initMessageSearchView,
   openMessageSearchModal,
@@ -278,6 +286,7 @@ import { closeQuestionsPanel, initQuestionsPanel, openQuestionsPanel, setQuestio
 import { questionsTwinLabel } from './questions-view.mjs';
 import { closeRelaySchedulePanel } from './relay-schedules-ui.js';
 import { isInboxViewActive } from './inbox-ui.js';
+import { isMediaViewActive, leaveMediaView, toggleMediaView } from './media-view.js';
 import { initScrollbarHover } from './scrollbar-hover.mjs';
 import {
   autoCompactWindowNotes,
@@ -297,11 +306,11 @@ import {
   autoCompactWindowFromIndex,
   formatAutoCompactWindowLabel,
 } from './auto-compact-window-options.mjs';
-import { renderPlanUsageHtml, planUsageSubtitle, normalizeUsageProvider } from './plan-usage-view.mjs';
+import { renderPlanUsageHtml, renderPlanUsageCardHtml, planUsageSubtitle, normalizeUsageProvider } from './plan-usage-view.mjs';
 import { revealSelectedTabs, watchTabStripFades } from './tab-strip-fade.mjs';
 import { FONT_SCALE_CHANGE_EVENT, getUiScale, initFontScaling, updateFontScaleFromSelect } from './font-scaling.js';
 import { initClientDiagnostics, recordStatusEvent } from './status-store.mjs';
-import { isStatusViewActive, toggleStatusView } from './status-view.mjs';
+import { isStatusViewActive, leaveStatusView, toggleStatusView } from './status-view.mjs';
 import { installExternalLinkPolicy, openExternalNavigation } from './external-link-policy.mjs';
 import {
   initCwdPicker,
@@ -1659,13 +1668,6 @@ function modelProvidersForId(modelId, providersByModel = {}) {
   return providers.map((provider) => String(provider || '').trim().toLowerCase()).filter(Boolean);
 }
 
-function openAIImageSizesForModel(modelId = '') {
-  const normalized = String(modelId || '').trim().toLowerCase().replace(/^openai\//, '');
-  if (normalized.startsWith('dall-e-2')) return ['256x256', '512x512', '1024x1024'];
-  if (normalized.startsWith('dall-e-3')) return ['1024x1024', '1792x1024', '1024x1792'];
-  return ['auto', '1024x1024', '1536x1024', '1024x1536'];
-}
-
 function modelVisibleForActiveProvider(modelId, activeProviderType, providersByModel = {}) {
   const normalizedModelId = String(modelId || '').trim().toLowerCase();
   if (!normalizedModelId) return false;
@@ -1799,8 +1801,12 @@ function selectedReasoningEffortValue() {
 function updateReasoningSelectorForModel(modelId, preferredEffort = '', { persist = false } = {}) {
   const select = document.getElementById('reasoning-effort-select');
   if (!select) return;
-  select.title = isOpenAIImageModelId(modelId) ? 'Quality' : 'Reasoning effort';
-  const options = reasoningOptionsForModel(modelId);
+  const imageModel = isOpenAIImageModelId(modelId);
+  select.title = imageModel ? 'Quality' : 'Reasoning effort';
+  // An image model's Quality: the catalog's values its family takes.
+  const options = imageModel
+    ? imageQualityOptions(modelId, reasoningOptionsForModel(modelId))
+    : reasoningOptionsForModel(modelId);
   const currentEffort = String(select.value || '').trim().toLowerCase();
   const storedEffort = String(localStorage.getItem(REASONING_STORAGE_KEY) || '').trim().toLowerCase();
   select.innerHTML = '';
@@ -2082,20 +2088,16 @@ function updateContextTierSelector(modelId) {
   const select = document.getElementById('context-tier-select');
   if (!select) return;
   if (isOpenAIImageModelId(modelId)) {
-    const current = String(select.value || '').trim().toLowerCase();
-    const imageSizes = openAIImageSizesForModel(modelId);
-    select.innerHTML = '';
-    for (const size of imageSizes) {
-      const option = document.createElement('option');
-      option.value = size;
-      option.textContent = size;
-      select.appendChild(option);
-    }
-    select.value = imageSizes.includes(current) ? current : 'auto';
-    select.title = 'Image size';
+    // Size (with Custom…), Count, Format and Background: image-composer-ui.js,
+    // from the conversation's stored values.
+    syncImageComposerControls(modelId, currentConvId);
+    // Today's image spend near or at the daily cap: the banner of an image chat.
+    syncOpenAIImageSpendBanner({ imageChat: true });
     updateModelPricingDetails(modelId, 'default');
     return;
   }
+  hideImageComposerControls();
+  syncOpenAIImageSpendBanner({ imageChat: false });
   const tierOptions = buildContextTierOptions({
     modelId,
     providerType: activeComposerProviderType(),
@@ -3454,6 +3456,27 @@ function usageCardIsFresh(provider) {
   return Number.isFinite(at) && Date.now() - at < USAGE_LIVE_FRESH_MS;
 }
 
+/**
+ * A new OpenAI image spend state (the socket event): the kept report's
+ * 'openai' card takes it, and the open modal redraws that card alone.
+ */
+function applyImageSpendToUsageReport(state) {
+  if (!state || !Array.isArray(lastUsageReport?.providers)) return;
+  const index = lastUsageReport.providers.findIndex((card) => card?.imageSpend && normalizeUsageProvider(card.provider) === 'openai');
+  if (index < 0) return;
+  const card = { ...lastUsageReport.providers[index], imageSpend: { ...lastUsageReport.providers[index].imageSpend, ...state } };
+  const providers = lastUsageReport.providers.slice();
+  providers[index] = card;
+  storeUsageReport({ ...lastUsageReport, providers });
+  if (summaryModalState.kind !== 'usage') return;
+  const panel = document.getElementById('summary-modal-body')?.querySelector('[data-usage-panel="openai"]');
+  if (!panel) return;
+  const updating = panel.hasAttribute('data-updating');
+  panel.outerHTML = renderPlanUsageCardHtml(card, { active: !panel.hidden });
+  if (updating) markUsageCardUpdating('openai', true);
+}
+onOpenAIImageSpendChange(applyImageSpendToUsageReport);
+
 /** The "Updating…" marker on one card, while its live read runs. */
 function markUsageCardUpdating(provider, updating) {
   const body = document.getElementById('summary-modal-body');
@@ -4036,11 +4059,13 @@ async function loadContextSummaryAndRender(convId) {
   const detailText = String(payload.text || '').trim();
   // The structured breakdown is the answer; the runtime's own text dump stays
   // available underneath for the details it carries that categories don't.
-  const bodyHtml = usageHtml
+  const contextHtml = usageHtml
     ? `${usageHtml}${autoCompactHtml}${thinkingHtml}${thoughtsHtml}${attributionHtml}${agentSessionsHtml}${detailText
       ? `<details class="ctx-usage-raw"><summary>Raw details</summary><pre>${escHtml(detailText)}</pre></details>`
       : ''}`
     : `${autoCompactHtml}${thinkingHtml}${thoughtsHtml}${attributionHtml}${agentSessionsHtml}<pre>${escHtml(detailText || 'No context data available.')}</pre>`;
+  // Two categories: Context (this body) and the session's Media gallery.
+  const bodyHtml = wrapContextBody(contextHtml, settingsConversationId);
 
   renderSummaryModalContent({
     title: 'Context usage',
@@ -4049,7 +4074,11 @@ async function loadContextSummaryAndRender(convId) {
     refresh: () => loadContextSummaryAndRender(refreshLookupId),
     kind: 'context',
   });
-  setSummaryModalLeaveHandler('context', () => commitAutoCompactDraft());
+  setSummaryModalLeaveHandler('context', () => {
+    commitAutoCompactDraft();
+    leaveContextTab();
+  });
+  afterContextRender();
 }
 
 async function showUsage() {
@@ -4111,6 +4140,9 @@ async function showContext() {
     });
     return;
   }
+  // A fresh open shows Context first; Media is one tap away.
+  initContextTabs();
+  resetContextTab(convId);
   if (btn) {
     btn.textContent = '⏳';
     btn.disabled = true;
@@ -5141,6 +5173,13 @@ function toggleChatActionsMenu() {
   syncThemeMenuLabel();
   syncAboutMenuLabel();
   const willOpen = !!menu.hidden;
+  // An image chat's cost, asked from the relay each time the menu opens.
+  if (willOpen) {
+    void syncChatMenuImageCost({
+      conversationId: currentConvId,
+      imageChat: isOpenAIImageModelId(document.getElementById('model-select')?.value || ''),
+    }).then(() => { if (!menu.hidden) placeChatActionsMenu(); });
+  }
   menu.hidden = !willOpen;
   trigger.setAttribute('aria-expanded', willOpen ? 'true' : 'false');
   if (willOpen) {
@@ -5717,6 +5756,14 @@ async function initApp() {
       closeChatActionsMenu();
       openCurrentCloudSession(showExternalLinkFallback);
     });
+    // The global Media view: every session's pictures, in the transcript's place.
+    bindMenuAction(document.getElementById('chat-menu-media'), (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      lockChatActionsMenuShield(350);
+      closeChatActionsMenu();
+      void window.toggleMediaView();
+    });
     const chatMenuSettingsBtn = document.getElementById('chat-menu-settings');
     bindMenuAction(chatMenuSettingsBtn, (event) => {
       event.preventDefault();
@@ -5990,6 +6037,7 @@ async function bootstrap() {
     // Leaving the Inbox goes back to the conversation it was opened from.
     // Opened from Status it stored none: `returnTo` is the session history stands on.
     closeInboxView: ({ returnTo = '' } = {}) => { if (isInboxViewActive()) void toggleInboxView({ returnTo }); },
+    closeMediaView: ({ returnTo = '' } = {}) => { if (isMediaViewActive()) void toggleMediaView({ returnTo }); },
     closeChangeCwdMenu: () => closeChangeCwdMenu({ focusTrigger: true }),
     closeGitChangesModal,
     closeGitDiffViewer,
@@ -6169,9 +6217,21 @@ window.openOriginConversation = openOriginConversation;
 // history stands on.
 window.toggleStatusView = () => {
   leaveInboxView();
+  leaveMediaView();
   return toggleStatusView({ returnTo: sessionHistoryConversation() });
 };
-window.toggleInboxView = () => toggleInboxView({ returnTo: sessionHistoryConversation() });
+window.toggleInboxView = () => {
+  leaveMediaView();
+  return toggleInboxView({ returnTo: sessionHistoryConversation() });
+};
+// The global Media view shares that place too.
+window.toggleMediaView = () => toggleMediaView({
+  returnTo: sessionHistoryConversation(),
+  leaveOthers: () => {
+    leaveInboxView();
+    leaveStatusView();
+  },
+});
 window.refreshConversations = refreshConversations;
 window.renderConvList = renderConvList;
 window.handleAttachmentInput = handleAttachmentInput;

package/server/public/app/chat-actions-menu-state.mjs

@@ -67,6 +67,7 @@ export const CHAT_ACTIONS_MENU_ENTRY_IDS = Object.freeze([
   'chat-menu-change-cwd',
   'chat-menu-git-changes',
   'chat-menu-open-cloud-session',
+  'chat-menu-media',
   'chat-menu-settings',
   'chat-menu-about',
   'chat-menu-restart-relay',

package/server/public/app/context-media-tab.js

@@ -0,0 +1,143 @@
+import { apiFetch } from './api-client.js';
+import { mountMediaGallery } from './media-gallery-ui.js';
+import { MEDIA_TEXT } from './media-gallery-model.mjs';
+import { closeSummaryModal, escHtml, summaryModalState } from './store.js';
+
+// The 🧠 modal's two categories: Context (what the modal always showed, and
+// what it opens on) and Media (this session's gallery, with its count on the
+// tab). The modal body is re-rendered as one string on every refresh, so the
+// tab choice lives here and the gallery is mounted again into its panel.
+
+const state = {
+  conversationId: '',
+  tab: 'context',
+  count: null,
+  gallery: null,
+  bound: false,
+  fetchJson: (url) => apiFetch(url),
+};
+
+/** A fresh open of 🧠 starts on Context. */
+export function resetContextTab(conversationId = '') {
+  destroyGallery();
+  state.tab = 'context';
+  state.conversationId = String(conversationId || '');
+  state.count = null;
+}
+
+function countLabel(count) {
+  return Number.isFinite(count) ? String(count) : '';
+}
+
+/** The tab strip and the two panels around the Context body. */
+export function wrapContextBody(contextHtml, conversationId) {
+  const id = String(conversationId || '');
+  if (id !== state.conversationId) {
+    state.conversationId = id;
+    state.count = null;
+  }
+  if (!id) return contextHtml;
+  const tab = state.tab === 'media' ? 'media' : 'context';
+  const tabButton = (name, label, extra = '') => `<button type="button" class="context-tab" role="tab" data-context-tab="${name}" aria-selected="${tab === name}">${label}${extra}</button>`;
+  return `<div class="context-tab-strip" role="tablist">${tabButton('context', `🧠 ${escHtml(MEDIA_TEXT.tabContext)}`)}${tabButton('media', `🖼️ ${escHtml(MEDIA_TEXT.tabMedia)}`, `<span class="context-tab-count" data-context-media-count>${escHtml(countLabel(state.count))}</span>`)}</div>`
+    + `<div data-context-panel="context"${tab === 'context' ? '' : ' hidden'}>${contextHtml}</div>`
+    + `<div data-context-panel="media"${tab === 'media' ? '' : ' hidden'}></div>`;
+}
+
+function body() {
+  return document.getElementById('summary-modal-body');
+}
+
+function showCount() {
+  const node = body()?.querySelector('[data-context-media-count]');
+  if (node) node.textContent = countLabel(state.count);
+}
+
+function openInSession(media) {
+  closeSummaryModal();
+  void window.openConversation?.(media.conversationId, {
+    aroundMessageId: media.messageId,
+    focusMessageId: media.messageId,
+  });
+}
+
+// One gallery per open of the modal: a re-render of the modal (Refresh, a
+// socket-driven refresh) moves the same gallery into the new panel, with its
+// pages and scroll; leaving the modal, or opening it for another session,
+// destroys it (its observer and timers go with it).
+function destroyGallery() {
+  state.gallery?.destroy();
+  state.gallery = null;
+}
+
+function mountMediaPanel() {
+  const panel = body()?.querySelector('[data-context-panel="media"]');
+  if (!panel || panel.hidden) return;
+  if (state.gallery && state.gallery.conversationId === state.conversationId) {
+    if (state.gallery.root.parentNode !== panel) panel.replaceChildren(state.gallery.root);
+    return;
+  }
+  destroyGallery();
+  const gallery = mountMediaGallery(panel, {
+    conversationId: state.conversationId,
+    onOpenInSession: openInSession,
+    fetchJson: state.fetchJson,
+    raiseViewer: true,
+  });
+  state.gallery = { ...gallery, conversationId: state.conversationId };
+}
+
+/** The modal was left (closed, or replaced by another kind): the gallery goes. */
+export function leaveContextTab() {
+  destroyGallery();
+}
+
+/** After each render of the modal: the count (asked once per open) and the gallery when Media is showing. */
+export function afterContextRender({ fetchJson = (url) => apiFetch(url) } = {}) {
+  state.fetchJson = fetchJson;
+  if (!state.conversationId) return;
+  if (state.count === null) {
+    const conversationId = state.conversationId;
+    void Promise.resolve(state.fetchJson(`/api/media/counts?conversationId=${encodeURIComponent(conversationId)}`))
+      .then((counts) => {
+        if (conversationId !== state.conversationId || !counts) return;
+        state.count = Number(counts.media) || 0;
+        showCount();
+      })
+      .catch(() => {});
+  } else {
+    showCount();
+  }
+  mountMediaPanel();
+}
+
+function selectTab(name) {
+  const root = body();
+  if (!root) return;
+  state.tab = name === 'media' ? 'media' : 'context';
+  root.querySelectorAll('[data-context-tab]').forEach((node) => {
+    node.setAttribute('aria-selected', String(node.getAttribute('data-context-tab') === state.tab));
+  });
+  root.querySelectorAll('[data-context-panel]').forEach((node) => {
+    node.hidden = node.getAttribute('data-context-panel') !== state.tab;
+  });
+  mountMediaPanel();
+}
+
+/** Once: the tab clicks, delegated on the modal body (its content is replaced on every render). */
+export function initContextTabs() {
+  if (state.bound) return;
+  const root = body();
+  if (!root) return;
+  state.bound = true;
+  root.addEventListener('click', (event) => {
+    if (summaryModalState.kind !== 'context') return;
+    const target = event.target instanceof Element ? event.target.closest('[data-context-tab]') : null;
+    if (!target) return;
+    selectTab(target.getAttribute('data-context-tab'));
+  });
+}
+
+export function contextTabState() {
+  return { ...state };
+}

package/server/public/app/context-usage-view.mjs

@@ -356,7 +356,7 @@ const THOUGHTS_EXPANDED_CHOICES = Object.freeze([
 ]);
 
 /**
- * The mirror of Settings › General "Expand thoughts while an agent works", for
+ * The mirror of Settings › Appearance "Expand thoughts while an agent works", for
  * every provider. A setting of this browser, so nothing goes to the relay:
  * the buttons write thoughts-preference.mjs and both places follow it.
  *
@@ -390,7 +390,7 @@ const STREAM_VIEW_CHOICES = Object.freeze([
 ]);
 
 /**
- * The mirror of Settings › General "Stream view", for every provider. A
+ * The mirror of Settings › Appearance "Stream view", for every provider. A
  * setting of this browser (stream-view-preference.mjs); nothing goes to the
  * relay.
  *