@abot-ai/runtime 1.8.1 → 2.0.0

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

@@ -1,3 +1,4 @@
+import { confirmDialog } from "../components/confirmation-dialog.js";
 function errorMessage(error) {
   return error instanceof Error ? error.message : String(error);
 }
@@ -13,6 +14,7 @@ export function createProjectsController({
   onChange,
   notify,
   onSessionCreated = () => {},
+  confirmAction = (message) => confirmDialog(message, { title: "Delete project", confirmLabel: "Delete project", tone: "danger" }),
 }) {
   let revision = 0;
   let currentEnvironment = getEnvironmentId();
@@ -22,6 +24,7 @@ export function createProjectsController({
   let activationRevision = 0;
   let state = {
     projects: [],
+    deletedProjectIds: [],
     loading: false,
     error: "",
     draft: null,
@@ -90,7 +93,7 @@ export function createProjectsController({
     const token = revision;
     const listToken = ++listRevision;
     if (!canUseProjects()) {
-      state = { ...state, projects: [], loading: false, error: "" };
+      state = { ...state, projects: [], deletedProjectIds: [], loading: false, error: "" };
       publish();
       return;
     }
@@ -99,7 +102,8 @@ export function createProjectsController({
     try {
       const result = await client.listProjects(environmentId);
       if (!canApplyProjectList(environmentId, token, listToken)) return;
-      state = { ...state, projects: result.projects ?? [], loading: false };
+      state = { ...state, projects: result.projects ?? [],
+        deletedProjectIds: result.deletedProjectIds ?? [], loading: false };
     } catch (error) {
       if (!canApplyProjectList(environmentId, token, listToken)) return;
       state = { ...state, loading: false, error: errorMessage(error) };
@@ -265,6 +269,61 @@ export function createProjectsController({
     }
   }
 
+  function getDeletedProjectIds() {
+    if (currentEnvironment !== getEnvironmentId()) return [];
+    if (!canUseProjects()) return [];
+    return state.deletedProjectIds;
+  }
+
+  function canDeleteProject(projectId) {
+    if (!projectId) return false;
+    if (!canUseProjects()) return false;
+    if (state.busyProjectId) return false;
+    return !state.deletedProjectIds.includes(projectId);
+  }
+
+  async function deleteProject(projectId, projectName = projectId) {
+    synchronizeProjectRuntime();
+    if (!canDeleteProject(projectId)) return false;
+    const environmentId = getEnvironmentId();
+    const token = revision;
+    const target = JSON.stringify(state.projects.find((project) => project.id === projectId));
+    const confirmed = await confirmAction(
+      'Delete "' + projectName + '"? Its conversations will move to Conversations. The working folder and its files will not be deleted.',
+    );
+    if (!confirmed) return false;
+    if (!isCurrentEnvironment(environmentId, token)) return false;
+    if (!canDeleteProject(projectId)) return false;
+    if (JSON.stringify(state.projects.find((project) => project.id === projectId)) !== target) return false;
+    listRevision += 1;
+    state = { ...state, busyProjectId: projectId, loading: false };
+    publish();
+    let deleted = false;
+    try {
+      await client.deleteProject(projectId, environmentId);
+      if (!isCurrentEnvironment(environmentId, token)) return false;
+      deleted = true;
+      listRevision += 1;
+      state = { ...state,
+        projects: state.projects.filter((project) => project.id !== projectId),
+        deletedProjectIds: [...new Set([...state.deletedProjectIds, projectId])],
+        loading: false,
+      };
+      publish();
+      await loadSessions();
+      return isCurrentEnvironment(environmentId, token);
+    } catch (error) {
+      if (!isCurrentEnvironment(environmentId, token)) return false;
+      notify(errorMessage(error), "failed");
+      return deleted;
+    } finally {
+      if (isCurrentEnvironment(environmentId, token)) {
+        state = { ...state, busyProjectId: "" };
+        publish();
+      }
+    }
+  }
+
   function retainedProjectDraft(environmentChanged) {
     if (environmentChanged) return null;
     if (!state.draft) return null;
@@ -289,7 +348,7 @@ export function createProjectsController({
     listRevision += 1;
     browseRevision += 1;
     activationRevision += 1;
-    state = { projects: [], loading: false, error: "", draft, busyProjectId: "" };
+    state = { projects: [], deletedProjectIds: [], loading: false, error: "", draft, busyProjectId: "" };
     publish();
     return true;
   }
@@ -314,5 +373,7 @@ export function createProjectsController({
     browse,
     create,
     newConversation,
+    deleteProject,
+    getDeletedProjectIds,
   };
 }

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

@@ -16,6 +16,14 @@ import { normalizeRealtimeMessage } from "../lib/realtime-message.js";
 import { reduceTaskProgress } from "../lib/task-progress.js";
 import { projectWebSourceEvent } from "../lib/web-source-event.js";
 import { projectToolActivityEvent } from "../lib/tool-activity-event.js";
+import {
+  hasRecordedRoleDelegation,
+  projectRoleDelegationEvent,
+} from "../lib/role-delegation-event.js";
+import {
+  hasRecordedRoleReturn,
+  projectRoleReturnEvent,
+} from "../lib/role-return-event.js";
 import {
   contextEvidenceScope,
   contextEvidenceOrder,
@@ -47,10 +55,14 @@ function canMergeUnsequencedActivity(
   eventSequence,
   webSources,
   toolActivity,
+  roleDelegation,
+  roleReturn,
 ) {
   if (eventSequence !== undefined) return false;
   if (webSources || previous?.webSources) return false;
   if (toolActivity || previous?.toolActivity) return false;
+  if (roleDelegation || previous?.roleDelegation) return false;
+  if (roleReturn || previous?.roleReturn) return false;
   if (!previous?.key || previous.key !== key) return false;
   return !hasOriginalEventSequence(previous.eventSequence);
 }
@@ -158,7 +170,12 @@ export function createRealtimeEventController({
       renderContextWindow();
       renderActivityStatus();
     }
-    if (hasRecordedOriginalEvent(state.events, requestId, eventSequence)) {
+    const roleDelegation = projectRoleDelegationEvent(message);
+    const roleReturn = projectRoleReturnEvent(message);
+    let alreadyRecorded = hasRecordedOriginalEvent(state.events, requestId, eventSequence);
+    if (roleDelegation) alreadyRecorded = hasRecordedRoleDelegation(state.events, roleDelegation);
+    if (roleReturn) alreadyRecorded = hasRecordedRoleReturn(state.events, roleReturn);
+    if (alreadyRecorded) {
       trackSeq(message);
       return;
     }
@@ -188,6 +205,8 @@ export function createRealtimeEventController({
         eventSequence,
         webSources,
         toolActivity,
+        roleDelegation,
+        roleReturn,
       )
     ) {
       lastEvent.count = (lastEvent.count || 1) + 1;
@@ -224,6 +243,8 @@ export function createRealtimeEventController({
         ),
         ...(webSources ? { webSources } : {}),
         ...(toolActivity ? { toolActivity } : {}),
+        ...(roleDelegation ? { roleDelegation } : {}),
+        ...(roleReturn ? { roleReturn } : {}),
         payload: {
           plan: message.plan,
           item: message.item,

package/dist/src/web-ui/app/controllers/reasoning-budget-controller.d.ts

@@ -0,0 +1,17 @@
+import type { ModelReasoningPreference } from "../../../shared/model-reasoning.js";
+import type { ConversationReasoningPreferences, ReasoningPreferenceScope } from "../services/conversation-reasoning-preferences.js";
+import type { ReasoningProfile } from "../lib/reasoning-preference.js";
+export declare function createReasoningBudgetController(options: {
+  state: { reasoningBudgetMenuOpen?: boolean };
+  dom: { reasoningBudgetButton?: HTMLButtonElement; reasoningBudgetMenu?: HTMLElement; reasoningBudgetControl?: HTMLElement; agentModeButton?: HTMLButtonElement };
+  preferences: ConversationReasoningPreferences;
+  getScope(): ReasoningPreferenceScope;
+  getProfile(): ReasoningProfile | null;
+  onApplied?(): void;
+  isModeBusy?(): boolean;
+  recordControlEvent?(event: { type: string; name: string; tone: string; summary: string }): void;
+}): {
+  render(): boolean;
+  isSaving(): boolean;
+  selectedPreference(): ModelReasoningPreference | undefined;
+};

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

@@ -0,0 +1,80 @@
+import { canChooseReasoningBudget, readReasoningPreferenceField, reasoningPreferenceLabel, renderReasoningPreferenceField, syncReasoningPreferenceField } from "../lib/reasoning-preference.js";
+
+export function createReasoningBudgetController({ state, dom, preferences, getScope, getProfile, recordControlEvent, onApplied, isModeBusy = () => false }) {
+  let renderedKey;
+  let saving = false;
+  const isCurrentScope = (scope, profileId) => JSON.stringify(scope) === JSON.stringify(getScope()) && profileId === getProfile()?.id;
+  function selectedPreference() {
+    const profile = getProfile();
+    const preference = preferences?.loadReasoningPreference?.(getScope(), profile?.id || "");
+    if (preference && !canChooseReasoningBudget(profile))
+      throw new Error("The selected model no longer supports the saved thinking budget. Choose Profile default.");
+    return preference;
+  }
+  function syncControls() {
+    const busy = saving || isModeBusy();
+    dom.reasoningBudgetButton.disabled = busy;
+    if (dom.agentModeButton) dom.agentModeButton.disabled = busy;
+    const menu = dom.reasoningBudgetMenu;
+    const save = menu.querySelector("[data-save-budget]");
+    if (save) save.disabled = busy;
+    const mode = menu.querySelector("[data-reasoning-preference-mode]");
+    if (mode) mode.disabled = busy;
+    const input = menu.querySelector("[data-reasoning-budget]");
+    if (input) input.disabled = busy || mode?.value !== "budget";
+  }
+  function render() {
+    const button = dom.reasoningBudgetButton, menu = dom.reasoningBudgetMenu;
+    if (!button || !menu) return false;
+    const profile = getProfile();
+    const preference = preferences?.loadReasoningPreference?.(getScope(), profile?.id || "");
+    const available = canChooseReasoningBudget(profile) || Boolean(preference);
+    if (dom.reasoningBudgetControl) dom.reasoningBudgetControl.hidden = !available;
+    button.hidden = !available;
+    if (!available) { renderedKey = undefined; state.reasoningBudgetMenuOpen = false; menu.hidden = true; return false; }
+    const labels = { off: "Off", "server-default": "Server default" };
+    const label = preference?.mode === "budget" ? `${preference.budgetTokens} tokens` : labels[preference?.mode] || "Profile default";
+    button.title = `Thinking budget: ${reasoningPreferenceLabel(preference)}`;
+    button.setAttribute("aria-label", button.title);
+    button.setAttribute("aria-haspopup", "dialog");
+    button.setAttribute("aria-expanded", String(Boolean(state.reasoningBudgetMenuOpen)));
+    button.textContent = label;
+    button.classList.toggle("open", state.reasoningBudgetMenuOpen);
+    menu.classList.toggle("open", state.reasoningBudgetMenuOpen);
+    menu.hidden = !state.reasoningBudgetMenuOpen;
+    menu.setAttribute("role", "dialog");
+    menu.setAttribute("aria-label", "Thinking token budget");
+    const nextKey = JSON.stringify([getScope(), profile?.id, canChooseReasoningBudget(profile), preference]);
+    if (renderedKey === nextKey && menu.querySelector("[data-save-budget]")) { syncControls(); return true; }
+    renderedKey = nextKey;
+    menu.innerHTML = `${renderReasoningPreferenceField(profile, preference)}
+      <button type="button" data-save-budget>Apply to next message</button>
+      <p role="alert" data-budget-error hidden></p>`;
+    const scope = { ...getScope() };
+    menu.querySelector("[data-reasoning-preference-mode]").addEventListener("change", () => syncReasoningPreferenceField(menu, profile));
+    menu.querySelector("[data-save-budget]").addEventListener("click", async () => {
+      if (saving || isModeBusy()) return;
+      let applied = false;
+      try {
+        const next = readReasoningPreferenceField(menu);
+        saving = true; syncControls();
+        await preferences.saveReasoningPreference(scope, profile.id, next);
+        if (!isCurrentScope(scope, profile.id)) return;
+        state.reasoningBudgetMenuOpen = false;
+        if (onApplied) onApplied(); else render();
+        applied = true;
+      } catch (error) {
+        if (!isCurrentScope(scope, profile.id)) return;
+        const feedback = menu.querySelector("[data-budget-error]");
+        feedback.textContent = error.message; feedback.hidden = false;
+        recordControlEvent?.({ type: "control", name: "Thinking budget update failed", tone: "failed", summary: error.message });
+      } finally {
+        saving = false; syncControls();
+        if (applied && isCurrentScope(scope, profile.id)) (button.hidden ? dom.agentModeButton : button)?.focus();
+      }
+    });
+    syncControls();
+    return true;
+  }
+  return { render, selectedPreference, isSaving: () => saving };
+}

package/dist/src/web-ui/app/controllers/reasoning-budget-menu-events.js

@@ -0,0 +1,45 @@
+/** Independent thinking-budget popup; effort keeps its own menu and selection. */
+export function bindReasoningBudgetMenu({ state, dom, actions, modelSelector, documentRoot }) {
+  const button = dom.reasoningBudgetButton, menu = dom.reasoningBudgetMenu;
+  if (!button || !menu) return;
+  function close(restoreFocus = false) {
+    if (!state.reasoningBudgetMenuOpen) return;
+    state.reasoningBudgetMenuOpen = false;
+    actions.renderAgentMode();
+    if (restoreFocus) button.focus();
+  }
+  function open() {
+    if (button.disabled || dom.reasoningBudgetControl?.hidden) return;
+    modelSelector.close();
+    state.agentModeMenuOpen = false;
+    state.permissionModeMenuOpen = false;
+    state.reasoningBudgetMenuOpen = true;
+    actions.renderPermissionMode();
+    actions.renderAgentMode();
+    menu.querySelector("[data-reasoning-preference-mode]")?.focus();
+  }
+  button.addEventListener("click", (event) => {
+    event.stopPropagation();
+    if (state.reasoningBudgetMenuOpen) { close(); return; }
+    open();
+  });
+  button.addEventListener("keydown", (event) => {
+    if (event.key !== "ArrowDown" && event.key !== "ArrowUp") return;
+    event.preventDefault(); open();
+  });
+  menu.addEventListener("click", (event) => event.stopPropagation());
+  for (const trigger of [dom.agentModeButton, dom.permissionModeButton]) {
+    trigger.addEventListener("click", () => close());
+    trigger.addEventListener("keydown", (event) => {
+      if (event.key === "ArrowDown" || event.key === "ArrowUp") close();
+    });
+  }
+  documentRoot.addEventListener("click", (event) => {
+    if (event.target === button || button.contains(event.target) || menu.contains(event.target)) return;
+    close();
+  });
+  documentRoot.addEventListener("keydown", (event) => {
+    if (event.key !== "Escape" || event.defaultPrevented || !state.reasoningBudgetMenuOpen) return;
+    close(true); event.preventDefault();
+  });
+}

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

@@ -1,5 +1,6 @@
-import { escapeAttribute, escapeHtml, textOf } from "../lib/text-format.js";
-import { canChooseReasoning } from "../lib/reasoning-controls.js";
+import { escapeHtml, textOf } from "../lib/text-format.js";
+import { agentModeMeta, canChooseReasoning, renderReasoningModeButtons } from "../lib/reasoning-controls.js";
+import { createReasoningBudgetController } from "./reasoning-budget-controller.js";
 import { createReasoningOverridePrompt } from "../components/reasoning-override-prompt.js";
 
 export function normalizeAgentMode(mode) {
@@ -9,25 +10,10 @@ export function normalizeAgentMode(mode) {
     : "reasoning";
 }
 
-function agentModeMeta(mode) {
-  const modes = {
-    auto: { label: "Auto", description: "Lets the agent choose", icon: "*" },
-    fast: { label: "Low", 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 function createReasoningModeController({ state, dom, client, selectedEnvironmentId, selectedModelProfile, reloadModels, recordControlEvent }) {
+export function createReasoningModeController({ state, dom, client, selectedEnvironmentId, selectedModelProfile, reloadModels, recordControlEvent, preferences, getScope }) {
+  const budget = createReasoningBudgetController({ state, dom, preferences, getScope, getProfile: selectedModelProfile, recordControlEvent, onApplied: () => renderAgentMode(), isModeBusy: () => agentModeMutationInFlight });
+  let agentModeError = "";
+  let modeErrorScope;
   let agentModeLoadRevision = 0;
   const agentModeMutationRevisions = new Map();
   let agentModeMutationInFlight = false;
@@ -39,13 +25,14 @@ export function createReasoningModeController({ state, dom, client, selectedEnvi
     render: () => renderAgentMode(),
   });
   function renderAgentMode() {
+    budget.render();
     const allowed = canChooseReasoning(selectedModelProfile());
     const meta = allowed ? agentModeMeta(state.agentMode) : { label: "Provider default", icon: "—" };
     dom.agentModeButton.setAttribute("aria-haspopup", allowed ? "menu" : "dialog");
     dom.agentModeMenu.classList.toggle("reasoning-override-menu", !allowed);
     dom.agentModeButton.title = `Reasoning depth: ${meta.label}`;
     dom.agentModeButton.setAttribute("aria-label", `Reasoning depth: ${meta.label}`);
-    dom.agentModeButton.disabled = agentModeMutationInFlight;
+    dom.agentModeButton.disabled = agentModeMutationInFlight || budget.isSaving();
     dom.agentModeButton.innerHTML = `
       <span class="agent-mode-icon">${escapeHtml(meta.icon)}</span>
       <span>${escapeHtml(meta.label)}</span>`;
@@ -61,19 +48,11 @@ export function createReasoningModeController({ state, dom, client, selectedEnvi
     if (!allowed) { prompt.render(state.agentModeMenuOpen); return; }
     const restoreFocus = Boolean(dom.agentModeMenu.contains?.(dom.agentModeMenu.ownerDocument?.activeElement));
     prompt.reset();
-    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("");
+    const thinkingOff = preferences?.loadReasoningPreference?.(getScope(), selectedModelProfile()?.id || "")?.mode === "off";
+    const modeError = modeErrorScope === JSON.stringify([getScope?.(), selectedModelProfile()?.id]) ? agentModeError : "";
+    dom.agentModeMenu.innerHTML = renderReasoningModeButtons(state.agentMode, state.supportedAgentModes, agentModeMutationInFlight || budget.isSaving())
+      + `<small class="reasoning-mode-default-note">${thinkingOff ? "Thinking is Off. Choosing a mode turns it back on. " : ""}Sets the default depth; model profile and calibration settings may override it. Token budgets are set separately.</small>
+        <p role="alert" data-mode-error${modeError ? "" : " hidden"}>${escapeHtml(modeError)}</p>`;
     dom.agentModeMenu
       .querySelectorAll(".agent-mode-option")
       .forEach((button) => {
@@ -121,10 +100,18 @@ export function createReasoningModeController({ state, dom, client, selectedEnvi
   }
 
   async function setAgentMode(mode) {
-    if (agentModeMutationInFlight) return false;
+    if (agentModeMutationInFlight || budget.isSaving()) return false;
     if (!canChooseReasoning(selectedModelProfile())) return false;
     agentModeMutationInFlight = true;
+    agentModeError = "";
+    const scope = getScope ? { ...getScope() } : undefined;
+    const profileId = selectedModelProfile()?.id || "";
+    const manualOverride = scope && preferences?.loadReasoningPreference?.(scope, profileId);
+    let modeSaved = false;
     const environmentId = selectedEnvironmentId();
+    const isOriginatingSelection = () => environmentId === selectedEnvironmentId()
+      && profileId === selectedModelProfile()?.id
+      && (!scope || JSON.stringify(scope) === JSON.stringify(getScope()));
     const revision = agentModeMutationRevisionFor(environmentId) + 1;
     agentModeMutationRevisions.set(environmentId, revision);
     const loadRevisionAtStart = ++agentModeLoadRevision;
@@ -133,9 +120,11 @@ export function createReasoningModeController({ state, dom, client, selectedEnvi
     state.agentMode = requestedMode;
     state.agentModeMenuOpen = false;
     renderAgentMode();
-    dom.agentModeButton.focus();
     try {
       const payload = await client.setAgentMode(requestedMode, environmentId);
+      modeSaved = true;
+      if (environmentId === selectedEnvironmentId()) state.agentMode = normalizeAgentMode(payload.mode);
+      if (manualOverride?.mode === "off") await preferences.saveReasoningPreference(scope, profileId, undefined);
       if (
         revision !== agentModeMutationRevisionFor(environmentId) ||
         environmentId !== selectedEnvironmentId()
@@ -153,22 +142,28 @@ export function createReasoningModeController({ state, dom, client, selectedEnvi
       ) {
         return false;
       }
-      if (agentModeLoadRevision === loadRevisionAtStart) {
+      if (!modeSaved && agentModeLoadRevision === loadRevisionAtStart) {
         state.agentMode = previousMode;
         renderAgentMode();
       }
+      modeErrorScope = JSON.stringify([scope, profileId]);
+      agentModeError = modeSaved
+        ? "The reasoning mode was saved, but Thinking Off could not be cleared. " + (error instanceof Error ? error.message : String(error))
+        : (error instanceof Error ? error.message : String(error));
+      if (isOriginatingSelection()) state.agentModeMenuOpen = true;
       recordControlEvent({
         type: "control",
         name: "Reasoning mode update failed",
         tone: "failed",
-        summary: error instanceof Error ? error.message : String(error),
+        summary: agentModeError,
       });
       return false;
     } finally {
       agentModeMutationInFlight = false;
       renderAgentMode();
+      if (isOriginatingSelection() && !state.agentModeMenuOpen) dom.agentModeButton.focus();
     }
   }
 
-  return { renderAgentMode, loadAgentMode, setAgentMode };
+  return { renderAgentMode, loadAgentMode, setAgentMode, selectedReasoningPreference: budget.selectedPreference };
 }

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

@@ -93,6 +93,7 @@ export interface RuntimeSelectionControllerDependencies {
     agentMode: AgentMode;
     supportedAgentModes: AgentMode[];
     agentModeMenuOpen: boolean;
+    reasoningBudgetMenuOpen?: boolean;
     permissionModeMenuOpen: boolean;
     agentPickerOpen: boolean;
     modelProfiles: Array<
@@ -118,8 +119,11 @@ export interface RuntimeSelectionControllerDependencies {
     permissionModeMenu: RuntimeSelectionControlMenuSurface;
     agentModeButton: RuntimeSelectionAgentModeButtonSurface;
     agentModeMenu: RuntimeSelectionControlMenuSurface;
+    reasoningBudgetControl?: HTMLElement;
+    reasoningBudgetButton?: HTMLButtonElement;
+    reasoningBudgetMenu?: HTMLElement;
   }>;
-  readonly preferences: Readonly<{
+  readonly preferences: Readonly<Partial<import("../services/conversation-reasoning-preferences.js").ConversationReasoningPreferences> & {
     loadPinnedSessions(): string[];
     loadSessionModes(
       normalize: (value: unknown) => ToolPermissionMode,
@@ -183,6 +187,7 @@ export declare function createRuntimeSelectionController(
   renderPermissionMode(): void;
   saveModelPreferences(): void;
   selectedEnvironmentId(): string;
+  selectedReasoningPreference(): import("../../../shared/model-reasoning.js").ModelReasoningPreference | undefined;
   selectedModelPreference(): Record<string, unknown> | null;
   selectedModelSupportsImageInput(profileId?: string): boolean;
   setAgentMode(mode: AgentMode): Promise<boolean>;

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

@@ -76,6 +76,7 @@ export function createRuntimeSelectionController({
     const label = selectedOption?.label || selected || "Environment";
     dom.agentPickerButton.hidden = false;
     dom.agentPickerButton.innerHTML = `
+      <span class="rail-icon rail-environment-icon" aria-hidden="true"><svg viewBox="0 0 24 24"><path d="m12 3 9 5-9 5-9-5 9-5Zm-9 9 9 5 9-5M3 16l9 5 9-5" /></svg></span>
       <span class="rail-button-label">${escapeHtml(label)}</span>
     `;
     dom.agentPickerButton.title = `Environment: ${label}`;
@@ -157,7 +158,13 @@ export function createRuntimeSelectionController({
     renderAgentMode();
   }
 
+  function hasModelCatalogFromAnotherEnvironment() {
+    if (modelCatalogEnvironmentId === null) return false;
+    return modelCatalogEnvironmentId !== selectedEnvironmentId();
+  }
+
   function rememberModelSelection() {
+    if (hasModelCatalogFromAnotherEnvironment()) return;
     const profileId = textOf(dom.modelSelect.value);
     if (!profileId) return;
     state.lastModelByEnvironment[selectedEnvironmentId()] = profileId;
@@ -168,18 +175,29 @@ export function createRuntimeSelectionController({
   }
 
   const {
-    clearSessionMode, currentToolPermissionMode, initializeSessionMode,
+    clearSessionMode, currentToolPermissionMode, initializeSessionMode: initializeToolSessionMode,
     renderPermissionMode, setToolPermissionMode,
   } = createToolPermissionModeController({
     state, dom, preferences, recordControlEvent, getComposerSessionId,
   });
 
-  const { renderAgentMode, loadAgentMode, setAgentMode } = createReasoningModeController({
-    state, dom, client, selectedEnvironmentId,
-    selectedModelProfile: () => modelCatalogEnvironmentId !== null && modelCatalogEnvironmentId !== selectedEnvironmentId() ? null : selectedModelProfile(),
+  const { renderAgentMode, loadAgentMode, setAgentMode, selectedReasoningPreference } = createReasoningModeController({
+    state, dom, client, selectedEnvironmentId, preferences,
+    getScope: () => ({ environmentId: selectedEnvironmentId(), sessionId: getComposerSessionId() }),
+    selectedModelProfile: () => hasModelCatalogFromAnotherEnvironment() ? null : selectedModelProfile(),
     reloadModels: onReasoningConfigurationApplied || loadModels, recordControlEvent,
   });
 
+  function initializeSessionMode(sessionId) {
+    initializeToolSessionMode(sessionId);
+    const environmentId = selectedEnvironmentId();
+    const profileId = dom.modelSelect.value;
+    if (preferences.loadReasoningPreference?.({ environmentId, sessionId }, profileId)) return;
+    const preference = preferences.loadReasoningPreference?.({ environmentId, sessionId: "" }, profileId);
+    if (preference) void Promise.resolve(preferences.saveReasoningPreference({ environmentId, sessionId }, profileId, preference)).catch((error) =>
+      recordControlEvent({ type: "control", name: "Thinking preference save failed", tone: "failed", summary: error.message }));
+  }
+
   function renderModels() {
     dom.modelSelect.innerHTML = "";
     dom.modelSelect.disabled = state.modelProfiles.length === 0;
@@ -261,6 +279,7 @@ export function createRuntimeSelectionController({
     saveModelPreferences,
     selectedEnvironmentId,
     selectedModelPreference,
+    selectedReasoningPreference,
     selectedModelSupportsImageInput,
     setAgentMode,
     setToolPermissionMode,