@anchrd/intel-ui 0.9.1 → 0.12.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anchrd/intel-ui",
-  "version": "0.9.1",
+  "version": "0.12.0",
   "type": "module",
   "license": "UNLICENSED",
   "repository": {
@@ -29,7 +29,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@anchrd/intel-contract": "^0.5.0",
+    "@anchrd/intel-contract": "^0.7.0",
     "@assistant-ui/react": "^0.15.4",
     "@assistant-ui/react-ai-sdk": "^1.4.4",
     "@blocknote/core": "^0.52.1",

package/src/agent/agent-definition/agent-definition.ts

@@ -1,4 +1,4 @@
-import type { AgentDefinition, NodeAgent } from "@anchrd/intel-contract";
+import type { AgentDefinition, AgentDefinitionInput, NodeAgent } from "@anchrd/intel-contract";
 import {
   type UseMutationResult,
   type UseQueryResult,
@@ -14,7 +14,25 @@ export const agentKey = (nodeId: string) => ["agent", nodeId] as const;
 export interface AgentDefinitionHandle {
   query: UseQueryResult<NodeAgent>;
   definition: AgentDefinition | null;
-  save: UseMutationResult<NodeAgent, Error, AgentDefinition>;
+  save: UseMutationResult<NodeAgent, Error, AgentDefinitionInput>;
+}
+
+/**
+ * The definition as it was read, turned back into something this screen may ASK for (D30).
+ *
+ * ⚠️ It exists to drop exactly one field: `tools.delegatedBy`. Whose portal connection an agent
+ * acts on is Intel's to write, out of the session, and the input shape has no place for it — so a
+ * section that edits schedules must not carry it along just because it was in what it read. Every
+ * section spreads this rather than the definition itself, which is why none of them has to invent a
+ * user id for an agent that has no tools yet.
+ */
+export function asDraft(definition: AgentDefinition): AgentDefinitionInput {
+  return {
+    references: definition.references,
+    schedules: definition.schedules,
+    model: definition.model,
+    tools: definition.tools === null ? null : { servers: definition.tools.servers },
+  };
 }
 
 /**
@@ -31,7 +49,7 @@ export function useAgentDefinition(nodeId: string): AgentDefinitionHandle {
   const queryClient = useQueryClient();
   const query = useQuery({ queryKey: agentKey(nodeId), queryFn: () => data.getAgent(nodeId) });
   const save = useMutation({
-    mutationFn: async (definition: AgentDefinition) =>
+    mutationFn: async (definition: AgentDefinitionInput) =>
       await data.saveAgentDefinition({
         nodeId,
         baseVersionId: query.data?.version?.id ?? null,
@@ -42,6 +60,11 @@ export function useAgentDefinition(nodeId: string): AgentDefinitionHandle {
     // next save needs that id as its `baseVersionId`, and a round trip would leave a window in
     // which it is still the old one.
     onSuccess: (saved) => queryClient.setQueryData(agentKey(nodeId), saved),
+    // ⚠️ A failed save may still have MOVED the version (#214): `agent_schedules_not_armed` means
+    // the definition was written and only the runtime's alarm was not set, and the repair it names
+    // is saving again. With the old `baseVersionId` still cached that second save would answer 409
+    // instead — so the version this screen writes against is refetched whenever a save fails.
+    onError: () => queryClient.invalidateQueries({ queryKey: agentKey(nodeId) }),
   });
   return { query, definition: query.data?.definition ?? null, save };
 }

package/src/agent/agent-models/agent-models.ts

@@ -1,5 +1,6 @@
 import { AgentModel } from "@anchrd/intel-contract";
 import { z } from "zod";
+import type { ModelFacts, ModelPrice } from "./agent-models.types.ts";
 
 /**
  * Which models this installation offers.
@@ -7,8 +8,7 @@ import { z } from "zod";
  * ⚠️ There is no endpoint to ask. The runtime's registry answers one question — "is this provider
  * configured" — and only when a run is already starting; nothing anywhere lists what a deployment
  * pays for. Rather than invent an API for one screen, the list is build configuration
- * (`VITE_AGENT_MODELS`, a JSON array of `{provider, model}`), with the two the repository's own
- * fixtures use as the default.
+ * (`VITE_AGENT_MODELS`, a JSON array of `{provider, model}`), with the offering below as the default.
  *
  * ⚠️ The definition's current model is always offered, even when it is not in the list. A select
  * that silently dropped it would turn "look at this agent" into "change this agent" for anyone who
@@ -16,10 +16,105 @@ import { z } from "zod";
  */
 const ConfiguredModels = z.array(AgentModel);
 
-const firstFallback: AgentModel = { provider: "anthropic", model: "claude-sonnet-4" };
+/**
+ * Context window and price per model, collected 2026-08-06 from
+ * `GET /accounts/{id}/ai/models/search` (Workers AI, every entry carrying `function_calling`) and
+ * from Anthropic's model list. Both figures are shown beside the select, so this table is the one
+ * place to correct when they move.
+ *
+ * ⚠️ It is a copy and it ages silently. Cloudflare changes context windows and prices without
+ * notice, and a wrong price in the interface is worse than none — re-read the endpoint above rather
+ * than editing a number from memory. Asking live from the browser is not the way out: the account
+ * token does not belong in a SPA.
+ *
+ * ⚠️ Workers AI models that do not carry `function_calling` are deliberately absent. An agent is a
+ * tool loop; a model that cannot call a tool cannot run one, and offering it would only produce a
+ * broken agent for whoever picked it.
+ */
+const catalog: Record<string, { name: string; contextTokens: number; price: ModelPrice }> = {
+  "anthropic:claude-opus-5": price("Opus 5", 1_000_000, 5, 25),
+  "anthropic:claude-sonnet-5": price("Sonnet 5", 1_000_000, 3, 15),
+  "anthropic:claude-sonnet-4": price("Sonnet 4", 200_000, 3, 15),
+  "anthropic:claude-haiku-4-5": price("Haiku 4.5", 200_000, 1, 5),
+  "workers-ai:@cf/openai/gpt-oss-120b": price("GPT-OSS 120B", 128_000, 0.35, 0.75),
+  "workers-ai:@cf/openai/gpt-oss-20b": price("GPT-OSS 20B", 128_000, 0.2, 0.3),
+  "workers-ai:@cf/moonshotai/kimi-k2.6": price("Kimi K2.6", 262_144, 0.95, 4),
+  "workers-ai:@cf/moonshotai/kimi-k2.7-code": price("Kimi K2.7 Code", 262_144, 0.95, 4),
+  "workers-ai:@cf/zai-org/glm-5.2": price("GLM 5.2", 262_144, 1.4, 4.4),
+  "workers-ai:@cf/zai-org/glm-4.7-flash": price("GLM 4.7 Flash", 131_072, 0.0605, 0.4),
+  "workers-ai:@cf/google/gemma-4-26b-a4b-it": price("Gemma 4 26B", 256_000, 0.1, 0.3),
+  "workers-ai:@cf/nvidia/nemotron-3-120b-a12b": price("Nemotron 3 120B", 256_000, 0.5, 1.5),
+  "workers-ai:@cf/meta/llama-4-scout-17b-16e-instruct": price("Llama 4 Scout", 131_000, 0.27, 0.85),
+  "workers-ai:@cf/meta/llama-3.3-70b-instruct-fp8-fast": price(
+    "Llama 3.3 70B Fast",
+    24_000,
+    0.293,
+    2.253,
+  ),
+  "workers-ai:@cf/mistralai/mistral-small-3.1-24b-instruct": price(
+    "Small 3.1 24B",
+    128_000,
+    0.351,
+    0.555,
+  ),
+  "workers-ai:@cf/ibm-granite/granite-4.0-h-micro": price(
+    "Granite 4.0 Micro",
+    131_000,
+    0.017,
+    0.112,
+  ),
+  "workers-ai:@cf/qwen/qwen3-30b-a3b-fp8": price("Qwen3 30B", 32_768, 0.0509, 0.335),
+};
+
+function price(
+  name: string,
+  contextTokens: number,
+  inputPerMillion: number,
+  outputPerMillion: number,
+): { name: string; contextTokens: number; price: ModelPrice } {
+  return { name, contextTokens, price: { inputPerMillion, outputPerMillion } };
+}
+
+/**
+ * ⚠️ The brand comes from the model id, never from `provider`. `provider` says who serves the model,
+ * so every Workers AI entry would read "Cloudflare" — thirteen identical labels in a list whose whole
+ * job is to tell them apart. The name a reader looks for sits in the id, as its second segment:
+ * `@cf/openai/gpt-oss-120b` is OpenAI's.
+ */
+const brands: Record<string, string> = {
+  aisingapore: "AI Singapore",
+  "deepseek-ai": "DeepSeek",
+  google: "Google",
+  "ibm-granite": "IBM",
+  meta: "Meta",
+  "meta-llama": "Meta",
+  mistralai: "Mistral",
+  moonshotai: "Moonshot",
+  nvidia: "NVIDIA",
+  openai: "OpenAI",
+  qwen: "Qwen",
+  "zai-org": "Z.ai",
+};
+
+const firstFallback: AgentModel = { provider: "anthropic", model: "claude-sonnet-5" };
 const fallback: [AgentModel, ...AgentModel[]] = [
   firstFallback,
+  { provider: "anthropic", model: "claude-opus-5" },
+  { provider: "anthropic", model: "claude-haiku-4-5" },
+  { provider: "anthropic", model: "claude-sonnet-4" },
+  { provider: "workers-ai", model: "@cf/openai/gpt-oss-120b" },
+  { provider: "workers-ai", model: "@cf/openai/gpt-oss-20b" },
+  { provider: "workers-ai", model: "@cf/moonshotai/kimi-k2.6" },
+  { provider: "workers-ai", model: "@cf/moonshotai/kimi-k2.7-code" },
+  { provider: "workers-ai", model: "@cf/zai-org/glm-5.2" },
+  { provider: "workers-ai", model: "@cf/zai-org/glm-4.7-flash" },
+  { provider: "workers-ai", model: "@cf/google/gemma-4-26b-a4b-it" },
+  { provider: "workers-ai", model: "@cf/nvidia/nemotron-3-120b-a12b" },
+  { provider: "workers-ai", model: "@cf/meta/llama-4-scout-17b-16e-instruct" },
   { provider: "workers-ai", model: "@cf/meta/llama-3.3-70b-instruct-fp8-fast" },
+  { provider: "workers-ai", model: "@cf/mistralai/mistral-small-3.1-24b-instruct" },
+  { provider: "workers-ai", model: "@cf/ibm-granite/granite-4.0-h-micro" },
+  { provider: "workers-ai", model: "@cf/qwen/qwen3-30b-a3b-fp8" },
 ];
 
 export function modelKey(model: AgentModel): string {
@@ -36,6 +131,50 @@ export function parseModelKey(key: string): AgentModel | null {
   return parsed.success ? parsed.data : null;
 }
 
+// How a model is written for a person: brand first, then the model's own name, then the two numbers
+// somebody actually chooses on. A model outside the catalog keeps its own id as the name and reports
+// no figures at all.
+export function modelFacts(model: AgentModel): ModelFacts {
+  const known = catalog[modelKey(model)];
+  if (known) {
+    return {
+      brand: brandOf(model),
+      name: known.name,
+      contextTokens: known.contextTokens,
+      price: known.price,
+    };
+  }
+  return { brand: brandOf(model), name: unknownName(model), contextTokens: null, price: null };
+}
+
+function brandOf(model: AgentModel): string {
+  if (model.provider === "anthropic") return "Claude";
+  const vendor = model.model.split("/")[1];
+  if (!vendor) return "Workers AI";
+  return brands[vendor] ?? vendor;
+}
+
+// The id itself, not a prettified guess. "claude-opus-4-1" would become "Opus 4 1" under any rule
+// simple enough to write here, and a wrong name is harder to recognise than a raw one.
+function unknownName(model: AgentModel): string {
+  if (model.provider === "anthropic") return model.model.replace(/^claude-/, "");
+  const segments = model.model.split("/");
+  return segments[segments.length - 1] ?? model.model;
+}
+
+export function formatContextTokens(tokens: number): string {
+  if (tokens >= 1_000_000) return `${Math.round(tokens / 1_000_000)}M`;
+  if (tokens >= 1_000) return `${Math.round(tokens / 1_000)}k`;
+  return String(tokens);
+}
+
+// ⚠️ Two decimals at least, three at most, and always per one million tokens. Granite costs $0.017
+// per million in: rounded to two decimals it reads $0.02, which is the same price as a model that
+// costs seventeen percent more.
+export function formatPricePerMillion(dollars: number, locale: string): string {
+  return dollars.toLocaleString(locale, { minimumFractionDigits: 2, maximumFractionDigits: 3 });
+}
+
 export function configuredModels(): AgentModel[] {
   const raw = import.meta.env.VITE_AGENT_MODELS;
   if (!raw) return fallback;

package/src/agent/agent-models/agent-models.types.ts

@@ -0,0 +1,18 @@
+/** What a reader needs in order to pick a model: whose it is, what it is called, and what it costs. */
+export interface ModelFacts {
+  brand: string;
+  name: string;
+  /**
+   * ⚠️ Both are null for a model this installation has no figures for, and the display then shows
+   * nothing rather than a zero. A definition is written by MCP and by other installations too, so an
+   * unknown model is normal — and an invented "0" would be a false statement about money.
+   */
+  contextTokens: number | null;
+  price: ModelPrice | null;
+}
+
+/** Always US dollars per one million tokens — never per 1k, never a single blended number. */
+export interface ModelPrice {
+  inputPerMillion: number;
+  outputPerMillion: number;
+}

package/src/agent/agent-profile/agent-profile.tsx

@@ -5,12 +5,20 @@ import {
   type AgentSchedule,
   type Node,
 } from "@anchrd/intel-contract";
-import { useQuery } from "@tanstack/react-query";
-import { Check, Copy, Info, MessageSquare, Plus, Trash2, Wrench } from "lucide-react";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { Check, Copy, Info, KeyRound, MessageSquare, Plus, Trash2, Wrench } from "lucide-react";
 import { useState } from "react";
-import type { AgentDefinitionHandle } from "@/agent/agent-definition/agent-definition.ts";
+import { type AgentDefinitionHandle, asDraft } from "@/agent/agent-definition/agent-definition.ts";
 import { useEntryTitle } from "@/agent/agent-entry-title/agent-entry-title.ts";
-import { modelKey, parseModelKey, selectableModels } from "@/agent/agent-models/agent-models.ts";
+import {
+  formatContextTokens,
+  formatPricePerMillion,
+  modelFacts,
+  modelKey,
+  parseModelKey,
+  selectableModels,
+} from "@/agent/agent-models/agent-models.ts";
+import type { ModelFacts } from "@/agent/agent-models/agent-models.types.ts";
 import {
   Select,
   SelectContent,
@@ -69,12 +77,17 @@ function SectionHint({ hint }: { hint: string }) {
 
 /**
  * Everything an agent is, on one page: how to reach it, what it reads, what it may call, when it
- * acts on its own, and which model does the thinking.
+ * acts on its own, which model does the thinking, and who it is in Gate.
+ *
+ * ⚠️ Four of the six sections write, and they all write the SAME way — a whole new definition
+ * version through `save` (see `agent-definition.ts`). Tools joined them with D30: what it writes is
+ * a selection of whole MCP servers out of the signed-in person's own portal connection, never a
+ * mirrored permission, so ADR-0003 still holds — the catalog behind a chosen server stays a live
+ * `tools/list`.
  *
- * ⚠️ Four of the five sections write, and all four write the SAME way — a whole new definition
- * version through `save` (see `agent-definition.ts`). Tools is the exception and stays read-only on
- * purpose: the portal decides who reaches which tool, Intel stores none of it, and a control here
- * would be a promise this product is not allowed to keep (ADR-0003).
+ * ⚠️ Contact and Identity are the two that do not. Identity acts in Gate and in the agent runtime
+ * rather than on the document, and a key has no business being in a definition — a definition is
+ * versioned, shared and read into model context (ADR-0005 §4).
  */
 export function AgentProfile({ node, agent }: { node: Node; agent: AgentDefinitionHandle }) {
   const { i18n } = useIntelRouterContext();
@@ -113,13 +126,97 @@ export function AgentProfile({ node, agent }: { node: Node; agent: AgentDefiniti
       ) : null}
       <ContactSection node={node} />
       <KnowledgeSection definition={definition} agent={agent} />
-      <ToolsSection />
+      <ToolsSection definition={definition} agent={agent} />
       <ScheduleSection definition={definition} agent={agent} />
       <ModelSection definition={definition} agent={agent} />
+      <IdentitySection node={node} agent={agent} />
     </div>
   );
 }
 
+/**
+ * Who the agent IS to the rest of the installation, and the one button that repairs it (D29, #207).
+ *
+ * ⚠️ The application ID is shown and the key is not, because only one of the two is a name. The key
+ * exists in Gate for the length of one call and goes straight into the agent runtime; there is
+ * nothing for this page to reveal, copy or store, and that is what makes an agent created here able
+ * to run without anybody opening a terminal (#200).
+ *
+ * ⚠️ Last on the page on purpose. It is the section a reader needs on the day something is wrong,
+ * not while they are describing what the agent should do.
+ */
+function IdentitySection({ node, agent }: { node: Node; agent: AgentDefinitionHandle }) {
+  const { data, i18n } = useIntelRouterContext();
+  const queryClient = useQueryClient();
+  const [confirming, setConfirming] = useState(false);
+  const applicationId = agent.query.data?.applicationId ?? null;
+
+  const rotate = useMutation({
+    mutationFn: async () => await data.rotateAgentKey(node.id),
+    onSuccess: () => {
+      setConfirming(false);
+      // The run that failed with `agent_key_missing` is the reason somebody pressed this, so the
+      // page's own state is re-read rather than left showing the refusal that sent them here.
+      void queryClient.invalidateQueries({ queryKey: ["agent-state", node.id] });
+    },
+  });
+
+  return (
+    <Section title={i18n.t("agent.identity")} hint={i18n.t("agent.identityHint")}>
+      <div className="flex flex-wrap items-center gap-3 rounded-lg border bg-card px-4 py-3">
+        <KeyRound aria-hidden="true" className="size-4 shrink-0 text-primary" />
+        <span className="min-w-0 flex-1">
+          <span className="block text-sm font-medium">{i18n.t("agent.principal")}</span>
+          <code className="mt-0.5 block truncate text-xs text-muted-foreground">
+            {applicationId ?? i18n.t("agent.principalNone")}
+          </code>
+        </span>
+        <button
+          type="button"
+          onClick={() => setConfirming(true)}
+          disabled={applicationId === null || rotate.isPending}
+          aria-busy={rotate.isPending}
+          {...(applicationId === null ? { "aria-describedby": "agent-rotate-reason" } : {})}
+          className="inline-flex shrink-0 items-center gap-1.5 rounded-md border px-2.5 py-1.5 text-xs outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-50"
+        >
+          {i18n.t("agent.rotateKey")}
+        </button>
+      </div>
+      {applicationId === null ? (
+        <p id="agent-rotate-reason" className="mt-3 text-xs text-muted-foreground">
+          {i18n.t("agent.principalNoneHint")}
+        </p>
+      ) : null}
+      {rotate.isError ? (
+        <p role="alert" className="mt-3 text-xs text-destructive">
+          {i18n.t("agent.rotateKeyFailed")}
+        </p>
+      ) : null}
+      {rotate.isSuccess ? (
+        <p role="status" className="mt-3 text-xs text-muted-foreground">
+          {i18n.t("agent.rotateKeyDone")}
+        </p>
+      ) : null}
+      {confirming ? (
+        <Modal title={i18n.t("agent.rotateKey")} close={() => setConfirming(false)}>
+          {/* ⚠️ Confirmed rather than done on the first click. The previous key stops working the
+              moment this runs, so a misclick takes a working agent down until the call finishes. */}
+          <p className="text-sm text-muted-foreground">{i18n.t("agent.rotateKeyConfirm")}</p>
+          <button
+            type="button"
+            onClick={() => rotate.mutate()}
+            disabled={rotate.isPending}
+            aria-busy={rotate.isPending}
+            className="mt-4 w-full rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground outline-none hover:bg-primary/90 focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-50"
+          >
+            {i18n.t("agent.rotateKey")}
+          </button>
+        </Modal>
+      ) : null}
+    </Section>
+  );
+}
+
 /**
  * How to reach this agent.
  *
@@ -228,7 +325,7 @@ function KnowledgeSection({
   const [adding, setAdding] = useState(false);
 
   function write(references: AgentReference[]) {
-    agent.save.mutate({ ...definition, references });
+    agent.save.mutate({ ...asDraft(definition), references });
   }
 
   return (
@@ -348,40 +445,130 @@ function EntryTitle({ entryId, flow = false }: { entryId: string; flow?: boolean
 }
 
 /**
- * What the agent may call.
+ * What the agent may call: whole MCP servers, given from the signed-in person's own portal
+ * connection (D30).
+ *
+ * ⚠️ What is saved is a SELECTION, never a catalog. The tools behind a server stay a live
+ * `tools/list` made with the delegator's token at the moment the agent runs (ADR-0003), so a server
+ * listed here is a name, not a promise — losing it in the portal takes it away from the agent with
+ * nothing to edit.
  *
- * ⚠️ Read-only, and read live. Intel stores no tool permissions — the catalog is one `tools/list`
- * with the signed-in user's own portal token (ADR-0003), and this section shows exactly what the
- * Tools screen shows because it asks the same question through the same provider method. Mirroring
- * the catalog into the definition is the one thing this product must not do.
+ * ⚠️ The notice is not decoration, and it stands whether or not anything is listed yet. A shared
+ * agent runs on the DELEGATOR's connection whoever starts it, which is a real widening of who can
+ * act as this person — so it belongs where somebody reads it BEFORE clicking `+ Add tool`, not as a
+ * footnote that appears once the first server is already given away. The empty list itself stays
+ * wordless, the way the other sections' do (#204): the button says what belongs here.
  */
-function ToolsSection() {
+function ToolsSection({
+  definition,
+  agent,
+}: {
+  definition: AgentDefinition;
+  agent: AgentDefinitionHandle;
+}) {
   const { data, i18n } = useIntelRouterContext();
-  const catalog = useQuery({ queryKey: ["tools"], queryFn: () => data.listTools() });
+  const [adding, setAdding] = useState(false);
+  const servers = useQuery({ queryKey: ["tool-servers"], queryFn: () => data.listToolServers() });
+  const selected = definition.tools?.servers ?? [];
+
+  // ⚠️ Servers, and nothing about who delegates them. The screen has no `delegatedBy` to send and
+  // no business inventing one — Intel writes it from the session, and `AgentDefinitionInput` has no
+  // field it could travel in. This is also what lets an agent with `tools: null`, which is every
+  // freshly created one, receive its first server at all.
+  function write(next: string[]) {
+    agent.save.mutate({ ...asDraft(definition), tools: { servers: next } });
+  }
+
+  const available = (servers.data?.items ?? []).filter(
+    (server) => !selected.includes(server.handle),
+  );
 
   return (
     <Section title={i18n.t("agent.tools")} hint={i18n.t("agent.toolsHint")}>
-      {catalog.isPending ? (
-        <p className="text-sm text-muted-foreground">{i18n.t("common.loading")}</p>
-      ) : catalog.isError ? (
-        <p role="alert" className="text-sm text-destructive">
-          {i18n.t("tools.unreachableHelp")}
-        </p>
-      ) : catalog.data &&
-        catalog.data.items.length ===
-          0 ? // Nothing rather than a paragraph (#204); the Tools screen still explains the empty catalog.
-      null : (
-        <ul className="flex flex-wrap gap-2">
-          {catalog.data?.items.map((tool) => (
-            <li
-              key={tool.name}
-              className="rounded-full border bg-card px-3 py-1 text-xs text-muted-foreground"
-            >
-              {tool.name}
-            </li>
-          ))}
+      {selected.length === 0 ? null : (
+        <ul className="space-y-2">
+          {selected.map((handle) => {
+            const known = servers.data?.items.find((server) => server.handle === handle);
+            return (
+              <li
+                key={handle}
+                className="flex flex-wrap items-center gap-3 rounded-lg border bg-card px-4 py-3"
+              >
+                <Wrench aria-hidden="true" className="size-4 shrink-0 text-primary" />
+                <span
+                  className={`min-w-0 flex-1 truncate text-sm${known ? "" : " text-muted-foreground"}`}
+                >
+                  {known?.name ?? handle}
+                </span>
+                {/* A server the signed-in person no longer reaches still stands in the definition,
+                    and saying so beats drawing it as if it worked. The agent gets nothing from it
+                    either — the catalog is cut against what the delegator reaches. */}
+                <span className="text-xs text-muted-foreground">
+                  {known
+                    ? i18n.t("tools.toolCount", { count: String(known.toolCount) })
+                    : i18n.t("agent.toolServerUnavailable")}
+                </span>
+                <button
+                  type="button"
+                  onClick={() => write(selected.filter((current) => current !== handle))}
+                  aria-label={i18n.t("agent.removeToolServerOf", { name: known?.name ?? handle })}
+                  className="rounded-md p-2 text-destructive outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring"
+                >
+                  <Trash2 aria-hidden="true" className="size-4" />
+                </button>
+              </li>
+            );
+          })}
         </ul>
       )}
+      <button
+        type="button"
+        onClick={() => setAdding(true)}
+        className="mt-3 inline-flex items-center gap-2 rounded-md border px-3 py-2 text-sm outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring"
+      >
+        <Plus aria-hidden="true" className="size-4" />
+        {i18n.t("agent.addTool")}
+      </button>
+      <p className="mt-3 text-xs text-muted-foreground">{i18n.t("agent.toolsDelegationNotice")}</p>
+      {adding ? (
+        <Modal title={i18n.t("agent.addTool")} close={() => setAdding(false)}>
+          {servers.isPending ? (
+            <p className="text-sm text-muted-foreground">{i18n.t("common.loading")}</p>
+          ) : servers.isError ? (
+            <p role="alert" className="text-sm text-destructive">
+              {i18n.t("tools.unreachableHelp")}
+            </p>
+          ) : servers.data?.portalConnected === false ? (
+            <p className="text-sm text-muted-foreground">{i18n.t("agent.toolsNotConnected")}</p>
+          ) : available.length === 0 ? (
+            <p className="text-sm text-muted-foreground">{i18n.t("agent.toolsNoneLeft")}</p>
+          ) : (
+            <ul className="space-y-2">
+              {available.map((server) => (
+                <li key={server.handle}>
+                  <button
+                    type="button"
+                    onClick={() => {
+                      write([...selected, server.handle]);
+                      setAdding(false);
+                    }}
+                    className="flex w-full items-center gap-3 rounded-lg border px-4 py-3 text-left outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring"
+                  >
+                    <Wrench aria-hidden="true" className="size-4 shrink-0 text-primary" />
+                    <span className="min-w-0 flex-1 truncate text-sm">{server.name}</span>
+                    <span className="text-xs text-muted-foreground">
+                      {i18n.t("tools.toolCount", { count: String(server.toolCount) })}
+                    </span>
+                  </button>
+                </li>
+              ))}
+            </ul>
+          )}
+          <p className="mt-4 text-xs text-muted-foreground">
+            {i18n.t("agent.toolsDelegationNotice")}
+          </p>
+        </Modal>
+      ) : null}
     </Section>
   );
 }
@@ -404,7 +591,7 @@ function ScheduleSection({
   const [adding, setAdding] = useState(false);
 
   function write(schedules: AgentSchedule[]) {
-    agent.save.mutate({ ...definition, schedules });
+    agent.save.mutate({ ...asDraft(definition), schedules });
   }
 
   return (
@@ -520,28 +707,69 @@ function ModelSection({
 }) {
   const { i18n } = useIntelRouterContext();
   const models = selectableModels(definition.model);
+  const current = modelFacts(definition.model);
 
   return (
     <Section title={i18n.t("agent.model")} hint={i18n.t("agent.modelHint")}>
-      <Select
-        value={modelKey(definition.model)}
-        onValueChange={(key) => {
-          const model = parseModelKey(key);
-          if (model) agent.save.mutate({ ...definition, model });
-        }}
-      >
-        <SelectTrigger aria-label={i18n.t("agent.model")} className="w-full max-w-md">
-          <SelectValue />
-        </SelectTrigger>
-        <SelectContent>
-          {models.map((model) => (
-            <SelectItem key={modelKey(model)} value={modelKey(model)}>
-              {model.model}
-              <span className="text-xs text-muted-foreground">{model.provider}</span>
-            </SelectItem>
-          ))}
-        </SelectContent>
-      </Select>
+      <div className="flex flex-wrap items-center gap-x-4 gap-y-2">
+        <Select
+          value={modelKey(definition.model)}
+          onValueChange={(key) => {
+            const model = parseModelKey(key);
+            if (model) agent.save.mutate({ ...asDraft(definition), model });
+          }}
+        >
+          <SelectTrigger aria-label={i18n.t("agent.model")} className="w-full max-w-md sm:w-72">
+            {/* ⚠️ Own children rather than the default mirror of the chosen item: the item carries
+                the figures too, and mirrored into the trigger they would stand twice in one row. */}
+            <SelectValue>
+              <ModelName facts={current} />
+            </SelectValue>
+          </SelectTrigger>
+          <SelectContent>
+            {models.map((model) => {
+              const facts = modelFacts(model);
+              return (
+                <SelectItem key={modelKey(model)} value={modelKey(model)}>
+                  {/* ⚠️ The space is not formatting. The option's accessible name is its text run
+                      together, so without it a screen reader reads "…70B Fast24k context". The eye
+                      never notices, because the row is a flex box with a gap. */}
+                  <ModelName facts={facts} /> <ModelFigures facts={facts} />
+                </SelectItem>
+              );
+            })}
+          </SelectContent>
+        </Select>
+        <ModelFigures facts={current} />
+      </div>
     </Section>
   );
 }
+
+// Brand first, then the model's own name — "Claude Sonnet 5", not "claude-sonnet-5 · anthropic". The
+// provider stays in the definition; it names who serves the model, which is not what anybody reads a
+// list of models for.
+function ModelName({ facts }: { facts: ModelFacts }) {
+  return (
+    <span className="truncate">
+      <span className="font-medium">{facts.brand}</span> {facts.name}
+    </span>
+  );
+}
+
+// The two numbers a model is actually chosen on. Absent for a model this installation has no figures
+// for — the row then simply ends, because a made-up zero would be a false statement about money.
+function ModelFigures({ facts }: { facts: ModelFacts }) {
+  const { i18n } = useIntelRouterContext();
+  if (facts.contextTokens === null || facts.price === null) return null;
+
+  return (
+    <span className="text-xs whitespace-nowrap text-muted-foreground">
+      {i18n.t("agent.modelFigures", {
+        context: formatContextTokens(facts.contextTokens),
+        input: formatPricePerMillion(facts.price.inputPerMillion, i18n.locale),
+        output: formatPricePerMillion(facts.price.outputPerMillion, i18n.locale),
+      })}
+    </span>
+  );
+}

package/src/agent/agent-state/agent-state.ts

@@ -46,3 +46,23 @@ export function agentAccessDenied(error: unknown): boolean {
 export function agentRuntimeMissing(error: unknown): boolean {
   return error instanceof IntelRequestError && error.code === "agent_runtime_not_configured";
 }
+
+/**
+ * The failure that has a repair path, and a name for it (D29, #207, and the short half of #200).
+ *
+ * ⚠️ The code, not the 500. An agent whose Durable Object holds no key starts no run at all — the
+ * runtime refuses before Gate is asked — and until #207 that arrived on this page as
+ * `That did not work. Try again.` next to `Run now`, which is advice that cannot work: trying again
+ * produces the same refusal forever. Naming it is what lets the page send the reader to the one
+ * thing that fixes it, which is replacing the key in the agent's profile.
+ *
+ * ⚠️ `agent_key_unreadable` counts as the same case on purpose. Its cause is different — the
+ * deployment's master secret was replaced — but the reader's move is identical, and a second
+ * sentence saying the same thing differently would only be a second thing to keep in step.
+ */
+export function agentKeyMissing(error: unknown): boolean {
+  return (
+    error instanceof IntelRequestError &&
+    (error.code === "agent_key_missing" || error.code === "agent_key_unreadable")
+  );
+}

package/src/agent/agent.tsx

@@ -10,6 +10,7 @@ import { AgentLog } from "@/agent/agent-log/agent-log.tsx";
 import { AgentProfile } from "@/agent/agent-profile/agent-profile.tsx";
 import {
   agentAccessDenied,
+  agentKeyMissing,
   agentRuntimeMissing,
   agentStateKey,
   useAgentState,
@@ -260,9 +261,12 @@ export function AgentActions({
           {runReason}
         </span>
       ) : null}
+      {/* ⚠️ An agent with no key in its Durable Object fails every run the same way forever, so
+          "try again" is advice that cannot work (#200). The one refusal with a repair path says
+          what the repair is, and names where it lives — the profile, not this bar (D29). */}
       {failure ? (
         <span role="alert" className="text-xs text-destructive max-sm:sr-only sm:inline">
-          {i18n.t("agent.actionFailed")}
+          {i18n.t(agentKeyMissing(failure) ? "agent.keyMissing" : "agent.actionFailed")}
         </span>
       ) : null}
       <button

package/src/app/app-tree/app-tree.tsx

@@ -213,7 +213,9 @@ export function AppTree() {
           parentId,
           title,
           description: null,
-          definition: { references: [], schedules: [], model: defaultModel() },
+          // A new agent has no tools: giving it any is a choice made in the profile, out of what
+          // this person reaches in the portal (D30).
+          definition: { references: [], schedules: [], model: defaultModel(), tools: null },
           idempotencyKey: crypto.randomUUID(),
         });
         return {

package/src/data/intel-data-provider/intel-data-provider.ts

@@ -1,4 +1,5 @@
 import {
+  AgentKeyRotated,
   AppendTableRowsInput,
   AppendTableRowsResult,
   ArchiveFlowInput,
@@ -52,6 +53,7 @@ import {
   ShareResult,
   StartFlowRunInput,
   ToolCatalog,
+  ToolServerCatalog,
   UpdateFlowInput,
   UpdateNodeInput,
 } from "@anchrd/intel-contract";
@@ -461,18 +463,38 @@ export function createIntelDataProvider(
     async listTools() {
       return await request("/tools", ToolCatalog);
     },
+    // The servers behind the same live list (D30). Its own call rather than a grouping done in the
+    // browser: which server a tool belongs to is the portal's answer, and a UI that split tool
+    // names would be guessing where the namespace ends.
+    async listToolServers() {
+      return await request("/tools/servers", ToolServerCatalog);
+    },
     async getAgent(nodeId) {
       return await request(`/nodes/${encodeURIComponent(nodeId)}/agent`, NodeAgent);
     },
-    // ⚠️ `CreatedAgent`, not `NodeAgent`: the create answer carries the Gate application key once
-    // (#182), and the read schema is strict — parsing this response with it would reject the one
-    // response in the product that has a credential in it.
+    // ⚠️ `CreatedAgent` is `NodeAgent` since D29, and that is the point rather than a leftover: the
+    // create answer used to carry the Gate application key once (#182), and the browser had to be
+    // given a credential it could not do anything with. It now goes from Gate into the agent runtime
+    // inside the request, so the create answers exactly what a read answers.
     async createAgent(input) {
       return await request("/nodes/agents", CreatedAgent, {
         method: "POST",
         body: JSON.stringify(CreateAgentInput.parse(input)),
       });
     },
+    /**
+     * Replace the key of the Gate Application an agent runs as (D29, #207).
+     *
+     * ⚠️ The repair path for `agent_key_missing`, and the answer carries no key — intel asks Gate
+     * and hands the new one to the runtime itself. Nothing here has a credential to hold.
+     */
+    async rotateAgentKey(nodeId) {
+      return await request(
+        `/nodes/agents/${encodeURIComponent(nodeId)}/rotate-key`,
+        AgentKeyRotated,
+        { method: "POST" },
+      );
+    },
     async saveAgentDefinition(input) {
       const parsed = SaveAgentDefinitionInput.parse(input);
       return await request(`/nodes/${encodeURIComponent(parsed.nodeId)}/agent`, NodeAgent, {

package/src/data/intel-data-provider/intel-data-provider.types.ts

@@ -1,4 +1,5 @@
 import type {
+  AgentKeyRotated,
   AgentScheduleTarget,
   AppendTableRowsInput,
   AppendTableRowsResult,
@@ -53,6 +54,7 @@ import type {
   ShareResult,
   StartFlowRunInput,
   ToolCatalog,
+  ToolServerCatalog,
   UpdateFlowInput,
   UpdateNodeInput,
 } from "@anchrd/intel-contract";
@@ -164,6 +166,7 @@ export interface IntelDataProvider {
   // Reading the catalog is the whole of the tool surface here: calling a tool belongs to a flow
   // or to the Intel MCP surface, not to the screen that shows what the portal offers.
   listTools(): Promise<ToolCatalog>;
+  listToolServers(): Promise<ToolServerCatalog>;
 
   // An agent node and the definition its current version carries. `definition` is `null` in the one
   // window where the node exists and no version has been written — the same window a document's
@@ -177,6 +180,10 @@ export interface IntelDataProvider {
   // is edited in place (ADR-0005). `baseVersionId` is the version the editor read, so a parallel
   // change is refused rather than silently overwritten.
   saveAgentDefinition(input: SaveAgentDefinitionInput): Promise<NodeAgent>;
+  // Replace the key of the Gate Application an agent runs as (D29). The repair path an agent that
+  // answers `agent_key_missing` has, and the only one — Gate keeps a key hashed. ⚠️ No key comes
+  // back: intel hands the new one to the agent runtime itself.
+  rotateAgentKey(nodeId: string): Promise<AgentKeyRotated>;
 
   // ⚠️ The seven below are answered by the agent RUNTIME, a separate Worker — but they are asked of
   // intel, which proxies them with the caller's own Gate token (#178). One origin, one cookie, no

package/src/i18n/en.json

@@ -170,7 +170,10 @@
   "tools.connectFailed": "Portal sign-in failed",
   "tools.connectFailedHelp": "The sign-in to the company MCP portal broke before it could be answered. This is a technical fault, not a decision about your access — reload to try again, and tell an administrator if it stays.",
   "tools.origin": "Origin",
-  "tools.originPortal": "Company portal",
+  "tools.originUnlisted": "Not from a listed server",
+  "tools.originUnlistedHelp": "The portal's server list names no server for these. Its own management tools sit here — the portal does not list itself — and so does anything from a server the list did not mention.",
+  "tools.ungrouped": "Not sorted by server",
+  "tools.ungroupedHelp": "The company MCP portal did not answer which servers these tools come from, so Intel cannot say which tool belongs where. Everything you can reach is listed below; only the grouping is missing.",
   "tools.inputSchema": "Input schema",
   "tools.outputSchema": "Result schema",
   "tools.destructiveShort": "Destructive",
@@ -292,11 +295,21 @@
   "agent.runNowNoTarget": "This agent has no schedule, so there is nothing to run.",
   "agent.runNowPaused": "Resume the agent before running it.",
   "agent.actionFailed": "That did not work. Try again.",
+  "agent.keyMissing": "This agent has no application key, so no run can start. Replace its key under Identity in the profile.",
   "agent.notPermitted": "You may read this agent, but not drive it. Driving an agent needs the “run agents” permission.",
   "agent.noRuntime": "This installation runs no agent runtime, so this agent cannot chat or run here. Its definition is kept and works again on an installation that has one.",
   "agent.loadFailed": "This agent could not be loaded. Check your access and try again.",
   "agent.saveFailed": "The change was not saved. Somebody else may have changed this agent first — reload and try again.",
   "agent.noDefinition": "This agent has no definition yet, so there is nothing to change here.",
+  "agent.identity": "Identity",
+  "agent.identityHint": "The Gate application this agent acts as. Its grants in the tree decide what a run may read and write, and its key lives encrypted in the agent runtime — never here and never in the definition.",
+  "agent.principal": "Gate application",
+  "agent.principalNone": "None",
+  "agent.principalNoneHint": "This agent has no Gate application, so there is no key to replace. Agents created before this feature, imported, or restored from a bundle are given one in Gate.",
+  "agent.rotateKey": "Replace key",
+  "agent.rotateKeyConfirm": "A new key is issued and given to the agent runtime. The previous key stops working immediately, and no key is ever shown here.",
+  "agent.rotateKeyDone": "The key was replaced. The agent runs with the new one from its next run.",
+  "agent.rotateKeyFailed": "The key was not replaced. Try again — and keep trying until it succeeds: if Gate already issued the new key, this agent cannot run until the agent runtime has it.",
   "agent.contact": "Contact",
   "agent.contactHint": "How this agent is reached. The built-in chat is part of the runtime and is always there.",
   "agent.contactChat": "Built-in chat",
@@ -317,7 +330,13 @@
   "agent.role.memory": "Memory",
   "agent.unknownEntry": "Not available to you",
   "agent.tools": "Tools",
-  "agent.toolsHint": "Read live from the company portal with your own access. Intel stores no tool permissions; the portal decides who may reach what.",
+  "agent.toolsHint": "The MCP servers you give this agent, out of the ones you reach yourself. Intel stores the choice, never the permission — the tools behind a server are read live with your portal access every time the agent runs.",
+  "agent.addTool": "Add tool",
+  "agent.removeToolServerOf": "Take {name} away from this agent",
+  "agent.toolServerUnavailable": "You no longer reach this server",
+  "agent.toolsDelegationNotice": "Anyone who may run this agent acts on your connection.",
+  "agent.toolsNotConnected": "You are not signed in to the company portal yet, so there is nothing to give away. Open Tools to connect.",
+  "agent.toolsNoneLeft": "Every server you reach is already given to this agent.",
   "agent.schedule": "Schedule",
   "agent.scheduleHint": "When this agent acts on its own, and what it runs. Times are UTC — a definition carries no timezone.",
   "agent.scheduleEmpty": "This agent runs only when it is asked.",
@@ -328,6 +347,7 @@
   "agent.cronHint": "Five fields, in UTC: minute, hour, day of month, month, day of week. “0 8 * * *” is every day at 08:00.",
   "agent.model": "Model",
   "agent.modelHint": "Which model does the thinking. A change is picked up by the runtime within a minute.",
+  "agent.modelFigures": "{context} context · ${input} in / ${output} out per 1M tokens",
   "agent.calendar": "Upcoming runs",
   "agent.calendarUtc": "All times are UTC, because that is when the agent runs.",
   "agent.calendarUnreadable": "None of this agent's schedules can be read as a cron expression, so nothing is planned.",

package/src/tools/tools.tsx

@@ -1,4 +1,4 @@
-import type { ToolCapability } from "@anchrd/intel-contract";
+import { serverOf, type ToolCapability, type ToolServer } from "@anchrd/intel-contract";
 import { useQuery } from "@tanstack/react-query";
 import { useRouterState } from "@tanstack/react-router";
 import { AlertTriangle, ChevronRight, PlugZap, ShieldOff, Timer, Wrench } from "lucide-react";
@@ -9,38 +9,55 @@ import type { I18n } from "@/i18n/i18n.types.ts";
 import { useIntelRouterContext } from "@/router/router-context.ts";
 import { selectedFrom } from "@/router/selection-search.ts";
 
-// The portal namespaces every tool as `<server>__<tool>`, and that prefix is the whole of what
-// Intel ever learns about a tool's origin: the portal resolves the real server and holds its
-// credentials (ADR-0003). A name without a namespace has no origin beyond the portal itself.
-const NamespaceSeparator = "__";
-
-function toolOrigin(name: string): string | null {
-  const boundary = name.indexOf(NamespaceSeparator);
-  return boundary > 0 ? name.slice(0, boundary) : null;
-}
-
 interface ToolGroup {
-  // `null` is a tool the portal answers without a namespace: its origin is the portal itself.
-  origin: string | null;
+  // The handle the portal named, or `null` for the box holding what no named server carries.
+  handle: string | null;
+  label: string;
   items: ToolCapability[];
 }
 
-// The catalog arrives as one flat list of a hundred-odd names, and the namespace is the only thing
-// that says which server a tool belongs to. Grouping is therefore not decoration — it is the one
-// piece of structure the wire carries, made visible (#99).
-//
-// The order is the portal's own: a group appears where its first tool appears. Sorting here would
-// replace an answer with a preference, and the portal already returns a server's tools together.
-function groupByOrigin(items: ToolCapability[]): ToolGroup[] {
+/**
+ * The tools of one catalog, under the servers the portal itself named (#212).
+ *
+ * ⚠️ The grouping comes from `GET /api/v1/tools/servers`, never from the tool name alone. The name
+ * cannot say where the server part ends — `intel_flow_get` reads as `intel` + `flow_get` and as
+ * `intel_flow` + `get` — so this screen matches the portal's own handles with the same `serverOf`
+ * the delegation is cut with, longest match wins. The earlier reading, a cut at a separator, was
+ * shipped twice and was wrong twice: at `__` it put all 92 tools of the running installation in one
+ * box, because the portal writes a single underscore (#106), and at `_` it would break the first
+ * server whose slug carries one (#107, closed for that reason).
+ *
+ * ⚠️ A tool that matches no named handle is NOT dropped. It goes into its own box: the portal's
+ * management tools (`portal_list_servers`) live there, because the portal does not list itself as
+ * an upstream, and so does anything from a server the directory failed to mention. Hiding those
+ * would make the screen quietly disagree with `tools/list` — and the count on the lid is what the
+ * reader compares against the portal.
+ *
+ * The order is the portal's own: a group appears where its first tool appears, because the portal
+ * returns a server's tools together and sorting would replace its answer with a preference. Only
+ * the unattributed box is forced last — it is a remainder, not a server, and it must not lead.
+ */
+function groupByServer(
+  items: ToolCapability[],
+  servers: ToolServer[],
+  unlistedLabel: string,
+): ToolGroup[] {
+  const named = new Map(servers.map((server) => [server.handle, server.name]));
   const groups = new Map<string, ToolGroup>();
+  const unlisted: ToolGroup = { handle: null, label: unlistedLabel, items: [] };
   for (const item of items) {
-    const origin = toolOrigin(item.name);
-    const key = origin ?? "";
-    const group = groups.get(key) ?? { origin, items: [] };
+    const handle = serverOf(item.name, named.keys());
+    if (handle === null) {
+      unlisted.items.push(item);
+      continue;
+    }
+    // The server's display name, not its handle: `notion` is what the wire says, and what the
+    // portal calls it is what the reader knows it by.
+    const group = groups.get(handle) ?? { handle, label: named.get(handle) ?? handle, items: [] };
     group.items.push(item);
-    groups.set(key, group);
+    groups.set(handle, group);
   }
-  return [...groups.values()];
+  return unlisted.items.length > 0 ? [...groups.values(), unlisted] : [...groups.values()];
 }
 
 // Signed in to Intel is signed in to the portal, so the sign-in is attempted at most once per
@@ -65,6 +82,22 @@ function attemptStore(): Storage | null {
 export function Tools() {
   const { data, i18n } = useIntelRouterContext();
   const catalog = useQuery({ queryKey: ["tools"], queryFn: () => data.listTools() });
+  // The servers behind that same live list (D30). Its own query, and its own failure: a portal that
+  // answers tools but no directory still has a usable screen, it just has no boxes to put them in.
+  // The key is the one the agent profile already reads the directory under, so a visit to either
+  // screen serves the other from cache.
+  // ⚠️ No retry on this one, and that is a decision about the screen rather than about the request.
+  // The tools are held back until the directory has answered, so every further attempt is time
+  // somebody spends in front of the word "Loading" — and a retry does not even have to happen: a
+  // React Query retry is PAUSED while the tab is unfocused, so a screen waiting on one can stay
+  // "Loading" for as long as the reader is looking elsewhere. A portal that offers no directory
+  // answers the same 502 every time anyway; one attempt settles it, and what follows is the list
+  // plus the sentence saying why it is not sorted.
+  const servers = useQuery({
+    queryKey: ["tool-servers"],
+    queryFn: () => data.listToolServers(),
+    retry: false,
+  });
   // A hit from the header search arrives as `?select=<tool name>`, and the row it names opens with
   // the list. Nothing else about the row changes: it is still only a disclosure.
   const requested = useRouterState({ select: (state) => selectedFrom(state.location.search) });
@@ -162,26 +195,77 @@ export function Tools() {
             title={i18n.t("tools.empty")}
             help={i18n.t("tools.emptyHelp")}
           />
+        ) : servers.isPending ? (
+          // The tools are here and the servers are not yet. Showing the flat list first and
+          // reshuffling it a moment later would be a screen that moves under the reader's hand.
+          <p className="text-sm text-muted-foreground">{i18n.t("common.loading")}</p>
         ) : (
-          <>
-            <div className="space-y-3">
-              {groupByOrigin(catalog.data.items).map((group) => (
-                <ServerGroup
-                  key={group.origin ?? ""}
-                  group={group}
-                  i18n={i18n}
-                  requested={requested}
-                />
-              ))}
-            </div>
-            <p className="text-xs text-muted-foreground">{i18n.t("tools.liveNote")}</p>
-          </>
+          <ToolCatalogView
+            items={catalog.data.items}
+            servers={servers.isError ? [] : servers.data.items}
+            i18n={i18n}
+            requested={requested}
+          />
         )}
       </div>
     </div>
   );
 }
 
+/**
+ * The catalog, under the portal's servers where there are any.
+ *
+ * ⚠️ No directory, no boxes — and the screen says why instead of inventing them. A portal that does
+ * not offer `portal_list_servers`, or whose answer Intel cannot read, makes `/tools/servers` fail,
+ * and every alternative to this sentence is a guess: a cut at an underscore, or the one box called
+ * "Company portal" that held all 92 tools of the running installation (#106). The tools are all
+ * here, in the order the portal answered them; only the grouping is missing.
+ */
+function ToolCatalogView({
+  items,
+  servers,
+  i18n,
+  requested,
+}: {
+  items: ToolCapability[];
+  servers: ToolServer[];
+  i18n: I18n;
+  requested: string | null;
+}) {
+  if (servers.length === 0) {
+    return (
+      <>
+        <section className="rounded-xl border border-dashed bg-card px-5 py-4">
+          <h2 className="text-sm font-semibold">{i18n.t("tools.ungrouped")}</h2>
+          <p className="mt-1 text-sm text-muted-foreground">{i18n.t("tools.ungroupedHelp")}</p>
+        </section>
+        {/* Open, not a lid: with no server to name, a closed box would hide the whole catalog
+            behind a word that says nothing. */}
+        <section className="overflow-hidden rounded-xl border bg-card shadow-sm">
+          <ToolRows items={items} i18n={i18n} requested={requested} />
+        </section>
+        <p className="text-xs text-muted-foreground">{i18n.t("tools.liveNote")}</p>
+      </>
+    );
+  }
+  return (
+    <>
+      <div className="space-y-3">
+        {groupByServer(items, servers, i18n.t("tools.originUnlisted")).map((group) => (
+          <ServerGroup
+            key={group.handle ?? ""}
+            group={group}
+            note={group.handle === null ? i18n.t("tools.originUnlistedHelp") : null}
+            i18n={i18n}
+            requested={requested}
+          />
+        ))}
+      </div>
+      <p className="text-xs text-muted-foreground">{i18n.t("tools.liveNote")}</p>
+    </>
+  );
+}
+
 function Notice({
   icon,
   title,
@@ -213,10 +297,14 @@ function Notice({
 // somebody wants to know about it (#99).
 function ServerGroup({
   group,
+  note,
   i18n,
   requested,
 }: {
   group: ToolGroup;
+  // Why this box exists at all, for the one box that is not a server. A group named by the portal
+  // needs no explanation; the remainder does, or it reads as a server called something odd.
+  note: string | null;
   i18n: I18n;
   requested: string | null;
 }) {
@@ -224,14 +312,13 @@ function ServerGroup({
   // with it — otherwise Enter on a hit lands on a screen where nothing happened.
   const holdsRequested = group.items.some((item) => item.name === requested);
   const destructive = group.items.filter((item) => item.annotations.destructiveHint).length;
-  const label = group.origin ?? i18n.t("tools.originPortal");
   const count =
     group.items.length === 1
       ? i18n.t("tools.toolCountOne")
       : i18n.t("tools.toolCount", { count: group.items.length });
   // The badges beside the name read as one run-on word when a screen reader concatenates them
   // ("wiki1 tool"), so the control says its own name instead of being read off its contents.
-  const spoken = [`${i18n.t("tools.origin")}: ${label}`, count];
+  const spoken = [`${i18n.t("tools.origin")}: ${group.label}`, count];
   if (destructive > 0) spoken.push(i18n.t("tools.destructiveCount", { count: destructive }));
 
   return (
@@ -246,7 +333,7 @@ function ServerGroup({
             className="size-4 shrink-0 text-muted-foreground transition-transform group-data-[state=open]:rotate-90"
           />
           <span className="min-w-0 flex-1">
-            <span className="block truncate text-sm font-semibold">{label}</span>
+            <span className="block truncate text-sm font-semibold">{group.label}</span>
           </span>
           {/* Closed, the box hides every destructive badge inside it. The count says so on the lid
               rather than making somebody open each server to find out. */}
@@ -258,24 +345,39 @@ function ServerGroup({
           )}
           <span className="shrink-0 text-xs text-muted-foreground">{count}</span>
         </CollapsibleTrigger>
-        <CollapsibleContent>
-          <ul className="divide-y border-t">
-            {group.items.map((capability) => (
-              <li key={capability.name}>
-                <ToolEntry
-                  capability={capability}
-                  i18n={i18n}
-                  open={capability.name === requested}
-                />
-              </li>
-            ))}
-          </ul>
+        <CollapsibleContent className="border-t">
+          {note && (
+            <p className="border-b bg-muted/50 px-5 py-3 text-xs text-muted-foreground">{note}</p>
+          )}
+          <ToolRows items={group.items} i18n={i18n} requested={requested} />
         </CollapsibleContent>
       </section>
     </Collapsible>
   );
 }
 
+// The rows themselves, with or without a box around them: the ungrouped screen shows the same list
+// without a lid, and duplicating it there is how the two would drift apart.
+function ToolRows({
+  items,
+  i18n,
+  requested,
+}: {
+  items: ToolCapability[];
+  i18n: I18n;
+  requested: string | null;
+}) {
+  return (
+    <ul className="divide-y">
+      {items.map((capability) => (
+        <li key={capability.name}>
+          <ToolEntry capability={capability} i18n={i18n} open={capability.name === requested} />
+        </li>
+      ))}
+    </ul>
+  );
+}
+
 // One tool, one disclosure. The row is the only control in the list: it opens the schema and does
 // nothing else — enabling, sharing or permitting a tool happens in the portal, never here.
 function ToolEntry({