@abot-ai/runtime 1.0.0 → 1.1.0

package/dist/src/web-ui/app/components/long-term-memory-setup.js

@@ -0,0 +1,334 @@
+import { escapeAttribute, escapeHtml, textOf } from "../lib/text-format.js";
+
+export function createLongTermMemorySetup({
+  getEnvironmentId = () => "",
+  loadStatus,
+  discoverModels,
+  enableMemory,
+  disableMemory,
+  recordControlEvent,
+  beginRuntimeMutation = () => true,
+  refreshRuntimeConfig = async () => true,
+  endRuntimeMutation = () => {},
+}) {
+  const state = {
+    root: null,
+    status: null,
+    models: [],
+    discoverySupported: false,
+    busy: "",
+    message: "",
+    error: "",
+    loadRevision: 0,
+    actionRevision: 0,
+    environmentId: "",
+  };
+
+  function mount(root) {
+    state.root = root;
+    render();
+  }
+
+  async function load() {
+    const revision = ++state.loadRevision;
+    state.actionRevision += 1;
+    const environmentId = getEnvironmentId();
+    const environmentChanged = state.environmentId !== environmentId;
+    if (environmentChanged) {
+      state.environmentId = environmentId;
+      state.status = null;
+      state.models = [];
+      state.discoverySupported = false;
+    }
+    state.busy = "status";
+    clearFeedback();
+    render({ preserveInputs: !environmentChanged });
+    try {
+      const payload = await loadStatus(environmentId);
+      if (
+        revision !== state.loadRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      state.status = payload.status || null;
+      return true;
+    } catch (error) {
+      if (
+        revision !== state.loadRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      state.error = errorMessage(error);
+      return false;
+    } finally {
+      if (
+        revision === state.loadRevision &&
+        environmentId === getEnvironmentId()
+      ) {
+        state.busy = "";
+        render();
+      }
+    }
+  }
+
+  async function discover() {
+    const providerId = selectedProviderId();
+    if (!providerId) {
+      showError("Choose a configured provider first.");
+      return;
+    }
+    await runAction(
+      "discover",
+      (environmentId) => discoverModels(providerId, environmentId),
+      (payload) => {
+        state.models = Array.isArray(payload.catalog?.models)
+          ? payload.catalog.models
+          : [];
+        state.discoverySupported = payload.catalog?.supported === true;
+        state.message = discoveryMessage();
+      },
+    );
+  }
+
+  async function enable() {
+    const providerId = selectedProviderId();
+    const model = textOf(
+      state.root?.querySelector("[data-memory-model]")?.value,
+    ).trim();
+    if (!providerId || !model) {
+      showError("Choose a provider and enter an embedding model ID.");
+      return;
+    }
+    const emitClientEvents =
+      state.root?.querySelector("[data-memory-events]")?.checked === true;
+    await runRuntimeMutation(
+      "enable",
+      (environmentId) =>
+        enableMemory(
+          {
+            providerId,
+            model,
+            emitClientEvents,
+          },
+          environmentId,
+        ),
+      (payload) => {
+        state.status = payload.status || null;
+        state.message =
+          "Embedding probe passed. Memory is enabled; restart ABot to apply it.";
+        recordResult("Long-term memory enabled", payload);
+      },
+    );
+  }
+
+  async function disable() {
+    await runRuntimeMutation(
+      "disable",
+      (environmentId) => disableMemory(environmentId),
+      (payload) => {
+        state.status = payload.status || null;
+        state.message = "Memory is disabled; restart ABot to apply it.";
+        recordResult("Long-term memory disabled", payload);
+      },
+    );
+  }
+
+  async function runRuntimeMutation(name, request, applyResult) {
+    if (!beginRuntimeMutation()) {
+      showError(
+        "Save or reset configuration changes before changing memory settings.",
+      );
+      return false;
+    }
+    try {
+      return await runAction(name, request, async (payload) => {
+        applyResult(payload);
+        await refreshRuntimeConfig();
+      });
+    } finally {
+      endRuntimeMutation();
+    }
+  }
+
+  async function runAction(name, request, applyResult) {
+    const revision = ++state.actionRevision;
+    const environmentId = getEnvironmentId();
+    state.loadRevision += 1;
+    state.busy = name;
+    clearFeedback();
+    render();
+    try {
+      const payload = await request(environmentId);
+      if (
+        revision !== state.actionRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      await applyResult(payload);
+      return true;
+    } catch (error) {
+      if (
+        revision !== state.actionRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      state.error = errorMessage(error);
+      recordControlEvent({
+        type: "control",
+        name: "Long-term memory setup failed",
+        tone: "failed",
+        summary: state.error,
+      });
+      return false;
+    } finally {
+      if (
+        revision === state.actionRevision &&
+        environmentId === getEnvironmentId()
+      ) {
+        state.busy = "";
+        render();
+      }
+    }
+  }
+
+  function render(options = {}) {
+    if (!state.root) return;
+    const status = state.status || {};
+    const providers = Array.isArray(status.providers) ? status.providers : [];
+    const preserveInputs = options.preserveInputs !== false;
+    const selectedProvider =
+      (preserveInputs ? selectedProviderId() : "") ||
+      status.providerId ||
+      providers[0]?.id ||
+      "";
+    const selectedModel =
+      (preserveInputs ? currentModelValue() : "") || status.model || "";
+    const enabled = status.enabled === true;
+    state.root.innerHTML = `
+      <section class="memory-setup-card" aria-busy="${state.busy ? "true" : "false"}">
+        <div class="memory-setup-heading">
+          <div>
+            <p class="eyebrow">passive memory</p>
+            <h4>Long-term memory</h4>
+            <p>Retrieve relevant memories across sessions while keeping storage and policy in the Runtime core.</p>
+          </div>
+          <span class="memory-status ${enabled ? "enabled" : "disabled"}">${enabled ? "Enabled" : "Disabled"}</span>
+        </div>
+        <div class="memory-setup-fields">
+          <label>
+            <span>Embedding provider</span>
+            <select data-memory-provider ${state.busy ? "disabled" : ""}>
+              ${providerOptions(providers, selectedProvider)}
+            </select>
+          </label>
+          <label>
+            <span>Embedding model</span>
+            <input data-memory-model list="memoryEmbeddingModels" value="${escapeAttribute(selectedModel)}" placeholder="Enter a provider model ID" ${state.busy ? "disabled" : ""} />
+            <datalist id="memoryEmbeddingModels">${state.models
+              .map(
+                (model) =>
+                  `<option value="${escapeAttribute(textOf(model))}"></option>`,
+              )
+              .join("")}</datalist>
+          </label>
+          <label class="memory-events-toggle">
+            <input data-memory-events type="checkbox" ${status.emitClientEvents === true ? "checked" : ""} ${state.busy ? "disabled" : ""} />
+            <span>Show bounded memory lifecycle events to clients</span>
+          </label>
+        </div>
+        <div class="memory-setup-actions">
+          <button type="button" data-memory-action="discover" ${state.busy ? "disabled" : ""}>Discover models</button>
+          <button type="button" data-memory-action="enable" ${state.busy ? "disabled" : ""}>Probe and enable</button>
+          <button type="button" data-memory-action="disable" ${!enabled || state.busy ? "disabled" : ""}>Disable</button>
+        </div>
+        ${feedbackMarkup()}
+        <p class="memory-setup-note">ABot never chooses or installs an embedding model. Configuration is written only after a real probe succeeds.</p>
+      </section>
+    `;
+    bindActions();
+  }
+
+  function bindActions() {
+    state.root.querySelectorAll("[data-memory-action]").forEach((button) => {
+      button.addEventListener("click", () => {
+        const action = button.dataset.memoryAction;
+        if (action === "discover") void discover();
+        else if (action === "enable") void enable();
+        else if (action === "disable") void disable();
+      });
+    });
+  }
+
+  function selectedProviderId() {
+    return textOf(
+      state.root?.querySelector("[data-memory-provider]")?.value,
+    ).trim();
+  }
+
+  function currentModelValue() {
+    return textOf(
+      state.root?.querySelector("[data-memory-model]")?.value,
+    ).trim();
+  }
+
+  function clearFeedback() {
+    state.message = "";
+    state.error = "";
+  }
+
+  function showError(message) {
+    state.error = message;
+    render();
+  }
+
+  function discoveryMessage() {
+    if (!state.discoverySupported) {
+      return "This provider does not expose model discovery. Enter its embedding model ID manually.";
+    }
+    return state.models.length
+      ? `Found ${state.models.length} installed model${state.models.length === 1 ? "" : "s"}.`
+      : "The provider returned no installed models.";
+  }
+
+  function feedbackMarkup() {
+    if (state.error) {
+      return `<p class="memory-setup-feedback error-text" role="alert">${escapeHtml(state.error)}</p>`;
+    }
+    return state.message
+      ? `<p class="memory-setup-feedback" role="status">${escapeHtml(state.message)}</p>`
+      : "";
+  }
+
+  function recordResult(name, payload) {
+    recordControlEvent({
+      type: "control",
+      name,
+      tone: "done",
+      summary: payload.backupPath
+        ? `backup: ${payload.backupPath}`
+        : "restart required",
+    });
+  }
+
+  return { load, mount };
+}
+
+function providerOptions(providers, selectedProvider) {
+  if (providers.length === 0) {
+    return '<option value="">No configured providers</option>';
+  }
+  return providers
+    .map((provider) => {
+      const selected = provider.id === selectedProvider ? "selected" : "";
+      return `<option value="${escapeAttribute(provider.id)}" ${selected}>${escapeHtml(provider.id)} · ${escapeHtml(provider.type)}</option>`;
+    })
+    .join("");
+}
+
+function errorMessage(error) {
+  return error instanceof Error ? error.message : String(error);
+}

package/dist/src/web-ui/app/components/runtime-setup-guide.d.ts

@@ -0,0 +1,39 @@
+export type RuntimeSetupValidation = Readonly<{
+  valid: boolean;
+  value: string;
+  message: string;
+}>;
+
+export type RuntimeSetupCommands = Readonly<{
+  "ollama-pull": string;
+  setup: string;
+  "model-gateway": string;
+  "web-ui": string;
+}>;
+
+export interface RuntimeSetupGuideDependencies {
+  readonly container: HTMLElement;
+  readonly conversationRegion: HTMLElement;
+  readonly copyText?: (value: string) => void | Promise<void>;
+  readonly getSetupCommandMode?: () => "source" | "package" | undefined;
+}
+
+export declare function validateRuntimeSetupModelId(
+  value: unknown,
+): RuntimeSetupValidation;
+export declare function validateRuntimeSetupBaseUrl(
+  value: unknown,
+): RuntimeSetupValidation;
+export declare function buildRuntimeSetupCommands(
+  provider: unknown,
+  modelId: unknown,
+  ollamaBaseUrl?: unknown,
+  setupCommandMode?: "source" | "package",
+): RuntimeSetupCommands;
+export declare function createRuntimeSetupGuide(
+  options: RuntimeSetupGuideDependencies,
+): {
+  bind(options?: { onCheckAgain?: () => void | Promise<void> }): void;
+  focusAction(): void;
+  render(setup: Record<string, unknown>): void;
+};

package/dist/src/web-ui/app/components/tool-approval-card.d.ts

@@ -0,0 +1,18 @@
+export type ToolApprovalEvent = Record<string, unknown> & {
+  approvalId?: string;
+  eventName?: string;
+  name?: string;
+  tool?: string;
+  summary?: string;
+};
+
+export interface ToolApprovalCardOptions {
+  event?: ToolApprovalEvent;
+  submitted?: boolean;
+  onDecision: (approvalId: string, approved: boolean) => void;
+  documentRoot?: Document;
+}
+
+export declare function createToolApprovalCard(
+  options: ToolApprovalCardOptions,
+): HTMLElement;

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

@@ -10,6 +10,7 @@ export function createWorkspaceShell({
   dom,
   viewport = window,
   documentRoot = document,
+  beforeWorkspaceChange = () => true,
 }) {
   const shellState = {
     ...createInitialWorkspaceShellState(),
@@ -84,36 +85,75 @@ export function createWorkspaceShell({
       : dom.closeConfigWorkspaceButton;
   }
 
-  function activateWorkspace(destination, options = {}) {
+  function prepareWorkspaceTransition(destination) {
     const nextWorkspace = normalizeWorkspaceDestination(destination);
+    if (nextWorkspace === shellState.workspace) {
+      return { nextWorkspace, commitBeforeChange: () => {} };
+    }
+    const preparedChange = beforeWorkspaceChange({
+      from: shellState.workspace,
+      to: nextWorkspace,
+    });
+    if (preparedChange === false || preparedChange === null) return null;
+    return {
+      nextWorkspace,
+      commitBeforeChange:
+        typeof preparedChange === "function" ? preparedChange : () => {},
+    };
+  }
+
+  function commitWorkspaceActivation(preparedTransition, options = {}) {
+    preparedTransition.commitBeforeChange();
+    const nextWorkspace = preparedTransition.nextWorkspace;
     const previousWorkspace = shellState.workspace;
     const previousSheet = shellState.activeSheet;
     shellState.workspace = nextWorkspace;
     shellState.activeSheet = "";
     syncShell();
 
-    if (options.focus === false) return;
+    if (options.focus === false) return true;
     if (nextWorkspace !== "chat") {
       viewport.requestAnimationFrame(() =>
         workspaceBackButton(nextWorkspace)?.focus(),
       );
-      return;
+      return true;
     }
     if (previousWorkspace !== "chat" || previousSheet) {
       dom.chatWorkspaceButton.focus();
     }
+    return true;
+  }
+
+  function prepareWorkspaceActivation(destination, options = {}) {
+    const preparedTransition = prepareWorkspaceTransition(destination);
+    if (!preparedTransition) return null;
+    let committed = false;
+    return () => {
+      if (committed) return true;
+      const activated = commitWorkspaceActivation(preparedTransition, options);
+      committed = activated;
+      return activated;
+    };
+  }
+
+  function activateWorkspace(destination, options = {}) {
+    const preparedActivation = prepareWorkspaceActivation(destination, options);
+    return preparedActivation ? preparedActivation() : false;
   }
 
   function setSessionsDrawerOpen(open, options = {}) {
+    const preparedTransition = prepareWorkspaceTransition("chat");
+    if (!preparedTransition) return false;
+    preparedTransition.commitBeforeChange();
     const wasOpen = shellState.activeSheet === "sessions";
     shellState.workspace = "chat";
     shellState.activeSheet = open ? "sessions" : "";
     syncShell();
 
-    if (options.focus === false) return;
+    if (options.focus === false) return true;
     if (open) {
       viewport.requestAnimationFrame(() => dom.closeSessionsButton?.focus());
-      return;
+      return true;
     }
     if (
       wasOpen &&
@@ -122,6 +162,7 @@ export function createWorkspaceShell({
     ) {
       dom.sessionsToggleButton.focus();
     }
+    return true;
   }
 
   function toggleSessionsDrawer() {
@@ -166,8 +207,7 @@ export function createWorkspaceShell({
       return true;
     }
     if (shellState.workspace !== "chat") {
-      activateWorkspace("chat");
-      return true;
+      return activateWorkspace("chat");
     }
     return false;
   }
@@ -230,6 +270,7 @@ export function createWorkspaceShell({
     bind,
     closeOverlaysOnEscape,
     load,
+    prepareWorkspaceActivation,
     setSessionsDrawerOpen,
     showToast,
   };

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

@@ -23,8 +23,13 @@ export function createAppEventBindings({
       () => void actions.loadSessions(),
     );
     dom.newSessionButton.addEventListener("click", () => {
+      const preparedWorkspaceActivation = shell.prepareWorkspaceActivation(
+        "chat",
+        { focus: false },
+      );
+      if (!preparedWorkspaceActivation) return;
       if (!actions.suspendQueueRecovery()) return;
-      shell.activateWorkspace("chat", { focus: false });
+      if (preparedWorkspaceActivation() === false) return;
       state.currentSessionId = createWebSessionId();
       actions.saveSessionId(
         actions.selectedEnvironmentId(),
@@ -43,16 +48,45 @@ export function createAppEventBindings({
       dom.composerInput.focus();
     });
     dom.environmentSelect.addEventListener("change", () => {
+      const previousEnvironmentId = actions.savedEnvironmentId?.() || "";
+      const nextEnvironmentId = dom.environmentSelect.value;
       const recoveryEnvironmentId =
         state.activeComposerQueueRecovery?.scope.environmentId ?? "";
+      const restoreEnvironmentSelection = () => {
+        dom.environmentSelect.value =
+          previousEnvironmentId || recoveryEnvironmentId;
+        state.agentPickerOpen = false;
+        actions.renderAgentPicker();
+      };
+      if (nextEnvironmentId === previousEnvironmentId) {
+        state.agentPickerOpen = false;
+        actions.renderAgentPicker();
+        return;
+      }
+      const preparedEnvironmentChange = actions.beforeEnvironmentChange
+        ? actions.beforeEnvironmentChange({
+            from: previousEnvironmentId,
+            to: nextEnvironmentId,
+          })
+        : true;
+      if (
+        preparedEnvironmentChange === false ||
+        preparedEnvironmentChange === null
+      ) {
+        restoreEnvironmentSelection();
+        return;
+      }
       if (!actions.suspendQueueRecovery()) {
-        if (recoveryEnvironmentId)
-          dom.environmentSelect.value = recoveryEnvironmentId;
+        restoreEnvironmentSelection();
         return;
       }
+      if (typeof preparedEnvironmentChange === "function") {
+        preparedEnvironmentChange();
+      }
+      actions.invalidateSessionLoads?.();
       state.agentPickerOpen = false;
       actions.renderAgentPicker();
-      actions.saveEnvironmentId(dom.environmentSelect.value);
+      actions.saveEnvironmentId(nextEnvironmentId);
       state.currentSessionId = "";
       state.messages = [];
       actions.clearAttachments();
@@ -61,10 +95,13 @@ export function createAppEventBindings({
       actions.applyConversationChrome();
       actions.renderMessages();
       void (async () => {
-        await actions.loadModels();
         await Promise.allSettled([
+          actions.loadModels(),
           actions.loadAgentMode(),
-          actions.loadRuntimeConfig(),
+          actions.loadRuntimeConfig({
+            protectUnsaved: false,
+            clearBeforeLoad: true,
+          }),
         ]);
         await actions.restoreLastSession();
       })();

package/dist/src/web-ui/app/controllers/composer-attachments-controller.d.ts

@@ -0,0 +1,92 @@
+export type ComposerAttachment = Record<string, unknown> & {
+  id?: string;
+  kind?: string;
+  name?: string;
+  mimeType?: string;
+  sessionId?: string;
+  storageRef?: string;
+  environment?: string;
+};
+
+export type ComposerUploadFile = Blob & {
+  name?: string;
+};
+
+export interface ComposerAttachmentsState {
+  currentSessionId: string;
+  pendingAttachments: ComposerAttachment[];
+  pendingAttachmentUploadCounts: Map<number, number>;
+  composerAttachmentGeneration: number;
+}
+
+export interface ComposerAttachmentsDom {
+  attachmentButton: {
+    disabled: boolean;
+    title: string;
+  };
+  attachmentPreview: {
+    innerHTML: string;
+    appendChild(child: unknown): unknown;
+  };
+}
+
+export interface ComposerAttachmentsShell {
+  showToast(message: string): void;
+}
+
+export interface ComposerAttachmentLocation {
+  environmentId: string;
+  sessionId: string;
+  storageRef: string;
+  id: string;
+  mimeType: string;
+}
+
+export interface ComposerAttachmentsClient {
+  attachmentPreviewUrl(location: ComposerAttachmentLocation): string;
+  deleteAttachment(location: ComposerAttachmentLocation): Promise<void>;
+  uploadAttachment(options: {
+    environmentId: string;
+    sessionId: string;
+    name: string;
+    mimeType: string;
+    file: Blob;
+  }): Promise<ComposerAttachment>;
+}
+
+export interface ComposerAttachmentControlEvent {
+  type: "control";
+  name: string;
+  tone: "failed";
+  summary: string;
+}
+
+export interface ComposerAttachmentsControllerOptions {
+  state: ComposerAttachmentsState;
+  dom: ComposerAttachmentsDom;
+  shell: ComposerAttachmentsShell;
+  client: ComposerAttachmentsClient;
+  selectedEnvironmentId: () => string;
+  selectedModelSupportsImageInput: () => boolean;
+  ensureSession: () => void;
+  onSendStateChange: () => void;
+  onControlEvent: (event: ComposerAttachmentControlEvent) => void;
+  isComposerAvailable?: () => boolean;
+}
+
+export interface ComposerAttachmentsController {
+  activeUploadCount(): number;
+  clear(options?: { cleanup?: boolean }): void;
+  cleanup(attachments: readonly ComposerAttachment[]): void;
+  deletePending(attachment: ComposerAttachment): Promise<void>;
+  invalidateCompletions(): void;
+  previewUrl(attachment: ComposerAttachment): string;
+  removeUnsupportedImages(): void;
+  render(): void;
+  setUploadInProgress(uploading: boolean, generation?: number): void;
+  upload(file: ComposerUploadFile): Promise<void>;
+}
+
+export declare function createComposerAttachmentsController(
+  options: ComposerAttachmentsControllerOptions,
+): ComposerAttachmentsController;