@abot-ai/runtime 1.6.0 → 1.8.0

package/dist/src/web-ui/app/controllers/runtime-selection-controller.js

@@ -1,33 +1,11 @@
 import { escapeAttribute, escapeHtml, textOf } from "../lib/text-format.js";
 import { normalizeToolPermissionMode } from "../lib/tool-permission-mode.js";
+import { createReasoningModeController } from "./reasoning-mode-controller.js";
 import { createToolPermissionModeController } from "./tool-permission-mode-controller.js";
 
 export { normalizeToolPermissionMode } from "../lib/tool-permission-mode.js";
 
-export function normalizeAgentMode(mode) {
-  const normalized = textOf(mode).trim().toLowerCase();
-  return ["fast", "reasoning", "deep", "auto"].includes(normalized)
-    ? normalized
-    : "reasoning";
-}
-
-function agentModeMeta(mode) {
-  const modes = {
-    auto: { label: "Auto", description: "Lets the agent choose", icon: "*" },
-    fast: { label: "Fast", description: "Shorter and quicker", icon: "!" },
-    deep: {
-      label: "Deep analysis",
-      description: "More careful responses",
-      icon: "D",
-    },
-    reasoning: {
-      label: "Reasoning",
-      description: "Balanced speed and thinking",
-      icon: "R",
-    },
-  };
-  return modes[normalizeAgentMode(mode)] || modes.reasoning;
-}
+export { normalizeAgentMode } from "./reasoning-mode-controller.js";
 
 export function createRuntimeSelectionController({
   state,
@@ -41,18 +19,14 @@ export function createRuntimeSelectionController({
   onModelCatalogLoading = () => {},
   onModelCatalogLoaded = () => {},
   onModelCatalogUnavailable = () => {},
+  onReasoningConfigurationApplied,
 }) {
-  let agentModeLoadRevision = 0;
-  const agentModeMutationRevisions = new Map();
-  let agentModeMutationInFlight = false;
+  let modelCatalogEnvironmentId = null;
   let modelCatalogLoadRevision = 0;
 
-  const agentModeMutationRevisionFor = (environmentId) =>
-    agentModeMutationRevisions.get(environmentId) || 0;
-
-  function configuredEnvironmentOptions() {
-    const raw = Array.isArray(state.config?.environments)
-      ? state.config.environments
+  function configuredEnvironmentOptions(config = state.config) {
+    const raw = Array.isArray(config?.environments)
+      ? config.environments
       : [];
     const options = raw
       .map((entry) => {
@@ -63,7 +37,7 @@ export function createRuntimeSelectionController({
       })
       .filter(Boolean);
     if (options.length > 0) return options;
-    const fallback = textOf(state.config?.defaultEnvironmentId).trim();
+    const fallback = textOf(config?.defaultEnvironmentId).trim();
     return fallback ? [{ value: fallback, label: fallback }] : [];
   }
 
@@ -166,6 +140,7 @@ export function createRuntimeSelectionController({
   function applyModelSelection() {
     if (!dom.modelSelect.options.length) {
       modelSelector.sync();
+      renderAgentMode();
       return;
     }
     const target =
@@ -179,6 +154,7 @@ export function createRuntimeSelectionController({
       dom.modelSelect.value = target;
     }
     modelSelector.sync();
+    renderAgentMode();
   }
 
   function rememberModelSelection() {
@@ -188,6 +164,7 @@ export function createRuntimeSelectionController({
     if (getComposerSessionId())
       state.sessionModels[getComposerSessionId()] = profileId;
     saveModelPreferences();
+    renderAgentMode();
   }
 
   const {
@@ -197,127 +174,11 @@ export function createRuntimeSelectionController({
     state, dom, preferences, recordControlEvent, getComposerSessionId,
   });
 
-  function renderAgentMode() {
-    const meta = agentModeMeta(state.agentMode);
-    dom.agentModeButton.title = `Reasoning depth: ${meta.label}`;
-    dom.agentModeButton.setAttribute("aria-label", `Reasoning depth: ${meta.label}`);
-    dom.agentModeButton.disabled = agentModeMutationInFlight;
-    dom.agentModeButton.innerHTML = `
-      <span class="agent-mode-icon">${escapeHtml(meta.icon)}</span>
-      <span>${escapeHtml(meta.label)}</span>`;
-    dom.agentModeButton.classList.toggle("open", state.agentModeMenuOpen);
-    dom.agentModeButton.setAttribute(
-      "aria-expanded",
-      state.agentModeMenuOpen ? "true" : "false",
-    );
-    dom.agentModeMenu.classList.toggle("open", state.agentModeMenuOpen);
-    dom.agentModeMenu.hidden = !state.agentModeMenuOpen;
-    dom.agentModeMenu.setAttribute("role", "menu");
-    dom.agentModeMenu.innerHTML = state.supportedAgentModes
-      .map((mode) => {
-        const item = agentModeMeta(mode);
-        const selected = normalizeAgentMode(mode) === state.agentMode;
-        return `
-          <button class="agent-mode-option ${selected ? "selected" : ""}" type="button"
-            role="menuitemradio" aria-checked="${selected ? "true" : "false"}"
-            tabindex="${selected ? "0" : "-1"}" data-mode="${escapeAttribute(mode)}" ${agentModeMutationInFlight ? "disabled" : ""}>
-            <span class="agent-mode-option-icon">${escapeHtml(item.icon)}</span>
-            <span><strong>${escapeHtml(item.label)}</strong><small>${escapeHtml(item.description)}</small></span>
-          </button>`;
-      })
-      .join("");
-    dom.agentModeMenu
-      .querySelectorAll(".agent-mode-option")
-      .forEach((button) => {
-        button.addEventListener(
-          "click",
-          () => void setAgentMode(button.dataset.mode),
-        );
-      });
-  }
-
-  async function loadAgentMode() {
-    const revision = ++agentModeLoadRevision;
-    const environmentId = selectedEnvironmentId();
-    const mutationRevision = agentModeMutationRevisionFor(environmentId);
-    renderAgentMode();
-    try {
-      const payload = await client.getAgentMode(environmentId);
-      if (
-        revision !== agentModeLoadRevision ||
-        mutationRevision !== agentModeMutationRevisionFor(environmentId) ||
-        environmentId !== selectedEnvironmentId()
-      ) {
-        return false;
-      }
-      state.agentMode = normalizeAgentMode(payload.mode);
-      state.supportedAgentModes = Array.isArray(payload.supportedModes)
-        ? payload.supportedModes.map(normalizeAgentMode)
-        : state.supportedAgentModes;
-      renderAgentMode();
-      return true;
-    } catch {
-      if (
-        revision !== agentModeLoadRevision ||
-        mutationRevision !== agentModeMutationRevisionFor(environmentId) ||
-        environmentId !== selectedEnvironmentId()
-      ) {
-        return false;
-      }
-      state.agentMode = "reasoning";
-      renderAgentMode();
-      return false;
-    }
-  }
-
-  async function setAgentMode(mode) {
-    if (agentModeMutationInFlight) return false;
-    agentModeMutationInFlight = true;
-    const environmentId = selectedEnvironmentId();
-    const revision = agentModeMutationRevisionFor(environmentId) + 1;
-    agentModeMutationRevisions.set(environmentId, revision);
-    const loadRevisionAtStart = ++agentModeLoadRevision;
-    const previousMode = state.agentMode;
-    const requestedMode = normalizeAgentMode(mode);
-    state.agentMode = requestedMode;
-    state.agentModeMenuOpen = false;
-    renderAgentMode();
-    dom.agentModeButton.focus();
-    try {
-      const payload = await client.setAgentMode(requestedMode, environmentId);
-      if (
-        revision !== agentModeMutationRevisionFor(environmentId) ||
-        environmentId !== selectedEnvironmentId()
-      ) {
-        return false;
-      }
-      agentModeLoadRevision += 1;
-      state.agentMode = normalizeAgentMode(payload.mode);
-      renderAgentMode();
-      return true;
-    } catch (error) {
-      if (
-        revision !== agentModeMutationRevisionFor(environmentId) ||
-        environmentId !== selectedEnvironmentId()
-      ) {
-        return false;
-      }
-      if (agentModeLoadRevision === loadRevisionAtStart) {
-        state.agentMode = previousMode;
-        renderAgentMode();
-      }
-      recordControlEvent({
-        type: "control",
-        name: "Reasoning mode update failed",
-        tone: "failed",
-        summary: error instanceof Error ? error.message : String(error),
-      });
-      return false;
-    } finally {
-      agentModeMutationInFlight = false;
-      renderAgentMode();
-    }
-  }
+  const { renderAgentMode, loadAgentMode, setAgentMode } = createReasoningModeController({
+    state, dom, client, selectedEnvironmentId,
+    selectedModelProfile: () => modelCatalogEnvironmentId !== null && modelCatalogEnvironmentId !== selectedEnvironmentId() ? null : selectedModelProfile(),
+    reloadModels: onReasoningConfigurationApplied || loadModels, recordControlEvent,
+  });
 
   function renderModels() {
     dom.modelSelect.innerHTML = "";
@@ -328,6 +189,7 @@ export function createRuntimeSelectionController({
       option.textContent = "No models configured";
       dom.modelSelect.appendChild(option);
       modelSelector.sync();
+      renderAgentMode();
       return;
     }
     for (const profile of state.modelProfiles) {
@@ -345,6 +207,7 @@ export function createRuntimeSelectionController({
   async function loadModels() {
     const revision = ++modelCatalogLoadRevision;
     const environmentId = selectedEnvironmentId();
+    renderAgentMode();
     onModelCatalogLoading();
     let payload = null;
     try {
@@ -355,6 +218,7 @@ export function createRuntimeSelectionController({
       ) {
         return false;
       }
+      modelCatalogEnvironmentId = environmentId;
       state.defaultModelProfileId = textOf(payload.defaultProfileId);
       state.modelProfiles = Array.isArray(payload.profiles)
         ? payload.profiles
@@ -366,6 +230,7 @@ export function createRuntimeSelectionController({
       ) {
         return false;
       }
+      modelCatalogEnvironmentId = environmentId;
       state.defaultModelProfileId = "";
       state.modelProfiles = [];
       renderModels();

package/dist/src/web-ui/app/controllers/session-controller.js

@@ -1,3 +1,4 @@
+import { createSessionPinUpdates } from "./session-pin-updates.js";
 import {
   isOlderSessionReadState,
   isSessionReadStateUnavailable,
@@ -19,6 +20,7 @@ export function createSessionController({
   selectedEnvironmentId,
   onOpen,
   onClearCurrent,
+  onSessionAttachmentsCleared = () => {},
   onClearSessionMode,
   onSaveModelPreferences,
   onReload,
@@ -27,14 +29,17 @@ export function createSessionController({
   confirmAction = window.confirm.bind(window),
   copyText = (value) => navigator.clipboard.writeText(value),
 }) {
+  let pagination;
+  const updatePinnedSessions = createSessionPinUpdates({ state, preferences });
   const titleOf = (session) =>
     textOf(session?.displayName || session?.title || session?.id);
   const byId = (sessionId) =>
     state.sessions.find((session) => textOf(session.id) === sessionId);
   const isPinned = (sessionId) => state.pinnedSessionIds.includes(sessionId);
   const sidebar = createSessionSidebarController({
-    state, preferences, selectedEnvironmentId, showToast: shell?.showToast,
-    render: onSidebarChange ?? render, getFilteredSessions: filtered,
+    state, preferences, updatePinnedSessions, selectedEnvironmentId, showToast: shell?.showToast,
+    render: () => { (onSidebarChange ?? render)(); void pagination?.load(); }, getFilteredSessions: filtered,
+    getPageInfo: () => pagination?.info(),
   });
 
   function filtered() {
@@ -51,11 +56,14 @@ export function createSessionController({
   }
 
   function render() {
+    const scrollTop = dom.sessionsList.scrollTop;
     sessionActionsMenu.reset();
     dom.sessionsList.innerHTML = "";
     const sessions = filtered();
-    dom.sessionsCount.textContent = String(sessions.length);
+    dom.sessionsCount.textContent = String(pagination?.info().total ?? sessions.length);
     sidebar.renderSections({ root: dom.sessionsList, sessions, createSessionItem, renderGroups });
+    pagination?.renderFooter();
+    dom.sessionsList.scrollTop = scrollTop;
   }
 
   function createSessionItem(session, sessionIndex) {
@@ -93,7 +101,7 @@ export function createSessionController({
           <button class="session-action pin-action" type="button" role="menuitem" tabindex="-1" title="${pinned ? "Unpin session" : "Pin session"}">${pinned ? "Unpin" : "Pin"}</button>
           <button class="session-action move-up-action" type="button" role="menuitem" tabindex="-1">Move up</button>
           <button class="session-action move-down-action" type="button" role="menuitem" tabindex="-1">Move down</button>
-          <button class="session-action archive-action" type="button" role="menuitem" tabindex="-1" title="Hide or restore this conversation in this browser and environment">${sidebar.isArchiveView() ? "Restore" : "Archive"}</button>
+          <button class="session-action archive-action" type="button" role="menuitem" tabindex="-1" title="Hide or restore this conversation in this ABot installation and environment">${sidebar.isArchiveView() ? "Restore" : "Archive"}</button>
           <button class="session-action copy-filename-action" type="button" role="menuitem" tabindex="-1" title="Copy session filename">Copy filename</button>
           <button class="session-action clear-action" type="button" role="menuitem" tabindex="-1" title="Reset messages">Reset</button>
           <button class="session-action delete-action" type="button" role="menuitem" tabindex="-1" title="Delete session">Delete</button>
@@ -222,13 +230,15 @@ export function createSessionController({
     render();
   }
 
-  function togglePinned(sessionId) {
+  async function togglePinned(sessionId) {
     if (!sessionId) return;
-    state.pinnedSessionIds = isPinned(sessionId)
-      ? state.pinnedSessionIds.filter((item) => item !== sessionId)
-      : [sessionId, ...state.pinnedSessionIds];
-    preferences.savePinnedSessions(state.pinnedSessionIds);
+    try {
+      await updatePinnedSessions((pins) => pins.includes(sessionId)
+        ? pins.filter((item) => item !== sessionId) : [sessionId, ...pins]);
+    }
+    catch { shell.showToast("Could not save pinned conversations", "failed"); return; }
     render();
+    void pagination?.load();
   }
 
   async function copyFilename(sessionId) {
@@ -249,13 +259,17 @@ export function createSessionController({
       )
     )
       return;
+    const scope = { environmentId: selectedEnvironmentId(), sessionId };
     setBusy(sessionId, true);
     try {
-      await client.clearSessionMessages(sessionId, selectedEnvironmentId());
+      await client.clearSessionMessages(sessionId, scope.environmentId);
+      onSessionAttachmentsCleared(scope);
+      if (selectedEnvironmentId() !== scope.environmentId) return;
       onClearSessionMode(sessionId);
       if (state.currentSessionId === sessionId) onClearCurrent(false);
       await onReload();
     } catch (error) {
+      if (selectedEnvironmentId() !== scope.environmentId) return;
       onControlEvent({
         type: "control",
         name: "Session clear failed",
@@ -263,7 +277,8 @@ export function createSessionController({
         summary: error instanceof Error ? error.message : String(error),
       });
     } finally {
-      setBusy(sessionId, false);
+      state.busySessionIds.delete(sessionId);
+      if (selectedEnvironmentId() === scope.environmentId) render();
     }
   }
 
@@ -275,21 +290,26 @@ export function createSessionController({
       )
     )
       return;
+    const scope = { environmentId: selectedEnvironmentId(), sessionId };
     setBusy(sessionId, true);
     try {
-      await client.deleteSession(sessionId, selectedEnvironmentId());
-      state.pinnedSessionIds = state.pinnedSessionIds.filter(
-        (item) => item !== sessionId,
-      );
-      preferences.savePinnedSessions(state.pinnedSessionIds);
+      await client.deleteSession(sessionId, scope.environmentId);
+      onSessionAttachmentsCleared(scope);
+      if (selectedEnvironmentId() !== scope.environmentId) return;
+      void updatePinnedSessions((pins) => pins.filter((item) => item !== sessionId))
+        .then(() => { if (selectedEnvironmentId() === scope.environmentId) render(); })
+        .catch(() => {
+          if (selectedEnvironmentId() === scope.environmentId)
+            shell.showToast("Conversation deleted, but its saved pin could not be removed", "failed");
+        });
       onClearSessionMode(sessionId);
       delete state.sessionModels[sessionId];
       onSaveModelPreferences();
       if (
-        preferences.sessionIdForEnvironment(selectedEnvironmentId()) ===
+        preferences.sessionIdForEnvironment(scope.environmentId) ===
         sessionId
       ) {
-        preferences.saveSessionIdForEnvironment(selectedEnvironmentId(), "");
+        preferences.saveSessionIdForEnvironment(scope.environmentId, "");
       }
       state.sessions = state.sessions.filter(
         (session) => session.id !== sessionId,
@@ -298,6 +318,7 @@ export function createSessionController({
       render();
       await onReload();
     } catch (error) {
+      if (selectedEnvironmentId() !== scope.environmentId) return;
       onControlEvent({
         type: "control",
         name: "Session delete failed",
@@ -305,11 +326,14 @@ export function createSessionController({
         summary: error instanceof Error ? error.message : String(error),
       });
     } finally {
-      setBusy(sessionId, false);
+      state.busySessionIds.delete(sessionId);
+      if (selectedEnvironmentId() === scope.environmentId) render();
     }
   }
 
   return {
+    setPagination: (value) => { pagination = value; },
+    paginationQuery: sidebar.paginationQuery,
     archiveSession: (sessionId) => sidebar.archiveSession(sessionId),
     applyReadState,
     applyTitle,

package/dist/src/web-ui/app/controllers/session-list-pagination.js

@@ -0,0 +1,71 @@
+import { mergeSessionListReadState } from "../lib/session-read-state.js";
+
+export function createSessionListPagination({ state, dom, client, sessions, selectedEnvironmentId, renderSessions, onSessionListState }) {
+  let revision = 0;
+  let pending = false;
+  let nextCursor = null;
+  let pageInfo = {};
+  let queryKey = "";
+  let errorMessage = "";
+  const query = () => ({ ...sessions.paginationQuery?.(), query: state.sessionQuery || "" });
+  function invalidate() {
+    state.sessionOverview = undefined;
+    revision += 1; pending = false; nextCursor = null; pageInfo = {}; queryKey = ""; errorMessage = "";
+  }
+  function isCurrent(environmentId, version, key) {
+    if (version !== revision) return false;
+    if (environmentId !== selectedEnvironmentId()) return false;
+    return key === JSON.stringify(query());
+  }
+  async function load(more = false) {
+    const input = query();
+    const key = JSON.stringify(input);
+    if (more && (pending || !nextCursor || key !== queryKey)) return state.sessions;
+    if (!more) nextCursor = null;
+    const environmentId = selectedEnvironmentId();
+    const version = ++revision;
+    const cursor = more ? nextCursor : null;
+    pending = true; errorMessage = ""; queryKey = key;
+    onSessionListState({ status: "loading", sessions: state.sessions });
+    renderSessions();
+    try {
+      const payload = await client.listSessions(environmentId, { ...input, cursor });
+      if (!isCurrent(environmentId, version, key)) return [];
+      const incoming = Array.isArray(payload.sessions) ? payload.sessions : [];
+      const merged = more ? [...state.sessions, ...incoming] : incoming;
+      state.sessions = mergeSessionListReadState([...new Map(merged.map((session) => [session.id, session])).values()], state.sessions);
+      nextCursor = payload.nextCursor || null;
+      pageInfo = { total: payload.total, archivedCount: payload.archivedCount };
+      if (payload.overview) state.sessionOverview = payload.overview;
+      onSessionListState({ status: "ready", sessions: state.sessions });
+      return state.sessions;
+    } catch (error) {
+      if (!isCurrent(environmentId, version, key)) return [];
+      errorMessage = error instanceof Error ? error.message : String(error);
+      onSessionListState({ status: "error", sessions: state.sessions, error: errorMessage });
+      return [];
+    } finally {
+      if (version === revision) { pending = false; renderSessions(); }
+    }
+  }
+  function renderFooter() {
+    const root = dom.sessionsList;
+    if (!root?.ownerDocument) return;
+    if (!pending && !nextCursor && !errorMessage) return;
+    const button = root.ownerDocument.createElement("button");
+    button.type = "button";
+    button.className = "session-archive-toggle";
+    button.disabled = pending;
+    button.textContent = pending ? "Loading conversations…" : errorMessage ? "Could not load conversations — retry" : "Load more conversations";
+    button.addEventListener("click", () => void load(Boolean(nextCursor)));
+    root.appendChild(button);
+  }
+  dom.sessionsList?.addEventListener?.("scroll", () => {
+    const root = dom.sessionsList;
+    if (root.scrollHeight - root.scrollTop - root.clientHeight > 100) return;
+    if (!errorMessage) void load(true);
+  }, { passive: true });
+  const controller = { load, invalidate, renderFooter, info: () => pageInfo };
+  sessions.setPagination?.(controller);
+  return controller;
+}

package/dist/src/web-ui/app/controllers/session-pin-updates.js

@@ -0,0 +1,14 @@
+/** Apply explicit pin actions in order, publishing only acknowledged values. */
+export function createSessionPinUpdates({ state, preferences }) {
+  let pending = Promise.resolve();
+  return function updatePinnedSessions(change) {
+    const saving = pending.then(async () => {
+      const next = change(state.pinnedSessionIds);
+      await preferences.savePinnedSessions(next);
+      state.pinnedSessionIds = next;
+    });
+    // A rejected action must not prevent a later explicit action from settling.
+    pending = saving.catch(() => {});
+    return saving;
+  };
+}

package/dist/src/web-ui/app/controllers/session-sidebar-controller.js

@@ -6,7 +6,7 @@ import { renderSessionSidebarSections } from "../components/session-sidebar-sect
 import { filterSessionsByArchiveState } from "../lib/session-archive-visibility.js";
 
 export function createSessionSidebarController({
-  state, preferences, selectedEnvironmentId = () => "", render, showToast, getFilteredSessions,
+  state, preferences, updatePinnedSessions, selectedEnvironmentId = () => "", render, showToast, getFilteredSessions, getPageInfo = () => undefined,
 }) {
   let showingArchived = false;
   let environmentId = selectedEnvironmentId();
@@ -42,38 +42,38 @@ export function createSessionSidebarController({
     );
   }
 
-  function saveSidebar(value) {
+  async function saveSidebar(value) {
     try {
-      preferences.saveSessionSidebar(environmentId, value);
+      await preferences.saveSessionSidebar(environmentId, value);
       return true;
     } catch {
-      showToast?.("Could not save conversation preferences in this browser", "failed");
+      showToast?.("Could not save conversation preferences in ABot", "failed");
       return false;
     }
   }
 
-  function move(sourceId, targetId, placement) {
+  async function move(sourceId, targetId, placement) {
     if (!canMoveSidebarSession(sourceId, targetId)) return;
     if (state.pinnedSessionIds.includes(sourceId)) {
-      const pinned = moveSidebarSession(state.pinnedSessionIds, sourceId, targetId, placement);
       try {
-        preferences.savePinnedSessions(pinned);
+        await updatePinnedSessions((pins) => moveSidebarSession(pins, sourceId, targetId, placement));
       } catch {
         showToast?.("Could not save pinned conversation order", "failed");
         return;
       }
-      state.pinnedSessionIds = pinned;
       render();
       return;
     }
     const saved = savedPreferences();
+    const rankedIds = new Set(saved.orderedSessionIds);
+    const unrankedIds = orderedSessions().map((session) => session.id).filter((id) => !rankedIds.has(id));
     saved.orderedSessionIds = moveSidebarSession(
-      orderedSessions().map((session) => session.id), sourceId, targetId, placement,
+      [...unrankedIds, ...saved.orderedSessionIds], sourceId, targetId, placement,
     );
-    if (saveSidebar(saved)) render();
+    if (await saveSidebar(saved)) render();
   }
 
-  function moveInDirection(session, direction) {
+  async function moveInDirection(session, direction) {
     const group = sessionSidebarGroup(session, state.pinnedSessionIds);
     const siblings = getFilteredSessions().filter(isSessionVisibleInSidebar).filter((candidate) =>
       sessionSidebarGroup(candidate, state.pinnedSessionIds) === group,
@@ -82,7 +82,7 @@ export function createSessionSidebarController({
     if (index < 0) return;
     const target = siblings[index + direction];
     if (!target) return;
-    move(session.id, target.id, direction < 0 ? "before" : "after");
+    await move(session.id, target.id, direction < 0 ? "before" : "after");
     document.getElementById(`session-open-${encodeURIComponent(session.id)}`)?.focus();
   }
 
@@ -95,17 +95,17 @@ export function createSessionSidebarController({
     return true;
   }
 
-  function setSessionArchived(sessionId, archived) {
+  async function setSessionArchived(sessionId, archived) {
     if (!sessionId) return false;
     const saved = savedPreferences();
     if (saved.archivedSessionIds.includes(sessionId) === archived) return true;
     saved.archivedSessionIds = archived
       ? [...saved.archivedSessionIds, sessionId]
       : saved.archivedSessionIds.filter((id) => id !== sessionId);
-    if (!saveSidebar(saved)) return false;
+    if (!await saveSidebar(saved)) return false;
     render();
     sidebarRoot?.querySelector(".session-archive-toggle")?.focus();
-    showToast?.(archived ? "Conversation archived in this browser" : "Conversation restored");
+    showToast?.(archived ? "Conversation archived" : "Conversation restored");
     return true;
   }
 
@@ -143,7 +143,7 @@ export function createSessionSidebarController({
     const saved = savedPreferences();
     renderSessionSidebarSections({
       ...options,
-      archivedCount: filterSessionsByArchiveState(state.sessions, saved.archivedSessionIds, true).length,
+      archivedCount: getPageInfo()?.archivedCount ?? filterSessionsByArchiveState(state.sessions, saved.archivedSessionIds, true).length,
       showingArchived,
       onToggleArchived: () => {
         showingArchived = !showingArchived;
@@ -155,5 +155,5 @@ export function createSessionSidebarController({
     });
   }
 
-  return { archiveSession, bindItem, renderSections, visibleSessions, isArchiveView: () => showingArchived };
+  return { paginationQuery: () => ({ ...savedPreferences(), archived: showingArchived, pinnedSessionIds: state.pinnedSessionIds }), archiveSession, bindItem, renderSections, visibleSessions, isArchiveView: () => showingArchived };
 }

package/dist/src/web-ui/app/controllers/spark-chat-reading.js

@@ -125,6 +125,7 @@ export function createSparkChatReading({
   documentRoot.addEventListener("visibilitychange", scheduleRead);
   viewport.addEventListener("focus", scheduleRead);
   return {
+    preservePosition() { follow = false; top = dom.messagesList.scrollTop; },
     afterRender,
     onLayoutChange() {
       if (!isOpen()) return;