@abot-ai/runtime 1.6.0 → 1.8.0

package/dist/src/web-ui/app/components/config-workspace/workspace-view.js

@@ -3,20 +3,22 @@ import {
   configRequiresRawRepair,
 } from "./raw-config-repair.js";
 import { renderModelSetupEntry } from "./model-setup-entry.js";
-import { escapeHtml, textOf } from "../../lib/text-format.js";
+import { textOf } from "../../lib/text-format.js";
 import { CONFIG_CATEGORIES } from "./config-model.js";
+import { modelSummary } from "./model-summary.js";
+import { renderConfigurationSummary, syncConfigurationSummary } from "./summary-rendering.js";
 
 export function createConfigWorkspaceView({
+  modelPluginViewState,
   onNavigationChange = () => {},
   state,
   dom,
   eventTarget,
   pluginManagement,
+  getOperationsSummary = () => ({ label: "System summary", items: [{ label: "System", value: "Not loaded" }] }),
   configFileEntries,
   configFileKey,
-  countObjectKeys,
   dashboardIsBusy,
-  dirtyFiles,
   ensureRawSelection,
   fileStatusText,
   hasPendingFileChanges,
@@ -53,17 +55,6 @@ export function createConfigWorkspaceView({
     return requestRunner?.config?.schemaVersion === 2;
   }
 
-  function configuredStepTargetCountLabel(count, sparseOverrides) {
-    const noun = sparseOverrides ? "override" : "mapping";
-    return `${count} ${count === 1 ? noun : `${noun}s`}`;
-  }
-
-  function configChangeSummary(count) {
-    if (count === 0) return "All saved";
-    const fileLabel = count === 1 ? "file" : "files";
-    return `${count} unsaved ${fileLabel}`;
-  }
-
   function requestPipelineContent(requestRunner) {
     if (!requestRunner) {
       return '<div class="empty-state compact">No request runner config found</div>';
@@ -95,6 +86,7 @@ export function createConfigWorkspaceView({
     const unavailable =
       '<div class="empty-state">No config dashboard data</div>';
     dom.configDashboard.innerHTML =
+      renderConfigurationSummary(currentSummary()) +
       '<div class="config-category-panels">' +
       CONFIG_CATEGORIES.map((category) =>
         renderCategoryPanel(
@@ -129,16 +121,17 @@ export function createConfigWorkspaceView({
     }
     dom.configDashboard.setAttribute("aria-busy", busy ? "true" : "false");
     dom.refreshConfigButton.disabled = busy;
+    syncDashboardSummary();
   }
 
   function renderConfigDashboard() {
+    modelPluginViewState?.capture();
     const dashboard = state.configDashboard;
     if (!dashboard?.files) {
       renderUnavailableDashboard();
       return;
     }
     const runtime = dashboard.files.runtime;
-    const requestRunner = dashboard.files.requestRunner;
     const models = Array.isArray(dashboard.files.models)
       ? dashboard.files.models
       : [];
@@ -146,18 +139,6 @@ export function createConfigWorkspaceView({
       state.selectedConfigModelId = models[0]?.id || "";
     }
     ensureRawSelection();
-    const registeredStepCount = Array.isArray(dashboard.modelSteps)
-      ? dashboard.modelSteps.length
-      : 0;
-    const configuredStepTargetCount = requestRunner
-      ? countObjectKeys(requestRunner.config?.models?.defaults?.steps)
-      : 0;
-    const sparseOverrides = requestRunnerUsesSparseOverrides(requestRunner);
-    const configuredStepTargetLabel = configuredStepTargetCountLabel(
-      configuredStepTargetCount,
-      sparseOverrides,
-    );
-    const dirtyCount = dirtyFiles().length;
     const repairNeeded = configFileEntries().some((file) =>
       configRequiresRawRepair(
         file,
@@ -165,39 +146,7 @@ export function createConfigWorkspaceView({
       ),
     );
     dom.configDashboard.innerHTML = `
-      <dl class="config-summary" aria-label="Configuration summary">
-        <div class="config-summary-item">
-          <dt>Runtime</dt>
-          <dd class="config-summary-value">${escapeHtml(
-            runtime?.exists ? "Ready" : "Missing",
-          )}</dd>
-        </div>
-        <div class="config-summary-item">
-          <dt>Pipeline</dt>
-          <dd class="config-summary-value">
-            <span data-config-registered-step-count>${escapeHtml(
-              `${registeredStepCount} registered`,
-            )}</span>
-            <span aria-hidden="true"> · </span>
-            <span data-config-step-target-count>${escapeHtml(
-              configuredStepTargetLabel,
-            )}</span>
-          </dd>
-        </div>
-        <div class="config-summary-item">
-          <dt>Models</dt>
-          <dd class="config-summary-value">${escapeHtml(String(models.length))}</dd>
-        </div>
-        <div class="config-summary-item config-summary-changes">
-          <dt>Changes</dt>
-          <dd
-            class="config-summary-value ${dirtyCount ? "dirty" : ""}"
-            data-config-summary-status
-            role="status"
-            aria-live="polite"
-          >${escapeHtml(configChangeSummary(dirtyCount))}</dd>
-        </div>
-      </dl>
+      ${renderConfigurationSummary(currentSummary())}
       ${
         repairNeeded
           ? `<section class="config-category-panel" aria-label="Repair configuration file">${renderConfigMap()}</section>`
@@ -224,6 +173,7 @@ export function createConfigWorkspaceView({
     );
     syncDirtyPresentation({ syncRawEditor: true });
     syncDashboardInteractivity();
+    modelPluginViewState?.restore();
   }
 
   function syncActiveCategory() {
@@ -240,6 +190,7 @@ export function createConfigWorkspaceView({
     if (!CONFIG_CATEGORIES.includes(category)) return;
     state.activeCategory = category;
     syncActiveCategory();
+    syncDashboardSummary();
     onNavigationChange();
   }
 
@@ -300,14 +251,18 @@ export function createConfigWorkspaceView({
     }
   }
 
+  function currentSummary() {
+    if (state.activeCategory === "plugins") {
+      return pluginManagement?.summary?.() ?? {
+        label: "Plugins summary", items: [{ label: "Plugins", value: "Not loaded" }],
+      };
+    }
+    if (state.activeCategory === "operations") return getOperationsSummary();
+    return modelSummary(state, hasPendingFileChanges);
+  }
+
   function syncDashboardSummary() {
-    const status = dom.configDashboard.querySelector(
-      "[data-config-summary-status]",
-    );
-    if (!status) return;
-    const count = dirtyFiles().length;
-    status.textContent = configChangeSummary(count);
-    status.classList.toggle("dirty", count > 0);
+    syncConfigurationSummary(dom.configDashboard, currentSummary());
   }
 
   function syncRawControls(options = {}) {
@@ -365,6 +320,7 @@ export function createConfigWorkspaceView({
     renderConfigDashboard,
     setWorkspaceStatus,
     syncDashboardInteractivity,
+    syncDashboardSummary,
     syncDirtyPresentation,
   };
 }

package/dist/src/web-ui/app/components/config-workspace.js

@@ -1,3 +1,4 @@
+import { createModelPluginViewState } from "./config-workspace/model-plugin-view-state.js";
 import { createConfigCalibrationDisclosure } from "./config-workspace/calibration-disclosure.js";
 import { createConfigDashboardRendering } from "./config-workspace/dashboard-rendering.js";
 import { createConfigFieldRendering } from "./config-workspace/field-rendering.js";
@@ -22,10 +23,12 @@ export {
 export function createConfigWorkspace({
   dom,
   loadDashboard,
+  loadModelPlugins,
   saveFile,
   memorySetup,
   memoryManagement,
   pluginManagement,
+  getOperationsSummary,
   onAddModel,
   onRemoveModel,
   onNavigationChange = () => {},
@@ -35,6 +38,7 @@ export function createConfigWorkspace({
 }) {
   const workspaceModel = createConfigWorkspaceModel();
   const { state } = workspaceModel;
+  const modelPluginViewState = createModelPluginViewState(dom.configDashboard);
   const calibrationDisclosure = createConfigCalibrationDisclosure({
     state,
     root: dom.configDashboard,
@@ -61,6 +65,7 @@ export function createConfigWorkspace({
   });
 
   const modelRendering = createConfigModelRendering({
+    modelPluginViewState,
     state,
     calibrationProfileLabel: fieldRendering.calibrationProfileLabel,
     configFileKey: workspaceModel.configFileKey,
@@ -87,6 +92,7 @@ export function createConfigWorkspace({
   });
 
   const workspaceView = createConfigWorkspaceView({
+    modelPluginViewState,
     onNavigationChange: () => {
       navigationRevision += 1;
       onNavigationChange();
@@ -95,11 +101,10 @@ export function createConfigWorkspace({
     dom,
     eventTarget,
     pluginManagement,
+    getOperationsSummary,
     configFileEntries: workspaceModel.configFileEntries,
     configFileKey: workspaceModel.configFileKey,
-    countObjectKeys: fieldRendering.countObjectKeys,
     dashboardIsBusy: workspaceModel.dashboardIsBusy,
-    dirtyFiles: workspaceModel.dirtyFiles,
     ensureRawSelection: workspaceModel.ensureRawSelection,
     fileStatusText: fieldRendering.fileStatusText,
     hasPendingFileChanges: workspaceModel.hasPendingFileChanges,
@@ -115,6 +120,7 @@ export function createConfigWorkspace({
   });
 
   const workspaceMutations = createConfigWorkspaceMutations({
+    modelPluginViewState,
     state,
     dom,
     confirmDiscard,
@@ -137,6 +143,7 @@ export function createConfigWorkspace({
     state,
     dom,
     loadDashboard,
+    loadModelPlugins,
     saveFile,
     memorySetup,
     memoryManagement,
@@ -160,6 +167,7 @@ export function createConfigWorkspace({
   });
 
   const workspaceEvents = createConfigWorkspaceEvents({
+    modelPluginViewState,
     onAddModel,
     onRemoveModel,
     state,
@@ -190,6 +198,7 @@ export function createConfigWorkspace({
 
   return {
     activeCategory: () => state.activeCategory,
+    syncSummary: workspaceView.syncDashboardSummary,
     setActive: calibrationDisclosure.setActive,
     setWorkspace: (workspace) => {
       const category = configurationCategoryForWorkspace(workspace);

package/dist/src/web-ui/app/components/conversation-view.js

@@ -81,6 +81,8 @@ export function createConversationView({
       if (viewState.followMessages) scrollToEnd();
     },
   });
+  let historyPager;
+  let holdingPosition = false;
   const viewState = {
     followMessages: true,
     messageRenderTimer: 0,
@@ -92,7 +94,7 @@ export function createConversationView({
   function updateJumpToLatest() {
     const hasOverflow =
       dom.messagesList.scrollHeight > dom.messagesList.clientHeight + 24;
-    dom.jumpToLatestButton.hidden = viewState.followMessages || !hasOverflow;
+    dom.jumpToLatestButton.hidden = !historyPager?.hasNewer() && (viewState.followMessages || !hasOverflow);
   }
 
   function scrollToEnd() {
@@ -246,7 +248,7 @@ export function createConversationView({
     );
     const previousScrollTop = dom.messagesList.scrollTop;
     const shouldFollow =
-      viewState.followMessages || isNearScrollEnd(dom.messagesList);
+      !holdingPosition && !historyPager?.hasNewer() && (viewState.followMessages || isNearScrollEnd(dom.messagesList));
     const messages = preserveMessageHistory ? getMessages() : projectApprovalContinuations(getMessages());
     conversationReasoning.beginRender(messages);
     messageLinkPreviews.reset();
@@ -265,7 +267,12 @@ export function createConversationView({
     for (const pendingApproval of getPendingApprovals()) {
       dom.messagesList.appendChild(createApprovalCard(pendingApproval));
     }
-    if (scrollBehavior) return scrollBehavior.afterRender();
+    historyPager?.renderControls(dom.messagesList);
+    if (scrollBehavior) {
+      scrollBehavior.afterRender();
+      if (historyPager?.hasNewer()) dom.jumpToLatestButton.hidden = false;
+      return;
+    }
     if (shouldFollow) {
       scrollToEnd();
     } else {
@@ -303,7 +310,23 @@ export function createConversationView({
     viewState.thinkingRenderTimer = 0;
   }
 
+  function preserveScroll(change) {
+    const root = dom.messagesList;
+    const bounds = root.getBoundingClientRect();
+    const anchor = [...root.querySelectorAll("[data-message-id]")].find((node) => node.getBoundingClientRect().bottom > bounds.top);
+    const id = anchor?.dataset.messageId;
+    const offset = anchor?.getBoundingClientRect().top ?? 0;
+    const previousTop = root.scrollTop;
+    holdingPosition = true; viewState.followMessages = false; viewState.scrollSettleVersion += 1;
+    change();
+    const restored = [...root.querySelectorAll("[data-message-id]")].find((node) => node.dataset.messageId === id);
+    root.scrollTop = restored ? root.scrollTop + restored.getBoundingClientRect().top - offset : previousTop;
+    scrollBehavior?.preservePosition?.();
+    updateJumpToLatest();
+  }
+
   function reset() {
+    holdingPosition = false;
     filePreview.reset();
     viewState.followMessages = true;
     viewState.scrollSettleVersion += 1;
@@ -318,19 +341,27 @@ export function createConversationView({
     messageLinkPreviews.reset();
   }
 
+  function jumpToLatest() {
+    if (!historyPager?.hasNewer()) { scrollToEnd(); return; }
+    void historyPager.latest().then(scrollToEnd).catch(() => notify("Could not load latest messages", "failed"));
+  }
+
   function bind() {
     if (viewState.bound) return;
     viewState.bound = true;
-    dom.jumpToLatestButton.addEventListener("click", scrollToEnd);
+    dom.jumpToLatestButton.addEventListener("click", jumpToLatest);
     dom.messagesList.addEventListener("scroll", () => {
+      holdingPosition = false;
       if (scrollBehavior) return;
-      viewState.followMessages = isNearScrollEnd(dom.messagesList);
+      viewState.followMessages = !historyPager?.hasNewer() && isNearScrollEnd(dom.messagesList);
       if (!viewState.followMessages) viewState.scrollSettleVersion += 1;
       updateJumpToLatest();
     });
   }
 
   return {
+    preserveScroll,
+    setHistoryPager: (pager) => { historyPager = pager; },
     setWorkspace: filePreview.setWorkspace,
     closeFilePreview: filePreview.reset,
     bind,

package/dist/src/web-ui/app/components/dashboard/recent-conversations.js

@@ -35,6 +35,7 @@ function unreadAvailabilityNotice({ conversations, hasUnavailableReadState }) {
 
 export function renderDashboardConversations({
   sessions = [],
+  overview,
   loading = false,
   error = "",
 }) {
@@ -43,7 +44,7 @@ export function renderDashboardConversations({
     recentConversations: conversations,
     unreadCount,
     hasUnavailableReadState,
-  } = projection;
+  } = { ...projection, ...(overview ? { unreadCount: overview.unreadCount, hasUnavailableReadState: overview.hasUnavailableReadState } : {}) };
   const badge =
     unreadCount > 0 && !hasUnavailableReadState
       ? `<span class="home-unread-count" aria-label="${unreadCount} unread messages">${unreadCount}</span>`

package/dist/src/web-ui/app/components/dashboard/workspace.js

@@ -104,7 +104,8 @@ export function createDashboardWorkspace({ root, actions, passiveLearning }) {
     updateLiveRegion(
       conversations,
       renderDashboardConversations({
-        sessions: snapshot.sessions,
+        sessions: snapshot.sessionOverview?.sessions ?? snapshot.sessions,
+        overview: snapshot.sessionOverview,
         loading: snapshot.loadingSessions,
         error: snapshot.sessionsError,
       }),

package/dist/src/web-ui/app/components/home-guidance/daily-review.js

@@ -14,7 +14,7 @@ export function createDailyReviewDialog({ container, onDecision, onDismiss }) {
     <p class="daily-review-error" role="alert" data-review-error hidden></p>
     <div class="daily-review-actions"><button type="button" data-review-delete>Delete memory</button>
       <button type="button" data-review-keep>Keep memory</button></div>
-    <p class="daily-review-note">These memories are already saved. Keep marks them as reviewed in this browser.</p>
+    <p class="daily-review-note">These memories are already saved. Keep marks them as reviewed in this ABot installation.</p>
     <button type="button" class="daily-review-later" data-review-later>Not now</button>`;
   container.append(dialog);
   let returnFocus;
@@ -53,7 +53,7 @@ export function createDailyReviewDialog({ container, onDecision, onDismiss }) {
     dialog.querySelector("[data-review-error]").hidden = !error;
     dialog.querySelector(".daily-review-actions").hidden = !record;
     for (const button of dialog.querySelectorAll(".daily-review-actions button")) button.disabled = busy;
-    dialog.querySelector("[data-review-delete]").textContent = busy ? "Deleting…" : "Delete memory";
+    dialog.querySelector("[data-review-delete]").textContent = busy ? "Saving…" : "Delete memory";
     const later = dialog.querySelector("[data-review-later]");
     later.textContent = record ? "Not now" : "Done";
     if (hasReviewLoadError) later.textContent = "Close";

package/dist/src/web-ui/app/components/home-guidance/home-guidance.js

@@ -5,14 +5,14 @@ import { createHomeGuidancePreferences } from "../../services/home-guidance-pref
 import { createDailyMemoryReview } from "../../controllers/daily-memory-review.js";
 import { createDailyReviewDialog } from "./daily-review.js";
 import { createDailyReviewEntry } from "./daily-review-entry.js";
+import { workspaceStorage } from "../../services/workspace-state.js";
 
 export function createHomeGuidance({ container, homeRegion, client, getEnvironmentId,
   getLearningSnapshot, getConnectionState, supportsConnection, refreshConnection,
   onOpen, isRuntimeReady = () => true, storage }) {
   const documentRoot = container?.ownerDocument;
   if (!documentRoot) return { render() {}, dispose() {} };
-  let preferenceStorage = storage;
-  try { preferenceStorage ??= documentRoot.defaultView?.localStorage; } catch { /* Session-only preferences. */ }
+  const preferenceStorage = storage ?? workspaceStorage();
   const preferences = createHomeGuidancePreferences(preferenceStorage);
   const root = documentRoot.createElement("aside");
   root.className = "home-guidance";
@@ -42,16 +42,19 @@ export function createHomeGuidance({ container, homeRegion, client, getEnvironme
   });
   review = createDailyMemoryReview({ client, getEnvironmentId, preferences, render: (snapshot) => {
     dialog.render(snapshot);
-    if (canOfferDailyReview(snapshot) && dialog.canOpen() && review.markOffered()) dialog.open();
+    if (canOfferDailyReview(snapshot) && dialog.canOpen()) void offerReview();
     renderSuggestion();
   } });
   root.querySelector("[data-guidance-open]").addEventListener("click", () => {
     if (root.hidden || !selected) return;
     onOpen(selected.id);
   });
-  root.querySelector("[data-guidance-dismiss]").addEventListener("click", () => {
+  root.querySelector("[data-guidance-dismiss]").addEventListener("click", async () => {
     if (!selected) return;
-    preferences.dismiss(environment, selected.id);
+    const target = environment;
+    try { await preferences.dismiss(environment, selected.id); }
+    catch { return; }
+    if (target !== environment || disposed) return;
     hiddenThisVisit = true;
     renderSuggestion();
   });
@@ -105,6 +108,14 @@ export function createHomeGuidance({ container, homeRegion, client, getEnvironme
     if (!visible || reviewDismissed || !snapshot.remaining) return false;
     return hasCurrentLearningActivity();
   }
+  async function offerReview() {
+    const target = environment;
+    try {
+      if (!await review.markOffered()) return;
+      if (target !== getEnvironmentId() || !canOfferDailyReview(review.snapshot())) return;
+      if (dialog.canOpen()) dialog.open();
+    } catch { /* The shared storage failure remains visible; no success is claimed. */ }
+  }
   async function openMemoryReview() {
     if (openingReview || !canReviewSavedMemories() || !dialog.canOpen()) return;
     const operation = revision;
@@ -115,7 +126,10 @@ export function createHomeGuidance({ container, homeRegion, client, getEnvironme
     if (disposed || operation !== revision || target !== getEnvironmentId()) return;
     openingReview = false;
     if (loadedReview && canReviewSavedMemories() && dialog.canOpen()) {
-      review.markOffered();
+      try { await review.markOffered(); }
+      catch { return; }
+      if (disposed || operation !== revision || target !== getEnvironmentId()) return;
+      if (!canReviewSavedMemories() || !dialog.canOpen()) return;
       dialog.open();
     }
     renderSuggestion();

package/dist/src/web-ui/app/components/model-setup/context-window-feedback.js

@@ -0,0 +1,53 @@
+import { readSetupContextWindowFeedback } from "../runtime-setup/context-window-feedback.js";
+import { MODEL_SETUP_ID } from "./rendering.js";
+
+const CONTEXT_FIELD = '[data-runtime-setup-field="context-window"]';
+const CONTEXT_ERROR_ID = `${MODEL_SETUP_ID}Error-context-window`;
+const CONTEXT_HELP_ID = `${MODEL_SETUP_ID}Help-context-window`;
+
+export function receiveModelContextWindowFeedback(state, error) {
+  if (state.busy !== "saving" || state.saved) return false;
+  if (error?.payload?.contextWindow?.profileId !== state.profileId)
+    return false;
+  const feedback = readSetupContextWindowFeedback(error);
+  if (!feedback) return false;
+  state.contextWindowFeedback = feedback;
+  state.step = 1;
+  state.error = "";
+  return true;
+}
+
+/** Remove only this feedback; preserve the draft and its secret input element. */
+export function clearModelContextWindowFeedback(state, form) {
+  if (!state.contextWindowFeedback) return;
+  state.contextWindowFeedback = null;
+  const field = form.querySelector(CONTEXT_FIELD);
+  field?.removeAttribute("aria-invalid");
+  field?.setAttribute("aria-describedby", CONTEXT_HELP_ID);
+  field?.setAttribute("min", "1");
+  form.querySelector(`[id="${CONTEXT_ERROR_ID}"]`)?.remove();
+}
+
+export function renderModelContextWindowFeedback(state, form, restoreFocus) {
+  const feedback = state.contextWindowFeedback;
+  if (!feedback) return;
+  const field = form.querySelector(CONTEXT_FIELD);
+  if (!field) return;
+  field.setAttribute("aria-invalid", "true");
+  field.setAttribute(
+    "aria-describedby",
+    `${CONTEXT_HELP_ID} ${CONTEXT_ERROR_ID}`,
+  );
+  field.setAttribute("min", String(feedback.minimumTokens));
+  let message = form.querySelector(`[id="${CONTEXT_ERROR_ID}"]`);
+  if (!message) {
+    message = form.ownerDocument.createElement("small");
+    message.setAttribute("id", CONTEXT_ERROR_ID);
+    message.setAttribute("class", "runtime-setup-feedback error");
+    message.setAttribute("role", "alert");
+    field.parentElement.append(message);
+  }
+  message.textContent = feedback.message;
+  if (state.busy || state.step !== 1 || !restoreFocus) return;
+  field.focus();
+}

package/dist/src/web-ui/app/components/model-setup/save-flow.js

@@ -1,3 +1,4 @@
+import { receiveModelContextWindowFeedback } from "./context-window-feedback.js";
 import { selectedModelProvider } from "./validation.js";
 import {
   isDefinitiveModelSaveRejection,
@@ -97,7 +98,8 @@ export function createModelSaveFlow({
       if (credentialSaved)
         state.credentialSavedFor =
           selectedModelProvider(state)?.id || state.newProviderId;
-      state.error = modelSaveErrorMessage(state, error);
+      if (!receiveModelContextWindowFeedback(state, error))
+        state.error = modelSaveErrorMessage(state, error);
       if (credentialSaved)
         state.error +=
           " Your API key was saved privately and will be reused on retry.";

package/dist/src/web-ui/app/components/model-setup/save-outcome.js

@@ -19,6 +19,7 @@ export function modelSaveFailureMessage(state) {
 
 export function modelSaveErrorMessage(state, error) {
   const fallback = modelSaveFailureMessage(state);
+  if (error?.payload?.error === "context_window_too_small") return fallback;
   const detail = error?.payload?.message;
   if (!detail) return fallback;
   if (state.saved) return `${fallback} ${detail}`;

package/dist/src/web-ui/app/components/model-setup/wizard.js

@@ -7,6 +7,10 @@ import {
 import { renderWizardProgress } from "../runtime-setup/wizard-shell.js";
 import { DEFAULT_OLLAMA_BASE_URL } from "../runtime-setup/validation.js";
 import { createSetupViewState } from "../runtime-setup/view-state.js";
+import {
+  clearModelContextWindowFeedback,
+  renderModelContextWindowFeedback,
+} from "./context-window-feedback.js";
 import { createModelSaveFlow } from "./save-flow.js";
 import {
   MODEL_SETUP_ID,
@@ -70,6 +74,7 @@ export function createModelSetupWizard({
       choice: "",
       model: "",
       contextWindowTokens: "",
+      contextWindowFeedback: null,
       profileId: "",
       profileEdited: false,
       newProviderId: "",
@@ -201,6 +206,11 @@ export function createModelSetupWizard({
       .querySelector(".runtime-setup-panel")
       .setAttribute("aria-busy", Boolean(state.busy).toString());
     viewState.restore({ focus, busy: Boolean(state.busy) });
+    renderModelContextWindowFeedback(
+      state,
+      modelForm,
+      viewState.canRestoreFocus(),
+    );
   }
 
   async function load() {
@@ -280,6 +290,7 @@ export function createModelSetupWizard({
       event.target.removeAttribute("aria-invalid");
       return;
     }
+    clearModelContextWindowFeedback(state, modelForm);
     state.saveOutcomeUncertain = false;
     const value = textOf(event.target.value);
     if (field === "model-id") {
@@ -315,6 +326,7 @@ export function createModelSetupWizard({
     )
       return;
     clearSecret();
+    clearModelContextWindowFeedback(state, modelForm);
     state.saveOutcomeUncertain = false;
     const providerChanged = state.choice !== event.target.value;
     if (providerChanged) state.model = "";