@anchrd/intel-ui 0.28.0 → 0.31.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anchrd/intel-ui",
-  "version": "0.28.0",
+  "version": "0.31.0",
   "type": "module",
   "license": "UNLICENSED",
   "repository": {
@@ -33,7 +33,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@anchrd/intel-contract": "^0.17.0",
+    "@anchrd/intel-contract": "^0.19.0",
     "@blocknote/core": "^0.52.1",
     "@blocknote/react": "^0.52.1",
     "@blocknote/shadcn": "^0.52.1",

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

@@ -12,6 +12,7 @@ import {
 } from "lucide-react";
 import { useRef, useState } from "react";
 import {
+  allTreeLevelsKey,
   type MoveDestination,
   moveErrorKey,
   moveVerdict,
@@ -176,13 +177,18 @@ export function AppTree() {
   // ⚠️ The level a row appears in is not the only thing that goes stale. The header search reads
   // the whole flow list, and the graph is what the link picker and the flow editor's tree links
   // offer — a row created here has to reach those too, or another screen keeps showing yesterday.
+  //
+  // ⚠️ And the level written into is not enough either: the folder's own ROW says whether it can be
+  // opened at all, and that row stands one level higher (`allTreeLevelsKey`, #519). Without it the
+  // `toggle` above opens a folder whose arrow never appeared, so the first thing filed into an empty
+  // folder was invisible until the page was reloaded.
   async function reveal(
     parentId: string | null,
     collection: "flows" | "node-graph",
   ): Promise<void> {
     if (parentId !== null) toggle({ id: parentId, type: "folder" }, true);
     await Promise.all([
-      queryClient.invalidateQueries({ queryKey: levelKey({ id: parentId, type: "folder" }) }),
+      queryClient.invalidateQueries({ queryKey: allTreeLevelsKey }),
       queryClient.invalidateQueries({ queryKey: [collection] }),
       // The graph view of that same level draws exactly this list, so it goes stale for the same
       // reason the level does (#19).
@@ -233,8 +239,19 @@ export function AppTree() {
     },
     onSuccess: async (created) => {
       setCreating(null);
-      await reveal(created.parentId, created.collection);
-      await navigate({ to: created.area, search: { select: created.id } });
+      // ⚠️ The screen first, the refreshes after. Since #519 `reveal` waits on EVERY mounted level,
+      // and a React Query retry is paused while the tab is not in front (#212) — awaiting that
+      // before navigating would leave somebody who just made a document sitting on the old screen
+      // for as long as one level takes to answer.
+      //
+      // ⚠️ `finally`, because both screens are lazy chunks: a failed chunk load throws out of
+      // `navigate`, and without this the tree, the collections and the graph would silently keep
+      // yesterday's rows for the rest of the session — the very state this ticket is about.
+      try {
+        await navigate({ to: created.area, search: { select: created.id } });
+      } finally {
+        await reveal(created.parentId, created.collection);
+      }
     },
   });
 
@@ -275,8 +292,12 @@ export function AppTree() {
       return { id: node.id, parentId };
     },
     onSuccess: async (created) => {
-      await reveal(created.parentId, "node-graph");
-      await navigate({ to: "/nodes", search: { select: created.id } });
+      // The order — and the `finally` — are the ones above, for the same two reasons.
+      try {
+        await navigate({ to: "/nodes", search: { select: created.id } });
+      } finally {
+        await reveal(created.parentId, "node-graph");
+      }
     },
   });
 

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

@@ -31,6 +31,33 @@ export function treeLevelKey(parentId: string | null): readonly unknown[] {
   return ["tree", parentId];
 }
 
+/**
+ * Every level of the tree at once — what a write that changed what is IN a folder makes stale.
+ *
+ * ⚠️ Not the level that was written into: that is the obvious half, and it was the whole of #519.
+ * A folder ROW carries `openable` — since #59 the arrow only stands where there is something to
+ * open — and that is a statement about the folder's CONTENTS living one level ABOVE it. Refresh
+ * only the level below and the row keeps yesterday's answer: the first thing filed into an EMPTY
+ * folder has no arrow to appear under, `reveal` opens a level `renderRow` then never renders, and
+ * reloading the page was the only thing that read the row again. The other direction is the same
+ * bug from the other side — the last child moved or archived out leaves an arrow promising a level
+ * that is empty.
+ *
+ * ⚠️ A prefix rather than "the level, plus the level its folder row sits in", because that second
+ * level is not always the one the record names: since #429 a shared row also stands at the root
+ * (`levelsToClear`).
+ *
+ * ⚠️ What it costs is one request per MOUNTED level, and that is not the same as "per level on
+ * screen": `expanded` in `app-tree.tsx` is only ever added to, so a folder that was opened and has
+ * since left the tree — archived, moved away — keeps its query mounted for the rest of the session
+ * and is re-read by every write from then on. Nothing is wrong on screen; the requests are simply
+ * paid for. #521 prunes that list, and until it does, this is the honest bound.
+ *
+ * The same prefix is what `archive.tsx` has always used for the same reason: a row can come back
+ * anywhere, and the screen writing it does not know where.
+ */
+export const allTreeLevelsKey: readonly unknown[] = ["tree"];
+
 /**
  * Which cached levels a move has to take the row out of.
  *
@@ -368,12 +395,11 @@ export function useTreeMove({
       for (const [key, value] of context?.snapshot ?? []) queryClient.setQueryData(key, value);
     },
     onSuccess: (_result, { destination }) => onMoved?.(destination),
-    onSettled: async (_result, _error, { entry, level, destination }) => {
+    onSettled: async (_result, _error, { entry }) => {
       await Promise.all([
-        ...levelsToClear(entry, level).map(
-          async (from) => await queryClient.invalidateQueries({ queryKey: treeLevelKey(from) }),
-        ),
-        queryClient.invalidateQueries({ queryKey: treeLevelKey(destination.id) }),
+        // Both ends of the move and the rows they hang under: a folder that just received its first
+        // row needs its arrow, and one that lost its last has to give it back (#519).
+        queryClient.invalidateQueries({ queryKey: allTreeLevelsKey }),
         queryClient.invalidateQueries({
           queryKey: [entry.type === "flow" ? "flows" : "node-graph"],
         }),

package/src/archive/archive.tsx

@@ -3,6 +3,7 @@ import type { Node } from "@anchrd/intel-contract/node";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { ArchiveRestore, LoaderCircle, Trash2 } from "lucide-react";
 import { useState } from "react";
+import { allTreeLevelsKey } from "@/app/tree-move/tree-move.tsx";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { useI18n } from "@/i18n/i18n-context.tsx";
 import { kindIcons } from "@/kind-icon.ts";
@@ -101,7 +102,7 @@ export function Archive() {
         queryClient.invalidateQueries({ queryKey: ["archive"] }),
         // The tree gets it back, so every level has to be asked again — the entry may sit
         // anywhere, and the archive does not know where.
-        queryClient.invalidateQueries({ queryKey: ["tree"] }),
+        queryClient.invalidateQueries({ queryKey: allTreeLevelsKey }),
         queryClient.invalidateQueries({ queryKey: ["node-graph"] }),
         queryClient.invalidateQueries({ queryKey: ["flows"] }),
       ]);
@@ -126,7 +127,7 @@ export function Archive() {
         queryClient.invalidateQueries({ queryKey: ["archive"] }),
         // The tree and the graph did not show the node, but its DISAPPEARANCE can be visible
         // elsewhere: a reference to it no longer resolves afterwards.
-        queryClient.invalidateQueries({ queryKey: ["tree"] }),
+        queryClient.invalidateQueries({ queryKey: allTreeLevelsKey }),
         queryClient.invalidateQueries({ queryKey: ["node-graph"] }),
         queryClient.invalidateQueries({ queryKey: ["flows"] }),
       ]);

package/src/flows/flows.tsx

@@ -1,6 +1,7 @@
 import type { Flow, FlowGraph, FlowNode } from "@anchrd/intel-contract/flow";
 import { flowNodeLayer } from "@anchrd/intel-contract/flow";
 import type { Node } from "@anchrd/intel-contract/node";
+import { serverOf } from "@anchrd/intel-contract/tool";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useNavigate, useRouterState } from "@tanstack/react-router";
 import {
@@ -285,6 +286,7 @@ function newNode(
   index: number,
   firstNodeId?: string,
   firstFlowId?: string,
+  firstServer?: string,
 ): FlowNode {
   const common = {
     id: `${kind}-${crypto.randomUUID()}`,
@@ -315,10 +317,13 @@ function newNode(
       return {
         ...common,
         kind,
+        // ⚠️ A server, not an empty string. `ToolServerHandle` has a minimum length, so a draft
+        // with `""` cannot be saved at all — the author would build a step and lose it at the next
+        // save with a raw field-path error. The tree link one line up takes the same way out.
         configuration: {
-          toolName: "select-a-tool",
+          server: firstServer ?? "",
+          allow: null,
           fingerprint: null,
-          arguments: {},
         },
       };
     case "condition":
@@ -361,9 +366,27 @@ function FlowsEditor() {
   const theme = useResolvedTheme();
   const queryClient = useQueryClient();
   const navigate = useNavigate();
+  // The servers a tool step can name (#489). The flat function list the picker used to show is
+  // what that ticket set out to remove; which function runs is decided while the flow runs.
+  // ⚠️ The flat function list is NOT what a step is chosen from any more (#489) — it is only what
+  // an author narrows a chosen server WITH. It is asked for regardless of whether a tool step is
+  // selected, because a query that starts when a panel opens shows a spinner inside the panel.
   const tools = useQuery({
     queryKey: ["tools"],
     queryFn: () => data.listTools(),
+    // ⚠️ No retry. This query only ENRICHES the panel — the server is already chosen without it —
+    // and a retry is paused while the tab is unfocused, so a deterministic failure would leave the
+    // function list empty for as long as the reader looks away, with nothing saying why (#212).
+    retry: false,
+  });
+  const toolServers = useQuery({
+    queryKey: ["tool-servers"],
+    queryFn: () => data.listToolServers(),
+    // ⚠️ No retry here either, and for a sharper reason than the list above: the panel shows
+    // NOTHING while this is pending. A deterministic 502 with an unfocused tab pauses the retry,
+    // and the author then sits in front of an empty server field with no sentence saying why —
+    // which is #212 exactly. `error` is a state this panel can speak; `pending` is not.
+    retry: false,
   });
   // A tree link points at a node, so the editor needs candidates. The graph is the authorized
   // flat list of them; walking the folder tree for a picker would be the N+1 all over again.
@@ -414,6 +437,13 @@ function FlowsEditor() {
   // guarantee that the loaded document is both the selected flow and settled.
   const documentReady = selectedFlowId !== null && document.data?.flow.id === selectedFlowId;
   const canMutate = documentReady && !document.isFetching;
+  // ⚠️ A tool step without a server cannot be saved at all — `ToolServerHandle` has a minimum
+  // length. Letting the request go out anyway answers with a generic failure that names no step, so
+  // the author learns "something is wrong" instead of "this one needs a server". The refusal
+  // belongs here, before the write (#517).
+  const stepsMissingServer = nodes.filter(
+    (node) => node.data.node.kind === "tool" && node.data.node.configuration.server === "",
+  );
   useEffect(() => {
     if (!document.data || document.data.flow.id !== selectedFlowId) return;
     const next = canvas(document.data.version?.graph ?? defaultGraph());
@@ -462,6 +492,7 @@ function FlowsEditor() {
           dirty={dirty}
           saving={save.isPending}
           canMutate={canMutate}
+          incomplete={stepsMissingServer.map((node) => ({ label: node.data.node.label }))}
           onSave={() => save.mutate()}
           onPublish={() => setPublishing(true)}
         />
@@ -519,6 +550,7 @@ function FlowsEditor() {
                     nodes.length,
                     nodeGraph.data?.nodes[0]?.id,
                     callable.data?.items.find((entry) => entry.id !== selectedFlowId)?.id,
+                    toolServers.data?.items[0]?.handle,
                   );
                   setNodes((current) => [
                     ...current,
@@ -639,7 +671,19 @@ function FlowsEditor() {
                 <NodeInspector
                   node={selectedNode}
                   update={updateNode}
-                  tools={tools.data?.items ?? []}
+                  toolServers={toolServers.data?.items ?? []}
+                  toolServersState={
+                    toolServers.isPending
+                      ? "pending"
+                      : toolServers.isError
+                        ? "error"
+                        : toolServers.data?.portalConnected === false
+                          ? "disconnected"
+                          : "ready"
+                  }
+                  toolNames={(tools.data?.items ?? []).map((entry) => entry.name)}
+                  toolNamesFailed={tools.isError}
+                  toolNamesPending={tools.isPending}
                   flows={(callable.data?.items ?? []).filter(
                     (entry) => entry.id !== selectedFlowId,
                   )}
@@ -700,6 +744,7 @@ function FlowTitle({
   dirty,
   saving,
   canMutate,
+  incomplete,
   onSave,
   onPublish,
 }: {
@@ -707,6 +752,9 @@ function FlowTitle({
   dirty: boolean;
   saving: boolean;
   canMutate: boolean;
+  // Tool steps that name no server yet. They cannot be saved, so the refusal is shown here rather
+  // than fetched from the server as a message that names no step.
+  incomplete: Array<{ label: string }>;
   onSave(): void;
   onPublish(): void;
 }) {
@@ -733,7 +781,16 @@ function FlowTitle({
           applies EVERYWHERE stands. But it says how THIS flow is shown, and so belongs in the line
           that names this flow. A flow is the only level with runs, and therefore the only one with
           three views (#35). */}
-      <SaveButton dirty={dirty && canMutate} saving={saving} onSave={onSave} />
+      {incomplete.length > 0 && (
+        <p className="mr-2 text-xs text-destructive">
+          {i18n.t("flows.toolStepNeedsServer", { label: incomplete[0]?.label ?? "" })}
+        </p>
+      )}
+      <SaveButton
+        dirty={dirty && canMutate && incomplete.length === 0}
+        saving={saving}
+        onSave={onSave}
+      />
       <TooltipProvider delayDuration={300}>
         <Tooltip>
           <TooltipTrigger asChild>
@@ -797,10 +854,34 @@ function PublishPreview({
       ) : (
         <>
           <p className="text-sm text-muted-foreground">
-            {preview.data.calls.length === 0
+            {preview.data.calls.length === 0 && preview.data.tools.length === 0
               ? i18n.t("flows.publishPreviewEmpty")
               : i18n.t("flows.publishPreviewIntro")}
           </p>
+          {/* ⚠️ The tool surface belongs in the preview because publishing FREEZES it: after this
+              confirmation the step is pinned to these functions and inherits nothing the provider
+              adds later. An author who is not shown it is asked to freeze something unseen (#517). */}
+          {preview.data.tools.length > 0 && (
+            <ul className="mt-4 space-y-2">
+              {preview.data.tools.map((tool) => (
+                <li key={tool.nodeId} className="rounded-md border p-3 text-sm">
+                  <span className="block font-medium">{tool.nodeLabel}</span>
+                  <span className="block text-xs text-muted-foreground">{tool.server}</span>
+                  <span
+                    className={`mt-1 block text-xs ${tool.available ? "text-muted-foreground" : "text-destructive"}`}
+                  >
+                    {!tool.available
+                      ? i18n.t("flows.publishPreviewToolUnavailable")
+                      : tool.allow === null
+                        ? i18n.t("flows.toolAllowAll")
+                        : i18n.t("flows.publishPreviewToolAllow", {
+                            functions: tool.allow.join(", "),
+                          })}
+                  </span>
+                </li>
+              ))}
+            </ul>
+          )}
           <ul className="mt-4 space-y-2">
             {preview.data.calls.map((call) => {
               // ⚠️ One condition for the sentence and its colour. They were two, so a call that
@@ -852,12 +933,30 @@ function PublishPreview({
 function NodeInspector({
   node,
   update,
-  tools,
+  toolServers,
+  toolServersState,
+  toolNames,
+  toolNamesFailed,
+  toolNamesPending,
   flows,
 }: {
   node: CanvasNode | null;
   update(fn: (node: FlowNode) => FlowNode): void;
-  tools: Array<{ name: string; title: string | null; fingerprint: string }>;
+  toolServers: Array<{ handle: string; name: string; toolCount: number }>;
+  // ⚠️ FOUR answers, not two. A list that is still loading is not one that came back empty; a
+  // failure is neither; and a portal this user never connected is not a portal that reaches
+  // nothing. Drawing them all as "no servers" is the mistake #350 records for the tools screen —
+  // and the fourth one is the worst of them: it answers a SIGN-IN problem with a sentence about
+  // reach, in a place that offers no way to sign in.
+  toolServersState: "pending" | "error" | "disconnected" | "ready";
+  toolNames: string[];
+  // Told apart from "this server offers nothing": a function list that could not be loaded must not
+  // read as a narrowing that lost its functions.
+  toolNamesFailed: boolean;
+  // ⚠️ A query that has not answered is not one that answered "nothing". Without this a step opened
+  // while the catalog is still loading shows its allowed functions as missing — the panel accusing
+  // the author of a narrowing that broke, moments before the list arrives.
+  toolNamesPending: boolean;
   flows: Flow[];
 }) {
   const i18n = useI18n();
@@ -946,54 +1045,198 @@ function NodeInspector({
         </div>
       )}
       {contract.kind === "tool" && (
-        <div className="mt-4">
-          <label className="block text-sm font-medium">
-            {i18n.t("flows.tool")}
-            <select
-              value={contract.configuration.toolName}
-              onChange={(event) => {
-                const toolName = event.target.value;
-                update((value) =>
-                  value.kind === "tool"
-                    ? {
-                        ...value,
-                        configuration: {
-                          ...value.configuration,
-                          toolName,
-                          fingerprint:
-                            tools.find((entry) => entry.name === toolName)?.fingerprint ?? null,
-                        },
-                      }
-                    : value,
-                );
-              }}
-              className="mt-2 w-full rounded-md border bg-background px-3 py-2 outline-none focus-visible:ring-2 focus-visible:ring-ring"
-            >
-              <option value="select-a-tool">{i18n.t("flows.selectTool")}</option>
-              {tools.map((entry) => (
-                <option key={entry.name} value={entry.name}>
-                  {entry.title ?? entry.name}
-                </option>
-              ))}
-            </select>
+        <ToolStepFields
+          configuration={contract.configuration}
+          servers={toolServers}
+          state={toolServersState}
+          toolNames={toolNames}
+          toolNamesFailed={toolNamesFailed}
+          toolNamesPending={toolNamesPending}
+          update={update}
+        />
+      )}
+    </div>
+  );
+}
+
+/**
+ * What a tool step may reach: one server, and optionally only some of its functions.
+ *
+ * ⚠️ The server comes first and the functions are a NARROWING, not the other way round (#489). The
+ * old field offered every function of every server in one flat list — 85 entries here, portal
+ * management tools among them — and asked the author to pick the one call they wanted before they
+ * knew what the step would say. Which function runs is a run-time answer; which server may be
+ * reached is an authoring decision, and that is the one this asks for.
+ */
+export function ToolStepFields({
+  configuration,
+  servers,
+  state,
+  toolNames,
+  toolNamesFailed,
+  toolNamesPending,
+  update,
+}: {
+  configuration: { server: string; allow: string[] | null; fingerprint: string | null };
+  servers: Array<{ handle: string; name: string; toolCount: number }>;
+  state: "pending" | "error" | "disconnected" | "ready";
+  toolNames: string[];
+  toolNamesFailed: boolean;
+  toolNamesPending: boolean;
+  update(fn: (node: FlowNode) => FlowNode): void;
+}) {
+  const i18n = useI18n();
+  // ⚠️ The group's identity, not its data. Two steps on one screen with the same server would
+  // otherwise share one radio group and unset each other — and the component is exported now, so
+  // that invariant no longer lives in the file that guarantees it.
+  const groupId = useId();
+  const hintId = `${groupId}-hint`;
+  // The one sentence this field has to say, or none. Derived once so the control and the paragraph
+  // cannot disagree about whether there is something to point at.
+  const hint =
+    state === "error"
+      ? ({ key: "flows.toolServersFailed", tone: "bad" } as const)
+      : state === "disconnected"
+        ? ({ key: "flows.toolServersDisconnected", tone: "bad" } as const)
+        : state === "ready" && servers.length === 0
+          ? ({ key: "flows.toolServersEmpty", tone: "plain" } as const)
+          : null;
+  const ownFunctions = toolNames.filter(
+    (name) => configuration.server !== "" && serverOf(name, [configuration.server]) !== null,
+  );
+  // ⚠️ An allowed function the catalog does not carry is DRAWN, not dropped. Rendering only what
+  // the catalog knows would let the panel and the saved graph disagree in silence: the author reads
+  // "narrowed to nothing" while the step still names something. The API treats the same condition
+  // as serious enough to refuse a publish, so the editor may not swallow it.
+  // Nothing is "missing" until the catalog has actually answered.
+  const missing = toolNamesPending
+    ? []
+    : (configuration.allow ?? []).filter((name) => !ownFunctions.includes(name));
+  const functions = [...ownFunctions, ...missing];
+
+  function setTool(
+    change: (current: { server: string; allow: string[] | null; fingerprint: string | null }) => {
+      server: string;
+      allow: string[] | null;
+      fingerprint: string | null;
+    },
+  ) {
+    update((value) =>
+      value.kind === "tool" ? { ...value, configuration: change(value.configuration) } : value,
+    );
+  }
+
+  return (
+    <div className="mt-4 space-y-3">
+      <label className="block text-sm font-medium">
+        {i18n.t("flows.tool")}
+        <select
+          value={configuration.server}
+          // ⚠️ A disabled control drops out of the tab order, so the reason has to be ANNOUNCED
+          // rather than merely printed beside it. It points at the hint only when the hint is
+          // actually rendered — `pending` prints nothing on purpose, and a reference to an id that
+          // does not exist is worse than none: a screen reader reads it as a broken relation.
+          aria-describedby={hint === null ? undefined : hintId}
+          disabled={state !== "ready" || servers.length === 0}
+          onChange={(event) => {
+            // ⚠️ Read out of the event NOW, not inside the updater. The updater runs later, and by
+            // then this controlled select has been set back to the state's value — the change would
+            // apply to itself and nothing would move.
+            const server = event.target.value;
+            // Changing the server drops the narrowing AND the frozen surface. Keeping `allow` would
+            // leave functions of the old server behind — the contract refuses that outright — and
+            // keeping the fingerprint would claim a surface nobody has confirmed.
+            setTool(() => ({ server, allow: null, fingerprint: null }));
+          }}
+          className="mt-2 w-full rounded-md border bg-background px-3 py-2 outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-50"
+        >
+          <option value="">{i18n.t("flows.selectTool")}</option>
+          {servers.map((entry) => (
+            <option key={entry.handle} value={entry.handle}>
+              {entry.name}
+            </option>
+          ))}
+        </select>
+      </label>
+      {/* The three states of the list, told apart. Silence while loading; a reason when it failed;
+          and "you reach none" only once that is actually known. */}
+      {hint !== null && (
+        <p
+          id={hintId}
+          className={`text-xs ${hint.tone === "bad" ? "text-destructive" : "text-muted-foreground"}`}
+        >
+          {i18n.t(hint.key)}
+        </p>
+      )}
+      {configuration.server !== "" && (
+        <fieldset className="space-y-2">
+          <legend className="text-sm font-medium">{i18n.t("flows.toolFunctions")}</legend>
+          <label className="flex items-center gap-2 text-sm">
+            <input
+              type="radio"
+              name={groupId}
+              checked={configuration.allow === null}
+              onChange={() =>
+                setTool((current) => ({ ...current, allow: null, fingerprint: null }))
+              }
+              className="size-4"
+            />
+            {i18n.t("flows.toolAllowAll")}
           </label>
-          <ToolArgumentsEditor
-            key={contract.id}
-            label={i18n.t("tools.arguments")}
-            invalidLabel={i18n.t("tools.invalidJson")}
-            initialValue={contract.configuration.arguments}
-            onValid={(argumentsValue) => {
-              update((value) =>
-                value.kind === "tool"
-                  ? {
-                      ...value,
-                      configuration: { ...value.configuration, arguments: argumentsValue },
-                    }
-                  : value,
-              );
-            }}
-          />
-        </div>
+          <label className="flex items-center gap-2 text-sm">
+            <input
+              type="radio"
+              name={groupId}
+              checked={configuration.allow !== null}
+              onChange={() => setTool((current) => ({ ...current, allow: [], fingerprint: null }))}
+              className="size-4"
+            />
+            {i18n.t("flows.toolAllowSome")}
+          </label>
+          {configuration.allow !== null && (
+            <ul className="max-h-48 space-y-1 overflow-y-auto pl-6">
+              {functions.map((name) => (
+                <li key={name}>
+                  <label className="flex items-center gap-2 text-sm">
+                    <input
+                      type="checkbox"
+                      checked={configuration.allow?.includes(name) ?? false}
+                      onChange={(event) => {
+                        // Same reason as the select above: the checked flag is read now, the
+                        // updater runs later.
+                        const add = event.target.checked;
+                        setTool((current) => ({
+                          ...current,
+                          allow: add
+                            ? [...(current.allow ?? []), name]
+                            : (current.allow ?? []).filter((entry) => entry !== name),
+                          fingerprint: null,
+                        }));
+                      }}
+                      className="size-4"
+                    />
+                    <span className="min-w-0 truncate">{name}</span>
+                  </label>
+                </li>
+              ))}
+            </ul>
+          )}
+          {/* Two sentences that only appear when they are true, and neither is the generic hint:
+              a narrowing to nothing cannot be published, and a name the catalog does not carry is
+              something the author has to see rather than lose. */}
+          {configuration.allow?.length === 0 && (
+            <p className="text-xs text-destructive">{i18n.t("flows.toolAllowNone")}</p>
+          )}
+          {toolNamesFailed && (
+            <p className="text-xs text-destructive">{i18n.t("flows.toolFunctionsFailed")}</p>
+          )}
+          {!toolNamesFailed && missing.length > 0 && (
+            <p className="text-xs text-destructive">
+              {i18n.t("flows.toolAllowUnknown", { count: missing.length })}
+            </p>
+          )}
+          <p className="text-xs text-muted-foreground">{i18n.t("flows.toolAllowHint")}</p>
+        </fieldset>
       )}
     </div>
   );
@@ -1015,7 +1258,7 @@ function FlowNeeds({ flowId }: { flowId: string }) {
     needs.data !== undefined &&
     needs.data.nodes.length === 0 &&
     needs.data.hiddenNodes === 0 &&
-    needs.data.tools.length === 0;
+    needs.data.servers.length === 0;
   return (
     <section aria-label={i18n.t("flows.needs")} className="mt-auto border-t p-5">
       <h2 className="font-semibold">{i18n.t("flows.needs")}</h2>
@@ -1052,13 +1295,13 @@ function FlowNeeds({ flowId }: { flowId: string }) {
               </ul>
             </>
           )}
-          {needs.data.tools.length > 0 && (
+          {needs.data.servers.length > 0 && (
             <>
               <h3 className="mt-4 text-xs font-medium uppercase tracking-wide text-muted-foreground">
                 {i18n.t("flows.needsTools")}
               </h3>
               <ul className="mt-2 space-y-1 text-sm">
-                {needs.data.tools.map((name) => (
+                {needs.data.servers.map((name) => (
                   <li key={name} className="flex items-center gap-2">
                     <Wrench aria-hidden="true" className="size-3.5 shrink-0" />
                     <span className="min-w-0 truncate">{name}</span>
@@ -1067,7 +1310,6 @@ function FlowNeeds({ flowId }: { flowId: string }) {
               </ul>
             </>
           )}
-          <p className="mt-4 text-xs text-muted-foreground">{i18n.t("flows.needsHint")}</p>
         </>
       )}
     </section>
@@ -1118,47 +1360,6 @@ function SubflowVersionField({
   );
 }
 
-function ToolArgumentsEditor({
-  label,
-  invalidLabel,
-  initialValue,
-  onValid,
-}: {
-  label: string;
-  invalidLabel: string;
-  initialValue: Record<string, unknown>;
-  onValid(value: Record<string, unknown>): void;
-}) {
-  const [text, setText] = useState(() => JSON.stringify(initialValue, null, 2));
-  const [invalid, setInvalid] = useState(false);
-  return (
-    <label className="mt-4 block text-sm font-medium">
-      {label}
-      <textarea
-        rows={6}
-        value={text}
-        onChange={(event) => {
-          const next = event.target.value;
-          setText(next);
-          try {
-            const parsed: unknown = JSON.parse(next);
-            if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) {
-              setInvalid(true);
-              return;
-            }
-            setInvalid(false);
-            onValid(parsed as Record<string, unknown>);
-          } catch {
-            setInvalid(true);
-          }
-        }}
-        className="mt-2 w-full resize-y rounded-md border bg-background px-3 py-2 font-mono text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring"
-      />
-      {invalid && <span className="mt-1 block text-xs text-destructive">{invalidLabel}</span>}
-    </label>
-  );
-}
-
 function Field({
   label,
   value,

package/src/folder-contents/folder-contents.tsx

@@ -34,8 +34,8 @@ function targetOf(entry: TreeEntry): ResourceTarget {
  * fetch separately show it differently the moment one of them is stale, and that is the kind of
  * difference a customer finds before anybody here does. The other half of the bargain is free —
  * every invalidation the tree already does after a create, a move or an archive lands here too, and
- * that now includes the ones this screen's own menu makes: `ResourceMenu` invalidates
- * `["tree", parentId]`, which is this level.
+ * that now includes the ones this screen's own menu makes: since #519 they all refresh every tree
+ * level (`allTreeLevelsKey`), and this level is one of them.
  *
  * ⚠️ There is no "Kind" column since #101. The icon says what a row is, in the same picture the
  * sidebar draws two centimetres to its left, and `sr-only` says it in words for everyone who does

package/src/i18n/de.json

@@ -97,7 +97,7 @@
   "archive.restoreFailed": "Es wurde nicht wiederhergestellt. Vielleicht hat jemand anderes es geändert — lade neu und versuche es erneut.",
   "archive.purge": "{title} endgültig löschen",
   "archive.purge.title": "Endgültig löschen?",
-  "archive.purge.body": "„{title}\u201c und alles, was dazugehört — jede Version, der Inhalt und die Einträge im Suchindex — ist danach weg. Das lässt sich nicht rückgängig machen.",
+  "archive.purge.body": "„{title}“ und alles, was dazugehört — jede Version, der Inhalt und die Einträge im Suchindex — ist danach weg. Das lässt sich nicht rückgängig machen.",
   "archive.purge.links.none": "Keine anderen Dokumente verweisen darauf.",
   "archive.purge.links.one": "Ein anderes Dokument verweist darauf; dieser Verweis wird brechen.",
   "archive.purge.links.many": "{count} andere Dokumente verweisen darauf; diese Verweise werden brechen.",
@@ -215,8 +215,6 @@
   "tools.toolCount": "{count} Werkzeuge",
   "tools.toolCountOne": "1 Werkzeug",
   "tools.liveNote": "Diese Liste ist eine Live-Abfrage mit deinem eigenen Portal-Zugriff. Intel speichert weder die Werkzeuge noch, wer sie nutzen darf; beides entscheidet das Portal.",
-  "tools.arguments": "Argumente",
-  "tools.invalidJson": "Die Argumente müssen ein JSON-Objekt in geschweiften Klammern sein; eine Liste oder ein einzelner Wert funktioniert nicht.",
   "flows.select": "Wähle einen Flow oder lege einen an, um den visuellen Editor zu öffnen.",
   "flows.inspect": "Wähle einen Schritt, um seine Konfiguration zu bearbeiten.",
   "flows.publish": "Veröffentlichen",
@@ -277,11 +275,10 @@
   "flows.publishPreviewUnavailable": "Der aufgerufene Flow hat noch nichts veröffentlicht, das lässt sich nicht einfrieren.",
   "flows.publishConfirm": "Veröffentlichen",
   "flows.publishFailed": "Das Veröffentlichen ist fehlgeschlagen. Lade die neueste Fassung und versuche es erneut.",
-  "flows.tool": "MCP-Werkzeug",
-  "flows.selectTool": "Wähle ein gefundenes Werkzeug",
+  "flows.tool": "MCP-Server",
+  "flows.selectTool": "Server auswählen",
   "flows.operationFailed": "Der Flow-Vorgang ist fehlgeschlagen. Lade die neueste Fassung und versuche es erneut.",
   "flows.needs": "Was dieser Flow braucht",
-  "flows.needsHint": "Aus dem Graphen gelesen. Ob eine bestimmte Person davon etwas erreicht, entscheidet sich, wenn sie ihn ausführt.",
   "flows.needsNodes": "Dokumente",
   "flows.needsTools": "Werkzeuge",
   "flows.needsHidden": "{count} weitere, die du nicht sehen kannst",
@@ -354,5 +351,18 @@
   "common.noAccess": "Das ist für dich nicht verfügbar. Es existiert nicht, oder es ist nicht mehr für dich freigegeben.",
   "common.noPermission": "Dir fehlt die Berechtigung, das zu sehen.",
   "title.descriptionMore": "Mehr",
-  "title.descriptionLess": "Weniger"
+  "title.descriptionLess": "Weniger",
+  "flows.toolServersEmpty": "Über das Portal erreichst du noch keinen MCP-Server.",
+  "flows.toolServersFailed": "Die Serverliste ließ sich nicht laden, daher lässt sich gerade keiner auswählen.",
+  "flows.toolAllowAll": "Der Agent darf jede Funktion nutzen",
+  "flows.toolAllowSome": "Den Agenten auf bestimmte Funktionen hinweisen",
+  "flows.toolAllowHint": "Intel sagt, wofür ein Schritt da ist; der Agent wählt den Aufruf und erreicht das Portal mit seinen eigenen Rechten.",
+  "flows.toolFunctions": "Funktionen",
+  "flows.toolServersDisconnected": "Du bist nicht mit dem Portal verbunden, daher lässt sich kein Server wählen. Verbinde es zuerst in den Werkzeug-Einstellungen.",
+  "flows.toolAllowNone": "Es ist noch keine Funktion ausgewählt, daher lässt sich dieser Schritt nicht veröffentlichen.",
+  "flows.toolAllowUnknown": "{count} ausgewählte Funktion(en) bietet dieser Server gerade nicht an.",
+  "flows.toolStepNeedsServer": "Dem Schritt „{label}“ fehlt noch ein Server.",
+  "flows.toolFunctionsFailed": "Die Funktionsliste ließ sich nicht laden, daher ist die Auswahl möglicherweise unvollständig.",
+  "flows.publishPreviewToolUnavailable": "Diesen Server erreichst du nicht, daher wird das Veröffentlichen abgelehnt.",
+  "flows.publishPreviewToolAllow": "Eingefroren auf: {functions}"
 }

package/src/i18n/en.json

@@ -215,8 +215,6 @@
   "tools.toolCount": "{count} tools",
   "tools.toolCountOne": "1 tool",
   "tools.liveNote": "This list is a live query with your own portal access. Intel stores neither the tools nor who may use them; the portal decides both.",
-  "tools.arguments": "Arguments",
-  "tools.invalidJson": "The arguments must be a JSON object in curly braces; a list or a single value will not work.",
   "flows.select": "Select a flow or create one to open the visual editor.",
   "flows.inspect": "Select a node to edit its configuration.",
   "flows.publish": "Publish",
@@ -277,11 +275,10 @@
   "flows.publishPreviewUnavailable": "The called flow has published nothing yet, so this cannot be frozen.",
   "flows.publishConfirm": "Publish",
   "flows.publishFailed": "Publishing failed. Reload the latest version and try again.",
-  "flows.tool": "MCP tool",
-  "flows.selectTool": "Select a discovered tool",
+  "flows.tool": "MCP server",
+  "flows.selectTool": "Select a server",
   "flows.operationFailed": "The flow operation failed. Reload the latest version and try again.",
   "flows.needs": "What this flow needs",
-  "flows.needsHint": "Read out of the graph. Whether a given person may reach any of it is decided when they run it.",
   "flows.needsNodes": "Documents",
   "flows.needsTools": "Tools",
   "flows.needsHidden": "{count} more you cannot see",
@@ -354,5 +351,18 @@
   "common.noAccess": "This is not available to you. It may not exist, or it may no longer be shared with you.",
   "common.noPermission": "You do not have permission to see this.",
   "title.descriptionMore": "More",
-  "title.descriptionLess": "Less"
+  "title.descriptionLess": "Less",
+  "flows.toolServersEmpty": "You reach no MCP server through the portal yet.",
+  "flows.toolServersFailed": "The list of servers could not be loaded, so none can be chosen right now.",
+  "flows.toolAllowAll": "Let the agent use any function",
+  "flows.toolAllowSome": "Point the agent at specific functions",
+  "flows.toolAllowHint": "Intel says what a step is for; the agent chooses the call and reaches the portal with its own permissions.",
+  "flows.toolFunctions": "Functions",
+  "flows.toolServersDisconnected": "You are not connected to the portal, so no server can be chosen. Connect it in the tool settings first.",
+  "flows.toolAllowNone": "No function is selected yet, so this step cannot be published.",
+  "flows.toolAllowUnknown": "{count} selected function(s) are not offered by this server right now.",
+  "flows.toolStepNeedsServer": "The step “{label}” still needs a server.",
+  "flows.toolFunctionsFailed": "The list of functions could not be loaded, so the selection may be incomplete.",
+  "flows.publishPreviewToolUnavailable": "You do not reach this server, so publishing will be refused.",
+  "flows.publishPreviewToolAllow": "Frozen to: {functions}"
 }

package/src/i18n/es.json

@@ -215,8 +215,6 @@
   "tools.toolCount": "{count} herramientas",
   "tools.toolCountOne": "1 herramienta",
   "tools.liveNote": "Esta lista es una consulta en vivo con tu propio acceso al portal. Intel no guarda ni las herramientas ni quién puede usarlas; ambas cosas las decide el portal.",
-  "tools.arguments": "Argumentos",
-  "tools.invalidJson": "Los argumentos tienen que ser un objeto JSON entre llaves; una lista o un valor suelto no sirven.",
   "flows.select": "Elige un flujo o crea uno para abrir el editor visual.",
   "flows.inspect": "Elige un paso para editar su configuración.",
   "flows.publish": "Publicar",
@@ -277,11 +275,10 @@
   "flows.publishPreviewUnavailable": "El flujo llamado todavía no ha publicado nada, así que esto no se puede congelar.",
   "flows.publishConfirm": "Publicar",
   "flows.publishFailed": "La publicación ha fallado. Carga la versión más reciente e inténtalo de nuevo.",
-  "flows.tool": "Herramienta MCP",
-  "flows.selectTool": "Elige una herramienta descubierta",
+  "flows.tool": "Servidor MCP",
+  "flows.selectTool": "Elegir un servidor",
   "flows.operationFailed": "La operación del flujo ha fallado. Carga la versión más reciente e inténtalo de nuevo.",
   "flows.needs": "Qué necesita este flujo",
-  "flows.needsHint": "Leído del grafo. Si una persona concreta llega a algo de esto se decide cuando lo ejecuta.",
   "flows.needsNodes": "Documentos",
   "flows.needsTools": "Herramientas",
   "flows.needsHidden": "{count} más que no puedes ver",
@@ -354,5 +351,18 @@
   "common.noAccess": "Esto no está disponible para ti. Puede que no exista o que ya no esté compartido contigo.",
   "common.noPermission": "No tienes permiso para ver esto.",
   "title.descriptionMore": "Más",
-  "title.descriptionLess": "Menos"
+  "title.descriptionLess": "Menos",
+  "flows.toolServersEmpty": "Todavía no alcanzas ningún servidor MCP a través del portal.",
+  "flows.toolServersFailed": "No se pudo cargar la lista de servidores, así que ahora no se puede elegir ninguno.",
+  "flows.toolAllowAll": "El agente puede usar cualquier función",
+  "flows.toolAllowSome": "Indicar al agente funciones concretas",
+  "flows.toolAllowHint": "Intel dice para qué sirve un paso; el agente elige la llamada y accede al portal con sus propios permisos.",
+  "flows.toolFunctions": "Funciones",
+  "flows.toolServersDisconnected": "No estás conectado al portal, así que no se puede elegir ningún servidor. Conéctalo primero en la configuración de herramientas.",
+  "flows.toolAllowNone": "Todavía no hay ninguna función seleccionada, así que este paso no se puede publicar.",
+  "flows.toolAllowUnknown": "Este servidor no ofrece ahora mismo {count} función(es) seleccionada(s).",
+  "flows.toolStepNeedsServer": "Al paso «{label}» todavía le falta un servidor.",
+  "flows.toolFunctionsFailed": "No se pudo cargar la lista de funciones, así que la selección puede estar incompleta.",
+  "flows.publishPreviewToolUnavailable": "No alcanzas este servidor, así que la publicación será rechazada.",
+  "flows.publishPreviewToolAllow": "Congelado en: {functions}"
 }

package/src/import-bundle/import-bundle.tsx

@@ -2,7 +2,7 @@ import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { zipSync } from "fflate";
 import { useRef, useState } from "react";
 import { createPortal } from "react-dom";
-import { treeLevelKey } from "@/app/tree-move/tree-move.tsx";
+import { allTreeLevelsKey } from "@/app/tree-move/tree-move.tsx";
 import { useI18n } from "@/i18n/i18n-context.tsx";
 import { useIntelRouterContext } from "@/router/router-context.ts";
 
@@ -93,7 +93,10 @@ export function useBundleImport(options: {
     onSuccess: async (imported) => {
       await options.onImported?.(imported.parentId);
       await Promise.all([
-        queryClient.invalidateQueries({ queryKey: treeLevelKey(imported.parentId) }),
+        // ⚠️ Every level, not the one imported into: the target folder's own row carries whether it
+        // can be opened, and it stands one level higher (#519). An import into an empty folder was
+        // otherwise unreachable in the tree until the page was reloaded.
+        queryClient.invalidateQueries({ queryKey: allTreeLevelsKey }),
         queryClient.invalidateQueries({ queryKey: ["node-graph"] }),
         // The graph view of that same level draws exactly this list (#19).
         queryClient.invalidateQueries({ queryKey: ["relation-graph"] }),

package/src/resource-menu/resource-menu.tsx

@@ -20,7 +20,7 @@ import {
 import type * as React from "react";
 import { useState } from "react";
 import { AccessSummary } from "@/access-summary/access-summary.tsx";
-import { moveErrorKey, useTreeMove } from "@/app/tree-move/tree-move.tsx";
+import { allTreeLevelsKey, moveErrorKey, useTreeMove } from "@/app/tree-move/tree-move.tsx";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -80,10 +80,6 @@ function titleOf(target: ResourceTarget): string {
   return target.type === "node" ? target.node.title : target.flow.title;
 }
 
-function parentOfTarget(target: ResourceTarget): string | null {
-  return target.type === "node" ? target.node.parentId : target.flow.parentId;
-}
-
 /**
  * Which sentence explains a verb.
  *
@@ -175,9 +171,14 @@ export function ResourceMenu({
   // reads the record, and the flat collections behind the search, the link picker and the relation
   // view all carry the title as well — a rename that only reached the tree would leave yesterday's
   // name standing on three other screens.
+  //
+  // ⚠️ Every level rather than the one this row sits in: archiving the last row of a folder takes
+  // that folder's arrow away, and the arrow is drawn from the folder's own row one level higher
+  // (`allTreeLevelsKey`, #519). Renaming needs no more than the one level — but two invalidations
+  // that differ per entry are how one of them goes missing.
   async function refresh(): Promise<void> {
     await Promise.all([
-      queryClient.invalidateQueries({ queryKey: ["tree", parentOfTarget(target)] }),
+      queryClient.invalidateQueries({ queryKey: allTreeLevelsKey }),
       queryClient.invalidateQueries({
         queryKey: target.type === "flow" ? ["flow", id] : ["node", id],
       }),