@abot-ai/runtime 1.4.0 → 1.5.0

package/dist/src/web-ui/app/components/passive-learning/agent-state.js

@@ -0,0 +1,131 @@
+import { hasLearningProcessingFailure, learningCollectionStatus, learningStateLabel, learningTimeLabel } from "./presentation.js";
+import { isObservationReviewActive, observationReviewSummary } from "./processing-state.js";
+
+const failures = new Set(["failed", "unavailable", "disconnected", "permission_required"]);
+
+export function latestVisibleProposal(status) {
+  return [...(status?.proactive?.proposals ?? [])].reverse().find((item) => item.status === "delivered");
+}
+
+function isReviewing(status) {
+  if (isObservationReviewActive(status)) return true;
+  if (status.reassessment?.state === "reviewing") return true;
+  return status.proactive?.state === "reviewing";
+}
+function isCollecting(status) {
+  status = learningCollectionStatus(status);
+  if (!status.preferences?.enabled) return false;
+  return status.state === "collecting" || status.state === "partial";
+}
+function hasActivityFailure(status) {
+  if (hasLearningProcessingFailure(status)) return true;
+  if (status.proactive?.state === "failed") return true;
+  if (status.reassessment?.state === "failed" || status.maintenanceReason) return true;
+  status = learningCollectionStatus(status);
+  if (!failures.has(status.state)) return false;
+  if (status.preferences?.enabled) return true;
+  return status.state === "failed";
+}
+function isBudgetLimited(status) {
+  if (status.proactive?.state === "budget_limited") return true;
+  if (status.reassessment?.state === "budget_limited") return true;
+  return String(status.reason || "").includes("budget_exhausted");
+}
+function isCompletelyPaused(status) {
+  if (status.preferences?.enabled || status.preferences?.proactiveEnabled) return false;
+  return status.preferences?.processingPaused || !status.preferences?.modelProfileId;
+}
+
+/** Presentation of committed runtime state only; this never advances a schedule. */
+export function coWorkerAgentState(snapshot) {
+  const status = snapshot.status;
+  if (!status) return { mode: "quiet", label: "Connecting", title: "ABot Spark", description: "Checking the current activity…" };
+  if (snapshot.statusError) return { mode: "attention", label: "Connection interrupted", title: "Waiting to reconnect.", description: "The last known activity is shown below. Refresh to check the connection." };
+  if (isReviewing(status)) return { mode: "reviewing", label: "Working now", title: "Finding what matters.", description: status.proactive?.state === "reviewing" ? "Considering whether there’s something useful to offer you." : "Reviewing activity and refining what’s worth remembering." };
+  if (latestVisibleProposal(status)) return { mode: "suggestion", label: "Something to share", title: "A thought for your next step.", description: "A conversation is ready. Read it when it suits you." };
+  if (hasActivityFailure(status)) return { mode: "attention", label: "Needs attention",
+    title: (status.processingReason || status.reason) === "learning_model_request_failed" ? "Let’s check the learning model." : "One activity needs attention.",
+    description: hasLearningProcessingFailure(status) ? "Learning could not finish its review. Check learning settings; saved knowledge is still here." : "Your saved knowledge is still here. Check the activity details below." };
+  if (isBudgetLimited(status)) return { mode: "quiet", label: "Taking a break", title: "Within your limits.", description: "The current budget is used up. Eligible work can continue after the limit resets." };
+  if (isCollecting(status)) return { mode: "collecting", label: "Noticing activity", title: "Getting to know your rhythm.", description: "Collecting changes in your active apps. Only useful patterns should become lasting knowledge." };
+  if (isCompletelyPaused(status)) return { mode: "quiet", label: "Taking a pause", title: "Ready when you are.", description: "Your saved knowledge is here. Each activity has its own controls." };
+  return { mode: "waiting", label: "Ready in the background", title: "Room for the next idea.", description: "Waiting for eligible work. No model runs just to keep this screen alive." };
+}
+
+function nextLabel(value, window) {
+  if (!value) return window ? `${window.start}–${window.end} · ${window.timeZone}` : "No hours restriction";
+  return `Next ${learningTimeLabel(value)}${window ? ` · ${window.timeZone}` : ""}`;
+}
+export function coWorkerActivityStates(status) {
+  if (!status) return { collection: ["—", ""], processing: ["—", ""], proactive: ["—", ""] };
+  const p = status.preferences;
+  const processing = processingLabel(status);
+  const proactive = proactiveLabel(status);
+  return {
+    collection: [learningStateLabel(status), p.enabled ? nextLabel(status.nextCollectionAt, p.collectionWindow) : "No new activity collected"],
+    processing: [processing, processingDetail(status)],
+    proactive: [proactive, p.proactiveEnabled ? nextLabel(status.proactive?.nextReviewAt, p.proactiveWindow) : "No unsolicited messages"],
+  };
+}
+function processingDetail(status) {
+  if (isObservationReviewActive(status)) return observationReviewSummary(status);
+  if (status.preferences.processingPaused) return "Pending activity stays within its retention limit";
+  if (status.reviewPassRemaining > 0) {
+    const remaining = `${status.reviewPassRemaining} observations left in this review`;
+    if (status.nextAnalysisAt) return `${remaining} · ${nextLabel(status.nextAnalysisAt, status.preferences.analysisWindow)}`;
+    return remaining;
+  }
+  if (status.preferences.analysisTrigger === "observations") {
+    const progress = `${status.pendingObservations} / ${status.preferences.analysisObservationCount ?? 100} eligible observations`;
+    if (status.nextAnalysisAt) return `${progress} · ${nextLabel(status.nextAnalysisAt, status.preferences.analysisWindow)}`;
+    return progress;
+  }
+  return nextLabel(status.nextAnalysisAt || status.reassessment?.nextReviewAt, status.preferences.analysisWindow);
+}
+
+export function learningCadenceLabel(preferences) {
+  if (preferences.analysisTrigger === "observations") return `Review at ${preferences.analysisObservationCount ?? 100} observations`;
+  return `Every ${preferences.analysisIntervalMinutes ?? 15} min`;
+}
+function processingLabel(status) {
+  if (isObservationReviewActive(status)) return "Processing now";
+  if (!status.preferences.modelProfileId) return "Choose a model";
+  if (status.preferences.processingPaused) return "Paused";
+  if (status.reassessment?.state === "reviewing") return "Reviewing knowledge";
+  if (hasLearningProcessingFailure(status)) return "Needs attention";
+  if (status.reassessment?.state === "failed") return "Needs attention";
+  if (status.reassessment?.state === "budget_limited") return "Budget reached";
+  if (status.pendingObservations > 0) return `${status.pendingObservations} observations waiting`;
+  return "Waiting for useful activity";
+}
+function proactiveLabel(status) {
+  if (!status.preferences.proactiveEnabled) return "Off";
+  if (status.proactive?.state === "reviewing") return "Considering an idea";
+  if (status.proactive?.state === "budget_limited") return "Budget reached";
+  if (status.proactive?.state === "failed") return "Needs attention";
+  return "Enabled · waiting";
+}
+
+export function coWorkerActivityTones(status) {
+  if (!status) return { collection: "off", processing: "off", proactive: "off" };
+  const p = status.preferences;
+  let collection = "off", processing = "off", proactive = "off";
+  if (p.enabled) {
+    collection = "waiting";
+    if (isCollecting(status)) collection = "active";
+    if (failures.has(learningCollectionStatus(status).state)) collection = "attention";
+  }
+  if (!p.processingPaused && p.modelProfileId) {
+    processing = "ready";
+    if (status.pendingObservations > 0) processing = "waiting";
+    if (status.reassessment?.state === "reviewing") processing = "active";
+    if (hasLearningProcessingFailure(status) || status.reassessment?.state === "failed" || status.reassessment?.state === "budget_limited") processing = "attention";
+  }
+  if (isObservationReviewActive(status)) processing = "active";
+  if (p.proactiveEnabled) {
+    proactive = "ready";
+    if (status.proactive?.state === "reviewing") proactive = "active";
+    if (status.proactive?.state === "failed" || status.proactive?.state === "budget_limited") proactive = "attention";
+  }
+  return { collection, processing, proactive };
+}

package/dist/src/web-ui/app/components/passive-learning/agent-view.js

@@ -0,0 +1,40 @@
+import { coWorkerActivityStates, coWorkerActivityTones, coWorkerAgentState } from "./agent-state.js";
+import { isObservationReviewActive } from "./processing-state.js";
+
+const glyph = `<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3c0 6-3 9-9 9 6 0 9 3 9 9 0-6 3-9 9-9-6 0-9-3-9-9Z"/><path d="M18 3v4m-2-2h4"/></svg>`;
+
+export function agentMarkup({ compact = false, actionMarkup = "" } = {}) {
+  return `<section class="co-worker-agent${compact ? " co-worker-agent-compact" : ""}" data-coworker-agent data-agent-mode="quiet" data-motion="off" aria-label="ABot Spark activity">
+    <div class="co-worker-agent-main">
+      <div class="co-worker-art" aria-hidden="true"><div class="co-worker-wave"></div><div class="co-worker-orbit"><i data-orbit-phase="collection"></i><i data-orbit-phase="processing"></i><i data-orbit-phase="proactive"></i></div><div class="co-worker-core">${glyph}</div><div class="co-worker-spark"></div></div>
+      <div class="co-worker-agent-copy"><span class="co-worker-agent-label" data-agent-status>Connecting</span><h3 data-agent-title tabindex="-1" data-learning-heading>ABot Spark</h3><p data-agent-description></p></div>
+      ${actionMarkup}
+    </div>
+    <div class="co-worker-phases">
+      <div class="co-worker-phase" data-agent-phase="collection"><span>Collection</span><p data-agent-collection data-learning-state>—</p><small data-agent-collection-time></small></div>
+      <div class="co-worker-phase" data-agent-phase="processing" data-agent-processing-phase><span>Learning</span><p data-agent-processing role="status">—</p><small data-agent-processing-time></small></div>
+      <div class="co-worker-phase" data-agent-phase="proactive"><span>Proactive</span><p data-agent-proactive>—</p><small data-agent-proactive-time></small></div>
+    </div>
+  </section>`;
+}
+
+export function renderAgent(root, snapshot) {
+  const agent = root.querySelector("[data-coworker-agent]");
+  if (!agent) return;
+  const state = coWorkerAgentState(snapshot);
+  agent.setAttribute("data-agent-mode", state.mode);
+  agent.querySelector("[data-agent-processing-phase]").setAttribute("data-processing-active", String(!snapshot.statusError && isObservationReviewActive(snapshot.status)));
+  const setText = (selector, value) => { const node = agent.querySelector(selector); if (node.textContent !== value) node.textContent = value; };
+  setText("[data-agent-status]", state.label);
+  setText("[data-agent-title]", state.title);
+  setText("[data-agent-description]", state.description);
+  const tones = coWorkerActivityTones(snapshot.status);
+  for (const [key, [label, time]] of Object.entries(coWorkerActivityStates(snapshot.status))) {
+    const tone = snapshot.statusError ? "attention" : tones[key];
+    setText(`[data-agent-${key}]`, label);
+    agent.querySelector(`[data-agent-${key}]`).setAttribute("data-phase-state", tone);
+    agent.querySelector(`[data-agent-phase="${key}"]`).setAttribute("data-phase-state", tone);
+    agent.querySelector(`[data-orbit-phase="${key}"]`).setAttribute("data-phase-state", tone);
+    setText(`[data-agent-${key}-time]`, time);
+  }
+}

package/dist/src/web-ui/app/components/passive-learning/application-actions.js

@@ -0,0 +1,22 @@
+const exclusionFields = Object.freeze({ collection: "excludedApplications", processing: "processingExcludedApplications" });
+const applicationKey = app => app.trim().toLowerCase();
+
+/** Change one permission using current server preferences; other activity rules stay untouched. */
+export function learningApplicationPreferenceChange(snapshot, { app, axis, allowed, environmentId }) {
+  if (!canChangeApplicationPreferences(snapshot, environmentId)) return null;
+  if (!Object.hasOwn(exclusionFields, axis) || typeof allowed !== "boolean") return null;
+  if (typeof app !== "string" || !app.trim()) return null;
+  const application = snapshot.status.applications.find(item => applicationKey(item.app) === applicationKey(app));
+  if (!application) return null;
+  const field = exclusionFields[axis];
+  const excluded = snapshot.status.preferences[field] ?? [];
+  const remaining = excluded.filter(value => applicationKey(value) !== applicationKey(application.app));
+  return { [field]: allowed ? remaining : [...remaining, application.app] };
+}
+
+function canChangeApplicationPreferences(snapshot, environmentId) {
+  if (snapshot.environmentId !== environmentId) return false;
+  if (snapshot.saving || snapshot.statusError) return false;
+  if (!snapshot.status?.preferences) return false;
+  return Array.isArray(snapshot.status.applications);
+}

package/dist/src/web-ui/app/components/passive-learning/applications-view.js

@@ -0,0 +1,126 @@
+import { learningTimeLabel } from "./presentation.js";
+import { learningApplicationPreferenceChange } from "./application-actions.js";
+
+export function learningApplicationsMarkup() {
+  return `<section class="co-worker-applications" aria-label="Application permissions">
+    <div class="passive-learning-section-heading"><div><h4>Applications</h4><p>Choose which apps ABot Spark can collect and review.</p></div><button type="button" data-learning-refresh>Refresh</button></div>
+    <p class="co-worker-applications-note">Collect activity controls future captures. Process activity controls whether retained activity can be reviewed.</p>
+    <p class="co-worker-applications-feedback" data-learning-applications-feedback role="status" aria-live="polite"></p>
+    <p class="co-worker-applications-count" data-learning-applications-count></p>
+    <div class="co-worker-applications-list" data-learning-applications></div>
+    <p class="co-worker-applications-note">Activity blocked from processing remains pending within existing expiry and storage limits. Content already sent to a model cannot be retracted. Saved memories are kept.</p>
+  </section>`;
+}
+
+export function createLearningApplications({ root, actions }) {
+  const list = root.querySelector("[data-learning-applications]");
+  const feedback = root.querySelector("[data-learning-applications-feedback]");
+  const count = root.querySelector("[data-learning-applications-count]");
+  const rows = new Map();
+  let environmentId;
+  let empty;
+
+  function element(tag, className, text) {
+    const node = root.ownerDocument.createElement(tag);
+    node.className = className;
+    if (text) node.textContent = text;
+    return node;
+  }
+
+  function createRow(app) {
+    const row = element("article", "co-worker-application");
+    row.setAttribute("data-learning-application", app);
+    const identity = element("div", "co-worker-application-identity");
+    const icon = element("span", "co-worker-application-icon", Array.from(app).slice(0, 2).join("").toUpperCase());
+    icon.setAttribute("aria-hidden", "true");
+    const text = element("div", "co-worker-application-text");
+    const title = element("h5", "", app); title.setAttribute("dir", "auto");
+    const detail = element("p", "");
+    text.append(title); text.append(detail); identity.append(icon); identity.append(text); row.append(identity);
+    const controls = {};
+    for (const [axis, label] of [["collection", "Collect activity"], ["processing", "Process activity"]]) {
+      const toggle = element("label", "co-worker-setting-switch co-worker-application-toggle");
+      const input = element("input", "");
+      input.setAttribute("type", "checkbox");
+      input.setAttribute("data-learning-application-axis", axis);
+      input.setAttribute("aria-label", `${label} · ${app}`);
+      toggle.append(input); toggle.append(element("span", "", label)); row.append(toggle);
+      controls[axis] = input;
+    }
+    list.append(row);
+    return { row, detail, controls };
+  }
+
+  function showEmpty(message) {
+    if (!empty) { empty = element("p", "co-worker-applications-empty"); list.append(empty); }
+    empty.textContent = message;
+  }
+
+  function render(snapshot) {
+    if (environmentId !== snapshot.environmentId) {
+      environmentId = snapshot.environmentId;
+      list.replaceChildren(); rows.clear(); empty = undefined;
+    }
+    const applications = Array.isArray(snapshot.status?.applications) ? snapshot.status.applications : [];
+    const available = Boolean(snapshot.status && Array.isArray(snapshot.status.applications));
+    const disabled = snapshot.saving || snapshot.statusError || !available;
+    feedback.textContent = applicationFeedback(snapshot);
+    count.textContent = available ? applicationCatalogLabel(applications.length, snapshot.status.applicationsOmitted) : "";
+    const current = new Set(applications.map(item => item.app));
+    for (const [app, value] of rows) {
+      if (current.has(app)) continue;
+      value.row.remove(); rows.delete(app);
+    }
+    if (!applications.length) {
+      showEmpty(applicationsEmptyMessage(snapshot, available));
+      return;
+    }
+    empty?.remove(); empty = undefined;
+    for (const item of applications) {
+      const value = rows.get(item.app) ?? createRow(item.app);
+      rows.set(item.app, value);
+      value.row.setAttribute("data-learning-application-environment", String(snapshot.environmentId));
+      const observations = Number.isSafeInteger(item.observationCount) ? Math.max(0, item.observationCount) : 0;
+      const observed = item.lastObservedAt ? ` · Last collected ${learningTimeLabel(item.lastObservedAt)}` : "";
+      value.detail.textContent = observations ? `${observations} retained ${observations === 1 ? "observation" : "observations"}${observed}` : "No retained activity";
+      value.controls.collection.checked = !item.collectionExcluded;
+      value.controls.processing.checked = !item.processingExcluded;
+      value.controls.collection.disabled = Boolean(disabled);
+      value.controls.processing.disabled = Boolean(disabled);
+    }
+  }
+
+  function handleChange(event) {
+    const input = event.target.closest("input[data-learning-application-axis]");
+    if (!input || !root.contains(input)) return false;
+    if (event.type === "input") return true;
+    const row = input.closest("[data-learning-application]");
+    const snapshot = actions.snapshot();
+    const patch = learningApplicationPreferenceChange(snapshot, { app: row?.dataset.learningApplication,
+      axis: input.dataset.learningApplicationAxis, allowed: input.checked,
+      environmentId: row?.dataset.learningApplicationEnvironment });
+    if (patch) void actions.configure(patch);
+    render(actions.snapshot());
+    return true;
+  }
+
+  return Object.freeze({ render, handleChange });
+}
+
+function applicationFeedback(snapshot) {
+  if (snapshot.statusError) return "Application status is unavailable. Refresh before changing permissions.";
+  if (snapshot.saving) return "Saving changes…";
+  return "";
+}
+
+function applicationsEmptyMessage(snapshot, available) {
+  if (snapshot.loadingStatus) return "Loading applications…";
+  if (available) return "Applications appear here as activity is collected. Excluded apps stay listed.";
+  return "Application history is unavailable.";
+}
+
+function applicationCatalogLabel(count, omitted) {
+  const label = `${count} ${count === 1 ? "application" : "applications"} · Retained activity`;
+  if (!Number.isSafeInteger(omitted) || omitted <= 0) return label;
+  return `${label} · ${omitted} older applications not shown`;
+}

package/dist/src/web-ui/app/components/passive-learning/batch-detail.js

@@ -0,0 +1,143 @@
+import { learningTimeLabel } from "./presentation.js";
+import { learningFailureCopy } from "./failure-copy.js";
+import { renderLearningDiagnostics } from "./diagnostics-view.js";
+
+const batchStatusLabels = Object.freeze({
+  pending: "Waiting",
+  processing: "Reviewing",
+  saved: "Completed",
+  reviewed: "Candidates updated",
+  discarded: "Discarded",
+  failed: "Failed",
+  cancelled: "Cancelled",
+});
+
+export function learningBatchStatusLabel(status) {
+  return batchStatusLabels[status] || "Status unavailable";
+}
+
+function observationKindLabel(kind) {
+  if (kind === "edit") return "Text changed";
+  if (kind === "activity") return "Returned to this app";
+  return "Viewed";
+}
+
+function observationText(observation) {
+  if (typeof observation.content === "string" && observation.content.trim())
+    return observation.content;
+  if (observation.revisit?.contentUnchanged || observation.revisitsObservationId)
+    return "No new text since the previous view.";
+  if (observation.kind === "activity")
+    return "Activity was observed without new text.";
+  return "This app did not expose readable text for this observation.";
+}
+
+function renderObservation(container, observation) {
+  const documentRoot = container.ownerDocument;
+  const element = (tag, className, text) => {
+    const node = documentRoot.createElement(tag);
+    node.className = className;
+    if (text) node.textContent = text;
+    return node;
+  };
+  const item = documentRoot.createElement("details");
+  item.className = "passive-learning-observation";
+  const summary = documentRoot.createElement("summary");
+  const app = observation.source?.app || "Unknown app";
+  const icon = element("span", "passive-learning-observation-icon", Array.from(app).slice(0, 2).join("").toUpperCase());
+  icon.setAttribute("aria-hidden", "true");
+  const heading = element("div", "passive-learning-observation-heading");
+  const labels = element("div", "passive-learning-observation-labels");
+  labels.append(element("span", "passive-learning-observation-app", app));
+  labels.append(element("span", "passive-learning-observation-kind", observationKindLabel(observation.kind)));
+  const source = element("span", "passive-learning-observation-source", observation.source?.title || "Untitled window");
+  source.setAttribute("dir", "auto");
+  const time = element("time", "passive-learning-observation-meta", learningTimeLabel(observation.timestamp));
+  if (Number.isFinite(Date.parse(observation.timestamp || ""))) time.setAttribute("datetime", observation.timestamp);
+  heading.append(labels);
+  heading.append(source);
+  heading.append(time);
+  summary.append(icon);
+  summary.append(heading);
+
+  const body = element("div", "passive-learning-observation-body");
+  const readable = typeof observation.content === "string" && observation.content.trim();
+  if (readable) body.append(element("p", "passive-learning-observation-content-label", "Captured text"));
+  const content = documentRoot.createElement("pre");
+  content.setAttribute("dir", "auto");
+  content.setAttribute("tabindex", "0");
+  content.setAttribute("aria-label", readable ? "Captured text" : "Observation context");
+  content.textContent = observationText(observation);
+  body.append(content);
+  const diagnostics = [observation.coverage, observation.coverageReason]
+    .filter(Boolean).join(" · ");
+  if (diagnostics) {
+    const note = element("details", "passive-learning-observation-diagnostics");
+    note.append(element("summary", "", "Capture details"));
+    note.append(element("code", "", diagnostics));
+    body.append(note);
+  }
+  item.append(summary);
+  item.append(body);
+  container.append(item);
+}
+
+export function renderLearningBatchDetail(container, snapshot) {
+  container.hidden = !snapshot.selectedBatchId;
+  if (container.hidden) return;
+  container.replaceChildren();
+  if (snapshot.loadingDetail) {
+    container.textContent = "Loading review details…";
+    return;
+  }
+  if (snapshot.detailError) {
+    container.textContent = "Review details could not be loaded. Refresh to try again.";
+    return;
+  }
+  const batch = snapshot.selectedBatch;
+  if (!batch) return;
+  const observations = Array.isArray(batch.observations) ? batch.observations : [];
+  const documentRoot = container.ownerDocument;
+  const header = documentRoot.createElement("header");
+  header.className = "passive-learning-detail-header";
+  const heading = documentRoot.createElement("h5");
+  heading.textContent = "Review details";
+  const summary = documentRoot.createElement("p");
+  const observationLabel = observations.length === 1 ? "observation" : "observations";
+  summary.textContent = `${learningBatchStatusLabel(batch.status)} · ${observations.length} ${observationLabel} · ${batch.recordIds?.length || 0} saved · ${batch.candidateIds?.length || 0} candidates`;
+  header.append(heading);
+  header.append(summary);
+  const close = documentRoot.createElement("button");
+  close.setAttribute("type", "button");
+  close.setAttribute("data-learning-batch", "");
+  close.textContent = "Close details";
+  header.append(close);
+  container.append(header);
+  if (batch.reason || batch.status === "failed") {
+    const explanation = learningFailureCopy(batch.reason);
+    const reason = documentRoot.createElement("p");
+    reason.className = "passive-learning-detail-reason";
+    reason.textContent = explanation.message;
+    container.append(reason);
+    if (explanation.code) {
+      const details = documentRoot.createElement("details");
+      details.className = "passive-learning-diagnostics";
+      const label = documentRoot.createElement("summary");
+      label.textContent = "Technical details";
+      const codes = documentRoot.createElement("dl");
+      codes.className = "passive-learning-diagnostic-list";
+      renderLearningDiagnostics(codes, [explanation.code]);
+      details.append(label);
+      details.append(codes);
+      container.append(details);
+    }
+  }
+  if (!observations.length) {
+    const empty = documentRoot.createElement("p");
+    empty.textContent = "No observations were included in this batch.";
+    container.append(empty);
+    return;
+  }
+  for (const observation of observations)
+    renderObservation(container, observation);
+}

package/dist/src/web-ui/app/components/passive-learning/computer-update-notice.js

@@ -0,0 +1,13 @@
+export function computerUpdateNoticeMarkup() {
+  return `<div class="co-worker-computer-update" data-learning-update hidden role="status">
+    <span class="co-worker-computer-update-icon" aria-hidden="true">↑</span>
+    <div class="co-worker-computer-update-copy"><p class="co-worker-computer-update-title">Computer access update available</p>
+      <p data-learning-update-text>Update this computer to get the latest fixes and collection protections.</p></div>
+    <button type="button" data-learning-open-update>Update Computer access <span aria-hidden="true">↗</span></button>
+  </div>`;
+}
+
+export function renderComputerUpdateNotice(root, snapshot) {
+  root.querySelector("[data-learning-update]").hidden =
+    !snapshot.hostConnection?.companion?.updateAvailable;
+}

package/dist/src/web-ui/app/components/passive-learning/diagnostics-view.js

@@ -0,0 +1,28 @@
+import { learningFailureCopy } from "./failure-copy.js";
+
+/** Render status codes with explanations, without interpreting provider error bodies. */
+export function renderLearningDiagnostics(container, reasons) {
+  container.replaceChildren();
+  const documentRoot = container.ownerDocument;
+  for (const reason of new Set(reasons.filter(Boolean))) {
+    const copy = learningFailureCopy(reason);
+    const code = diagnosticCode(reason);
+    const row = documentRoot.createElement("div");
+    row.className = "passive-learning-diagnostic-row";
+    const key = documentRoot.createElement("dt");
+    const label = documentRoot.createElement("code");
+    label.textContent = code;
+    key.append(label);
+    const description = documentRoot.createElement("dd");
+    description.textContent = copy.code ? copy.message : "No explanation is available for this status yet.";
+    row.append(key);
+    row.append(description);
+    container.append(row);
+  }
+}
+
+function diagnosticCode(value) {
+  if (typeof value !== "string") return "unrecognized_status";
+  if (!/^[a-z][a-z0-9_]{0,100}$/u.test(value)) return "unrecognized_status";
+  return value;
+}