@anchrd/intel-ui 0.8.8 → 0.9.1

package/src/entry-picker/entry-picker.tsx

@@ -1,15 +1,21 @@
-import type { KnowledgeNode, KnowledgeNodeKind } from "@anchrd/intel-contract";
+import type { NodeKind } from "@anchrd/intel-contract";
 import { useQuery } from "@tanstack/react-query";
 import { ChevronRight, Folder, Search } from "lucide-react";
 import { useMemo, useState } from "react";
 import { useIntelRouterContext } from "@/router/router-context.ts";
 
+// What this picker offers, whichever side of the shared tree it came from. Deliberately the four
+// fields a picker needs and not the whole record: a Node and a Flow are two different things
+// (ADR-0004), and merging them into one row is only allowed where the row is the entire question.
+export type PickerEntry = { id: string; title: string; parentId: string | null; kind: PickerKind };
+export type PickerKind = NodeKind | "flow";
+
 /**
- * One picker for everything a node can name: search by name, or click down through the tree from
- * the top-level folders.
+ * One picker for everything a node or a flow can name: search by name, or click down through the
+ * tree from the top-level folders.
  *
  * ⚠️ Both halves read ONE source — the authorized flat graph the editor already loads. Not because
- * a search endpoint would be hard, but because `searchKnowledge` answers a different question: it
+ * a search endpoint would be hard, but because `searchNodes` answers a different question: it
  * searches PASSAGES and hands back citations. Someone looking for a document by name would get
  * results ranked by what is written inside it, which is the wrong list in a picker. Filtering names
  * here is also instant, and it cannot disagree with the tree about what exists.
@@ -19,29 +25,59 @@ import { useIntelRouterContext } from "@/router/router-context.ts";
  */
 export function EntryPicker({
   kind,
+  flows = false,
   value,
   onSelect,
   label,
 }: {
   // Which kind of node may be chosen. `null` offers every kind — what the Flow step uses.
-  kind: KnowledgeNodeKind | null;
+  kind: NodeKind | null;
+  // ⚠️ Flows are a second list, not a kind of node, so they are asked for rather than assumed. An
+  // agent's schedule may aim at either (#143); every other caller wants nodes only and pays for no
+  // second request.
+  flows?: boolean;
   value: string;
-  onSelect(nodeId: string): void;
+  onSelect(entryId: string, entryKind: PickerKind): void;
   label: string;
 }) {
   const { data, i18n } = useIntelRouterContext();
   const [query, setQuery] = useState("");
   const [openFolder, setOpenFolder] = useState<string | null>(null);
   const graph = useQuery({
-    queryKey: ["knowledge-graph"],
-    queryFn: () => data.getKnowledgeGraph(),
+    queryKey: ["node-graph"],
+    queryFn: () => data.getNodeGraph(),
+  });
+  const flowList = useQuery({
+    queryKey: ["flows"],
+    queryFn: () => data.listFlows(),
+    enabled: flows,
   });
 
-  const nodes = useMemo(() => graph.data?.nodes ?? [], [graph.data]);
-  const eligible = useMemo(
-    () => nodes.filter((node) => kind === null || node.kind === kind),
-    [nodes, kind],
+  const nodes = useMemo<PickerEntry[]>(() => {
+    const fromNodes = (graph.data?.nodes ?? []).map((node) => ({
+      id: node.id,
+      title: node.title,
+      parentId: node.parentId,
+      kind: node.kind as PickerKind,
+    }));
+    if (!flows) return fromNodes;
+    return [
+      ...fromNodes,
+      ...(flowList.data?.items ?? []).map((flow) => ({
+        id: flow.id,
+        title: flow.title,
+        parentId: flow.parentId,
+        kind: "flow" as const,
+      })),
+    ];
+  }, [graph.data, flowList.data, flows]);
+  // A flow is offered exactly when it was asked for — it is only in `nodes` at all in that case,
+  // and saying so here keeps "may this be picked" one rule rather than two that must agree.
+  const pickable = useMemo(
+    () => (entry: PickerEntry) => entry.kind === "flow" || kind === null || entry.kind === kind,
+    [kind],
   );
+  const eligible = useMemo(() => nodes.filter(pickable), [nodes, pickable]);
 
   // Searching looks at every eligible node wherever it sits; browsing looks at one level. The two
   // are the same list seen two ways, which is why a result can be picked from either.
@@ -56,7 +92,7 @@ export function EntryPicker({
 
   // The way back up, as the chain of folders that leads to the open one.
   const trail = useMemo(() => {
-    const chain: KnowledgeNode[] = [];
+    const chain: PickerEntry[] = [];
     let current = openFolder;
     while (current !== null) {
       const folder = nodes.find((node) => node.id === current);
@@ -123,20 +159,20 @@ export function EntryPicker({
             // is being picked — something to choose. It gets both, side by side, rather than one
             // control that has to guess which was meant.
             const canOpen = node.kind === "folder" && !searching;
-            const canPick = kind === null || node.kind === kind;
+            const canPick = pickable(node);
             return (
-              <li key={node.id} className="flex items-center gap-1 px-1">
+              <li key={`${node.kind}:${node.id}`} className="flex items-center gap-1 px-1">
                 {canPick ? (
                   <button
                     type="button"
-                    onClick={() => onSelect(node.id)}
+                    onClick={() => onSelect(node.id, node.kind)}
                     aria-current={node.id === value}
                     className={`min-w-0 flex-1 truncate rounded px-2 py-1.5 text-left text-sm outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring ${
                       node.id === value ? "bg-muted font-medium" : ""
                     }`}
                   >
                     {node.title}
-                    <span className="sr-only"> — {i18n.t(`knowledge.kind.${node.kind}`)}</span>
+                    <span className="sr-only"> — {i18n.t(`node.kind.${node.kind}`)}</span>
                   </button>
                 ) : (
                   <span className="min-w-0 flex-1 truncate px-2 py-1.5 text-sm text-muted-foreground">

package/src/flow-runs/flow-runs.tsx

@@ -24,7 +24,7 @@ function formatDuration(ms: number, i18n: I18n): string {
  * already built rather than opening somewhere new.
  *
  * ⚠️ What it shows is what a run *did*. Neither the input a run was given nor the result it
- * produced is in the answer it reads, because a run reaches Knowledge and tools with the rights of
+ * produced is in the answer it reads, because a run reaches nodes and tools with the rights of
  * whoever started it — and the person reading this list is not necessarily that person.
  */
 export function FlowRuns({ flowId }: { flowId: string }) {

package/src/flows/flows.tsx

@@ -1,4 +1,4 @@
-import type { Flow, FlowGraph, FlowNode, KnowledgeNode } from "@anchrd/intel-contract";
+import type { Flow, FlowGraph, FlowNode, Node } from "@anchrd/intel-contract";
 import { flowNodeLayer } from "@anchrd/intel-contract";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useNavigate, useRouterState } from "@tanstack/react-router";
@@ -13,11 +13,11 @@ import {
   type EdgeChange,
   Handle,
   MiniMap,
-  type Node,
   type NodeChange,
   type NodeProps,
   Position,
   ReactFlow,
+  type Node as ReactFlowNode,
   ReactFlowProvider,
   useReactFlow,
 } from "@xyflow/react";
@@ -39,7 +39,7 @@ import { SaveButton, UnsavedChangesGuard } from "@/save-button/save-button.tsx";
 import { useSystemTheme } from "@/theme/theme.ts";
 import { TitleRow } from "@/title-row/title-row.tsx";
 
-type CanvasNode = Node<{ node: FlowNode }, "intel">;
+type CanvasNode = ReactFlowNode<{ node: FlowNode }, "intel">;
 type CanvasEdge = Edge;
 
 // One handle id at both ends of a context edge. React Flow reports the handles a connection was
@@ -269,7 +269,7 @@ const nodeKindOfLink = Object.fromEntries(
   Object.entries(flowKindOfEntry)
     .filter(([, kind]) => kind !== undefined && kind !== "subflow")
     .map(([nodeKind, kind]) => [kind, nodeKind]),
-) as Partial<Record<FlowNode["kind"], KnowledgeNode["kind"]>>;
+) as Partial<Record<FlowNode["kind"], Node["kind"]>>;
 
 type LinkNode = Extract<FlowNode, { configuration: { resourceId: string } }>;
 
@@ -282,7 +282,7 @@ function isLinkNode(node: FlowNode): node is LinkNode {
 function newNode(
   kind: FlowNode["kind"],
   index: number,
-  firstKnowledgeId?: string,
+  firstNodeId?: string,
   firstFlowId?: string,
 ): FlowNode {
   const common = {
@@ -309,7 +309,7 @@ function newNode(
     case "document":
     case "upload":
     case "table":
-      return { ...common, kind, configuration: { resourceId: firstKnowledgeId ?? "" } };
+      return { ...common, kind, configuration: { resourceId: firstNodeId ?? "" } };
     case "tool":
       return {
         ...common,
@@ -363,11 +363,11 @@ function FlowsEditor() {
     queryKey: ["tools"],
     queryFn: () => data.listTools(),
   });
-  // A knowledge step points at nodes, so the editor needs candidates. The graph is the authorized
+  // 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.
-  const knowledge = useQuery({
-    queryKey: ["knowledge-graph"],
-    queryFn: () => data.getKnowledgeGraph(),
+  const nodeGraph = useQuery({
+    queryKey: ["node-graph"],
+    queryFn: () => data.getNodeGraph(),
   });
   // The candidates for a subflow step. Which of them a flow may actually call is answered when it is
   // published (ADR-0004 §3) — the picker offers what the user may see, and the refusal names the
@@ -396,7 +396,7 @@ function FlowsEditor() {
   // Lifted out of the bar because the canvas dismisses it too — a click on the pane is the third way
   // out, next to the trigger and Escape.
   const [paletteOpen, setPaletteOpen] = usePaletteOpen();
-  // A flow is shared through the folder it is filed in, on the Knowledge screen (ADR-0004 §2). It
+  // A flow is shared through the folder it is filed in, on the Intelligence screen (ADR-0004 §2). It
   // has no share action of its own — a narrower grant beside the folder's would break the guarantee
   // that a flow only reaches flows in its own subtree.
   const document = useQuery({
@@ -483,7 +483,7 @@ function FlowsEditor() {
             query={relations}
             select={(node) =>
               void navigate({
-                to: node.kind === "flow" ? "/flows" : "/knowledge",
+                to: node.kind === "flow" ? "/flows" : "/nodes",
                 search: { select: node.id },
               })
             }
@@ -525,7 +525,7 @@ function FlowsEditor() {
                   const item = newNode(
                     kind,
                     nodes.length,
-                    knowledge.data?.nodes[0]?.id,
+                    nodeGraph.data?.nodes[0]?.id,
                     callable.data?.items.find((entry) => entry.id !== selectedFlowId)?.id,
                   );
                   setNodes((current) => [
@@ -1010,8 +1010,8 @@ function FlowNeeds({ flowId }: { flowId: string }) {
   // answers, so the counted ones keep the panel from claiming the first when it means the second.
   const empty =
     needs.data !== undefined &&
-    needs.data.knowledge.length === 0 &&
-    needs.data.hiddenKnowledge === 0 &&
+    needs.data.nodes.length === 0 &&
+    needs.data.hiddenNodes === 0 &&
     needs.data.tools.length === 0;
   return (
     <section aria-label={i18n.t("flows.needs")} className="mt-auto border-t p-5">
@@ -1027,13 +1027,13 @@ function FlowNeeds({ flowId }: { flowId: string }) {
       {empty && <p className="mt-2 text-sm text-muted-foreground">{i18n.t("flows.needsEmpty")}</p>}
       {needs.data && !empty && (
         <>
-          {(needs.data.knowledge.length > 0 || needs.data.hiddenKnowledge > 0) && (
+          {(needs.data.nodes.length > 0 || needs.data.hiddenNodes > 0) && (
             <>
               <h3 className="mt-4 text-xs font-medium uppercase tracking-wide text-muted-foreground">
-                {i18n.t("flows.needsKnowledge")}
+                {i18n.t("flows.needsNodes")}
               </h3>
               <ul className="mt-2 space-y-1 text-sm">
-                {needs.data.knowledge.map((reference) => (
+                {needs.data.nodes.map((reference) => (
                   <li key={reference.id} className="flex items-center gap-2">
                     <FileSearch aria-hidden="true" className="size-3.5 shrink-0" />
                     <span className="min-w-0 truncate">{reference.title}</span>
@@ -1041,9 +1041,9 @@ function FlowNeeds({ flowId }: { flowId: string }) {
                 ))}
                 {/* ⚠️ Counted, never named. A title is exactly what someone without access to the
                     document may not learn from a list about it. */}
-                {needs.data.hiddenKnowledge > 0 && (
+                {needs.data.hiddenNodes > 0 && (
                   <li className="text-muted-foreground">
-                    {i18n.t("flows.needsHidden", { count: needs.data.hiddenKnowledge })}
+                    {i18n.t("flows.needsHidden", { count: needs.data.hiddenNodes })}
                   </li>
                 )}
               </ul>

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

@@ -19,7 +19,7 @@ import { useIntelRouterContext } from "@/router/router-context.ts";
 function targetOf(entry: TreeEntry): ResourceTarget {
   return entry.type === "flow"
     ? { type: "flow", flow: entry.flow }
-    : { type: "knowledge", node: entry.node };
+    : { type: "node", node: entry.node };
 }
 
 /**
@@ -51,7 +51,7 @@ export function FolderContents({ folderId }: { folderId: string }) {
   if (level.isError) {
     return (
       <p role="alert" className="p-6 text-sm text-destructive">
-        {i18n.t("knowledge.folderFailed")}
+        {i18n.t("node.folderFailed")}
       </p>
     );
   }
@@ -63,7 +63,7 @@ export function FolderContents({ folderId }: { folderId: string }) {
   if (entries.length === 0) {
     return (
       <div className="grid flex-1 place-items-center p-8 text-sm text-muted-foreground">
-        {i18n.t("knowledge.folderEmpty")}
+        {i18n.t("node.folderEmpty")}
       </div>
     );
   }
@@ -78,12 +78,12 @@ export function FolderContents({ folderId }: { folderId: string }) {
                 {i18n.t("common.title")}
               </TableHead>
               <TableHead className="h-9 px-4 text-right text-xs tracking-wide uppercase">
-                {i18n.t("knowledge.changed")}
+                {i18n.t("node.changed")}
               </TableHead>
               {/* A `<th>` with nothing in it leaves the column unnamed for anyone reading the table
                   by its headers. The word is there; only the eye is spared it. */}
               <TableHead className="h-9 w-14">
-                <span className="sr-only">{i18n.t("knowledge.rowActions")}</span>
+                <span className="sr-only">{i18n.t("node.rowActions")}</span>
               </TableHead>
             </TableRow>
           </TableHeader>
@@ -101,7 +101,7 @@ export function FolderContents({ folderId }: { folderId: string }) {
                       type="button"
                       onClick={() =>
                         void navigate({
-                          to: entry.type === "flow" ? "/flows" : "/knowledge",
+                          to: entry.type === "flow" ? "/flows" : "/nodes",
                           search: { select: entry.id },
                         })
                       }
@@ -120,7 +120,7 @@ export function FolderContents({ folderId }: { folderId: string }) {
                       </span>
                       {/* The icon carries the type on screen; this carries it everywhere else, and
                           it is why a flow needs no suffix in its name to be told from a document. */}
-                      <span className="sr-only">{i18n.t(`knowledge.kind.${entry.kind}`)}</span>
+                      <span className="sr-only">{i18n.t(`node.kind.${entry.kind}`)}</span>
                     </button>
                   </TableCell>
                   <TableCell className="px-4 text-right text-sm text-muted-foreground tabular-nums">

package/src/graph-pane/graph-pane.tsx

@@ -4,7 +4,7 @@ import { lazy, Suspense } from "react";
 import { useIntelRouterContext } from "@/router/router-context.ts";
 
 const RelationGraphView = lazy(async () => ({
-  default: (await import("@/knowledge-graph/knowledge-graph.tsx")).RelationGraphView,
+  default: (await import("@/node-graph/node-graph.tsx")).RelationGraphView,
 }));
 
 // The graph half of the editor ↔ graph switch, with its own loading, error and empty states (#19).

package/src/hooks/use-capabilities.ts

@@ -0,0 +1,22 @@
+import type { IntelCapabilities } from "@anchrd/intel-contract";
+import { type UseQueryResult, useQuery } from "@tanstack/react-query";
+import { useIntelRouterContext } from "@/router/router-context.ts";
+
+/**
+ * What this installation is equipped to do, asked once and believed for the session (#190).
+ *
+ * ⚠️ Deployment facts, not the caller's permissions — a runtime does not appear or vanish while a
+ * page is open, so the answer never goes stale and is never refetched. While the answer is still on
+ * its way, `data` is `undefined`: a caller deciding whether to OFFER something treats that as "not
+ * yet" (a menu item appearing late is fine; one that vanishes was a lie), and a caller deciding
+ * whether to take a rendered page AWAY does the opposite.
+ */
+export function useCapabilities(): UseQueryResult<IntelCapabilities> {
+  const { data } = useIntelRouterContext();
+  return useQuery({
+    queryKey: ["capabilities"],
+    queryFn: () => data.getCapabilities(),
+    staleTime: Number.POSITIVE_INFINITY,
+    retry: false,
+  });
+}