@anchrd/intel 0.59.0

package/ui/src/app/tree-reveal/tree-reveal.ts

@@ -0,0 +1,64 @@
+import type { ExpandedLevel } from "@/app/tree-expansion/tree-expansion.types.ts";
+import type { RevealDeps, RevealTarget } from "./tree-reveal.types.ts";
+
+/**
+ * How far up the trail is followed before it is given up on.
+ *
+ * ⚠️ NOT a claim about how deep anybody nests. It is the stop against a parent chain that does not
+ * end: `parent_id` is a plain column, and a cycle in it — a bad restore, a move that crossed itself
+ * — would otherwise be an endless walk making one request per step, in the sidebar, on every screen
+ * of the application.
+ */
+export const MaxTrailDepth = 32;
+
+/**
+ * The folders standing above a selected row, root first.
+ *
+ * ⚠️ The row ITSELF is never in the answer, and a selected folder is no exception. Selecting
+ * something says where it is; opening it is a gesture, and the tree does not get to invent one
+ * (#809).
+ *
+ * ⚠️ A failure answers with the trail found SO FAR rather than with nothing. A parent this reader
+ * may not see is the ordinary case rather than an error — a shared document is reachable while the
+ * folder above it is not (#429) — and giving up on the whole trail would leave a tree closed that
+ * could have been opened down to the last folder the reader does see.
+ */
+export async function folderTrail(
+  deps: RevealDeps,
+  target: RevealTarget,
+): Promise<ExpandedLevel[]> {
+  const trail: ExpandedLevel[] = [];
+  const seen = new Set<string>([target.id]);
+  let parentId: string | null;
+  try {
+    parentId =
+      target.area === "flows"
+        ? (await deps.flow(target.id)).parentId
+        : (await deps.node(target.id)).parentId;
+  } catch {
+    return [];
+  }
+
+  while (parentId !== null && trail.length < MaxTrailDepth) {
+    if (seen.has(parentId)) break;
+    const folderId = parentId;
+    seen.add(folderId);
+    // ⚠️ Read BEFORE taking it into the trail, and the order is the whole point: the answer to this
+    // request is also the answer to "may this reader see the folder at all". Taken in first, an
+    // unreadable folder would stand in the tree's open list as a level nobody can draw — harmless
+    // today, because a level without a row is never loaded (#521), but it is a claim about
+    // something the reader does not have.
+    let parent: { parentId: string | null };
+    try {
+      parent = await deps.node(folderId);
+    } catch {
+      break;
+    }
+    trail.push({ id: folderId, type: "folder" });
+    parentId = parent.parentId;
+  }
+
+  // Root first, which is the order the tree opens them in anyway: a level is only loaded once the
+  // row above it is drawn.
+  return trail.reverse();
+}

package/ui/src/app/tree-reveal/tree-reveal.types.ts

@@ -0,0 +1,16 @@
+// Where a selection lives. The area comes from the path the reader is on, never from the id: a
+// `select` on `/flows` names a flow, the same parameter on `/nodes` names a node, and nothing about
+// the id itself tells the two apart.
+export type RevealArea = "nodes" | "flows";
+
+export interface RevealTarget {
+  id: string;
+  area: RevealArea;
+}
+
+// Only the one field the trail walks on. Both readers hand back a whole document; asking for the
+// parent alone keeps this module out of the shape of either.
+export interface RevealDeps {
+  node(nodeId: string): Promise<{ parentId: string | null }>;
+  flow(flowId: string): Promise<{ parentId: string | null }>;
+}

package/ui/src/app/user-footer/user-footer.tsx

@@ -0,0 +1,188 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { useNavigate, useRouterState } from "@tanstack/react-router";
+import {
+  Archive as ArchiveIcon,
+  ChevronsUpDown,
+  List,
+  LogOut,
+  RefreshCw,
+  Settings,
+  User,
+  Wrench,
+} from "lucide-react";
+import { useState } from "react";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { SidebarMenu, SidebarMenuItem } from "@/components/ui/sidebar";
+import { loginPath } from "@/data/intel-data-provider/intel-data-provider.ts";
+import { useI18n } from "@/i18n/i18n-context.tsx";
+import { useIntelRouterContext } from "@/router/router-context.ts";
+import { ReindexDialog } from "../reindex-dialog/reindex-dialog.tsx";
+import { SettingsDialog } from "../settings-dialog/settings-dialog.tsx";
+
+/**
+ * Everything that belongs to the person rather than to the content, behind the person (#24).
+ *
+ * The three rows this used to be — the tool catalogue, the name, the sign-out — spent three lines of
+ * sidebar on things nobody opens twice a day. The name and the address stay on screen, because they
+ * are the answer to "who am I signed in as", which is a reading and not an action; the two actions
+ * move behind them.
+ *
+ * The catalogue itself is a live portal query with the signed-in user's own token (ADR-0003), so
+ * what it shows depends on who is asking.
+ */
+export function UserFooter() {
+  const { data } = useIntelRouterContext();
+  const i18n = useI18n();
+  const navigate = useNavigate();
+  const pathname = useRouterState({ select: (state) => state.location.pathname });
+  // The state lives here, not in the dialog: its trigger is a DropdownMenuItem, and Radix unmounts
+  // the menu content when an item is chosen — a dialog nested in there would go with it.
+  const [settingsOpen, setSettingsOpen] = useState(false);
+  const [reindexOpen, setReindexOpen] = useState(false);
+  const session = useQuery({ queryKey: ["session"], queryFn: () => data.getSession() });
+  const logout = useMutation({
+    mutationFn: () => data.logout(),
+    onSuccess: () => window.location.assign(loginPath()),
+  });
+
+  const user = session.data ?? null;
+  const primary = user
+    ? (user.name ?? user.email)
+    : session.isPending
+      ? i18n.t("common.loading")
+      : i18n.t("shell.userUnavailable");
+  const secondary = user?.name ? user.email : null;
+
+  return (
+    <SidebarMenu>
+      <SidebarMenuItem>
+        <DropdownMenu>
+          <DropdownMenuTrigger
+            aria-label={i18n.t("shell.userMenu", { name: primary })}
+            data-slot="signed-in-user"
+            // ⚠️ `/feed` joins `/tools` here (#813): both destinations live behind THIS trigger and
+            // nowhere else in the sidebar (#742), so the trigger is the only surface that could ever
+            // say "you are there" for either one — the tree carries no row for a place that is not a
+            // place things are IN. Extending this to `/archive` and `/settings` too was left alone
+            // deliberately: the ticket asked about the feed, and touching the other two answers a
+            // question nobody put to this ticket.
+            data-active={pathname === "/tools" || pathname === "/feed"}
+            className="flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 focus-visible:ring-sidebar-ring data-[active=true]:bg-sidebar-accent data-[state=open]:bg-sidebar-accent"
+          >
+            <span className="flex aspect-square size-8 shrink-0 items-center justify-center rounded-lg bg-sidebar-accent text-sidebar-accent-foreground">
+              <User aria-hidden="true" className="size-4" />
+            </span>
+            {/* Read out in both states; sighted users see it in neither. It is what tells a screen
+                reader that the name below is a name and not a heading. */}
+            <span className="sr-only">{i18n.t("shell.signedInUser")}</span>
+            <span className="grid min-w-0 flex-1 leading-tight">
+              <span className="truncate font-medium">{primary}</span>
+              {secondary ? (
+                <span className="truncate text-xs text-muted-foreground">{secondary}</span>
+              ) : null}
+            </span>
+            <ChevronsUpDown aria-hidden="true" className="ml-auto size-4 shrink-0" />
+          </DropdownMenuTrigger>
+          {/* Upwards and as wide as its trigger: it opens from the bottom edge of the screen, and
+              a menu that has to be hunted for beside its button is a menu that was not found. */}
+          <DropdownMenuContent
+            side="top"
+            align="start"
+            className="w-(--radix-dropdown-menu-trigger-width) min-w-56"
+          >
+            {/* #452: the head — who is signed in, above the things they can do. It used to stand
+                ONLY in the trigger BELOW the menu, so an open menu pointed at the answer instead of
+                giving it. Not a menu item: it is a reading, not an action, so it takes no focus and
+                nothing happens when it is pressed. */}
+            <DropdownMenuLabel className="font-normal">
+              <div className="grid text-left text-sm leading-tight">
+                <span className="truncate font-medium">{primary}</span>
+                {secondary ? (
+                  <span className="truncate text-xs text-muted-foreground">{secondary}</span>
+                ) : null}
+              </div>
+            </DropdownMenuLabel>
+            {/* ⚠️ The ONE separator, and the only one left (#452). There used to be three, each with
+                a good reason of its own: the settings change nothing anybody else sees, the reindex
+                belongs to the installation rather than the person, signing out is destructive.
+                Together they cut five rows into five groups — and a grouping that separates every
+                single row groups nothing. Above it stands who you are, below it what you can do;
+                that is the whole distinction the line carries, and it is the same one Gate draws. */}
+            <DropdownMenuSeparator />
+            <DropdownMenuItem onSelect={() => void navigate({ to: "/tools" })}>
+              <Wrench aria-hidden="true" />
+              {i18n.t("nav.tools")}
+            </DropdownMenuItem>
+            {/* ⚠️ The feed lives here and NOT in the tree, and the placement is the decision
+                (#742): it is not a place things are in, and it is not something anybody needs
+                twice a day. No counter and no dot on the icon either — a badge is a request for
+                attention, and this surface is deliberately not making one. */}
+            <DropdownMenuItem onSelect={() => void navigate({ to: "/feed" })}>
+              <List aria-hidden="true" />
+              {i18n.t("feed.title")}
+            </DropdownMenuItem>
+            {/* The archive lives here rather than in the tree: it is not a place things are IN,
+                it is where they went when they left the tree (#113). */}
+            <DropdownMenuItem onSelect={() => void navigate({ to: "/archive" })}>
+              <ArchiveIcon aria-hidden="true" />
+              {i18n.t("archive.title")}
+            </DropdownMenuItem>
+            {/* Language and appearance belong to the person, like everything else behind this menu. */}
+            <DropdownMenuItem onSelect={() => setSettingsOpen(true)}>
+              <Settings aria-hidden="true" />
+              {i18n.t("settings.title")}
+            </DropdownMenuItem>
+            {/* ⚠️ Drawn only for an administrator, and that is a DRAWING decision — `POST
+                /nodes/reindex` asks Gate for `intel/admin` itself and would refuse this row's press
+                just the same (#416). Hiding it is not the check; it is not offering everybody a
+                door they cannot open.
+                ⚠️ Its own separator is GONE (#452): it set a single row apart, and that is exactly
+                the line this ticket removes. The reason it carried — this one belongs to the
+                installation — is true and still not worth a rule of its own on a five-row menu. */}
+            {session.data?.isAdmin ? (
+              // ⚠️ `nav.reindex` is a DIFFERENT key from the dialog's `reindex.title` on purpose
+              // (#814): a menu of one-word entries carries a whole sentence for this one row, and
+              // the dialog's heading has to stay the long form it is — the sentence beneath it is
+              // about time and money, and the heading names what that sentence is about.
+              <DropdownMenuItem onSelect={() => setReindexOpen(true)}>
+                <RefreshCw aria-hidden="true" />
+                {i18n.t("nav.reindex")}
+              </DropdownMenuItem>
+            ) : null}
+            {/* Signing out stays recognisable as destructive — the COLOUR does that, and it needs no
+                line of its own to say it twice. */}
+            <DropdownMenuItem
+              disabled={logout.isPending}
+              onSelect={() => logout.mutate()}
+              className="text-destructive focus:text-destructive"
+            >
+              <LogOut aria-hidden="true" />
+              {i18n.t("auth.signOut")}
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+        {/* ⚠️ Outside the DropdownMenu on purpose — see the state above. */}
+        <SettingsDialog open={settingsOpen} onOpenChange={setSettingsOpen} />
+        {/* ⚠️ Outside the DropdownMenu for the same reason as the settings dialog. */}
+        <ReindexDialog open={reindexOpen} onOpenChange={setReindexOpen} />
+      </SidebarMenuItem>
+      {/* ⚠️ Outside the menu on purpose. Choosing sign-out closes the popup, so a refusal rendered
+          inside it would be gone in the same frame it was written — the one message that must
+          survive is the one saying you are still signed in. */}
+      {logout.isError ? (
+        <SidebarMenuItem>
+          <p role="alert" className="px-2 py-1 text-sm text-destructive">
+            {i18n.t("auth.signOutFailed")}
+          </p>
+        </SidebarMenuItem>
+      ) : null}
+    </SidebarMenu>
+  );
+}

package/ui/src/app/view-menu/view-menu.tsx

@@ -0,0 +1,115 @@
+import { useNavigate, useRouterState } from "@tanstack/react-router";
+import { Code2, KanbanSquare, ListChecks, Network, PencilRuler, Table2 } from "lucide-react";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { useI18n } from "@/i18n/i18n-context.tsx";
+import { type IntelView, viewOf } from "@/router/selection-search.ts";
+
+// ⚠️ `runs` is NOT `History`, and that is the point of this line rather than a taste in icons.
+// `History` is what the resource menu draws beside "Version history" (`resource-menu.tsx`), and both
+// are visible on the same flow header — one as this switch, one in the menu right below it. The same
+// clock for two different things was read as one: the switch was taken for the version history and
+// asked about as such (#635). Whatever stands here has to stay out of that menu.
+const icons = {
+  editor: PencilRuler,
+  graph: Network,
+  runs: ListChecks,
+  kanban: KanbanSquare,
+  table: Table2,
+  code: Code2,
+} as const;
+
+// The NAME of a view, not an instruction to switch to it. A menu entry says what it leads to and
+// the closed trigger says where you are — both need the same word, and "Show this level as a graph"
+// is a sentence for neither.
+const names = {
+  editor: "view.name.editor",
+  graph: "view.name.graph",
+  runs: "view.name.runs",
+  kanban: "view.name.kanban",
+  table: "view.name.table",
+  code: "view.name.code",
+} as const;
+
+/**
+ * The switch between the ways the selected thing can be shown: one symbol for the view you are in,
+ * and one click to see the rest by symbol and name.
+ *
+ * **This shape is the convention for every view, including the ones not built yet** (#818, Jack's
+ * decision of 2026-08-29). Until then there were two switches for one question — a row of buttons
+ * in the address for editor/graph/runs, and a second, address-less pair inside the board — which
+ * looked alike and behaved differently. Whoever adds a view adds an entry here; nobody adds a
+ * second mechanism.
+ *
+ * ⚠️ **It replaces a decision that had a reason, and the reason is not gone.** #19 and #24 chose a
+ * row of buttons over a menu because a menu costs a click in each direction, and with two views a
+ * toggle is genuinely cheaper. That price is named and accepted: one uniform switch on every
+ * surface is worth a click where there are only two views. What is NOT reopened is cycling through
+ * the views (#35, #635) — every destination is one entry, and every entry keeps one name.
+ *
+ * **Head, not row.** The switch changes how the *current* thing is shown, and the header is where
+ * that thing is already named. In a tree row it would sit inside the row's overflow menu (#24), two
+ * clicks away in each direction.
+ *
+ * ⚠️ **Where there is only one view there is no switch**, and that is a rule rather than an
+ * accident of the call sites: a menu with a single entry is a control that promises a choice it
+ * does not have. The callers already leave it out where there is nothing to switch to (a document
+ * has no graph); the guard below answers the same question one level lower, where it cannot be
+ * forgotten.
+ */
+export function ViewMenu({ views = ["editor", "graph"] }: { views?: readonly IntelView[] }) {
+  const i18n = useI18n();
+  const navigate = useNavigate();
+  const state = useRouterState({
+    select: (current) => ({
+      pathname: current.location.pathname,
+      search: current.location.search as Record<string, unknown>,
+      view: viewOf(current.location.search, views),
+    }),
+  });
+  if (views.length < 2) return null;
+  const CurrentIcon = icons[state.view];
+  return (
+    <DropdownMenu>
+      {/* ⚠️ The name sits on the BUTTON, never on the icon inside it: children of a button are
+          presentational in ARIA, so a labelled mark in here would be announced by nobody (#366). */}
+      <DropdownMenuTrigger
+        data-view-menu=""
+        aria-label={i18n.t("view.current", { name: i18n.t(names[state.view]) })}
+        className="inline-flex size-8 shrink-0 items-center justify-center rounded-md outline-none hover:bg-accent focus-visible:ring-2 focus-visible:ring-ring data-[state=open]:bg-accent"
+      >
+        <CurrentIcon aria-hidden="true" className="size-4" />
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end" className="min-w-40 whitespace-nowrap">
+        {/* The others, because the one you are in is what the closed symbol already says. A list
+            that repeated it would put the reader's own view among the places to go. */}
+        {views
+          .filter((view) => view !== state.view)
+          .map((view) => {
+            const Icon = icons[view];
+            return (
+              <DropdownMenuItem
+                key={view}
+                onSelect={() => {
+                  // The first view is the surface's default and is written as the ABSENCE of the
+                  // parameter, so a link to it stays the plain link it has always been.
+                  const { view: _view, ...rest } = state.search;
+                  void navigate({
+                    to: state.pathname,
+                    search: view === views[0] ? rest : { ...rest, view },
+                  });
+                }}
+              >
+                <Icon aria-hidden="true" />
+                {i18n.t(names[view])}
+              </DropdownMenuItem>
+            );
+          })}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}

package/ui/src/app-root/app-root.tsx

@@ -0,0 +1,109 @@
+import { useQuery } from "@tanstack/react-query";
+import { RouterProvider } from "@tanstack/react-router";
+import { useSyncExternalStore } from "react";
+import type { IntelDataProvider } from "@/data/intel-data-provider/intel-data-provider.types.ts";
+import { useI18n } from "@/i18n/i18n-context.tsx";
+import { SignInRefused } from "@/sign-in-refused/sign-in-refused.tsx";
+import type { AppRootDeps, RefusalStore } from "./app-root.types.ts";
+
+/**
+ * The one decision this application makes before it draws anything: **is there a session?**
+ *
+ * ⚠️ Without a session there is NO SHELL — not the sidebar, not the header, not the search (#456).
+ * It used to paint first and ask afterwards: the `RouterProvider` started, the shell stood, the
+ * queries went out, and only when the first of them came back 401 did the redirect happen. Between
+ * "painted" and "redirected" lay a full network round trip in which a stranger saw the application.
+ * A slow answer stretched that window arbitrarily, and a route that fires no query at all never
+ * closed it.
+ *
+ * ⚠️ What is NOT claimed: that data would become visible. The api answers 401 and the lists stay
+ * empty. But that one server answer was then the ONLY defence — the client had none. Any surface
+ * that later renders something before the first request (a cache, a `localStorage`, an optimistic
+ * value) would break it without meaning to. And an application that looks as if one were inside it
+ * and contains nothing is the wrong first impression from a product whose business is access
+ * control.
+ *
+ * ⚠️ **This is the file #130 asked for.** The logic sat in `main.tsx`, `main.tsx` had no test, and
+ * therefore none of the eleven tests written for #118 ever touched it: *"the entry point is exactly
+ * the place where 'this is only wiring' sounds most plausible and costs most."* The decision now
+ * lives somewhere a test can call.
+ */
+export function AppRoot({ data, router, refusal }: AppRootDeps) {
+  const refused = useSyncExternalStore(refusal.subscribe, refusal.isRefused, refusal.isRefused);
+  if (refused) return <SignInRefused />;
+  return <SessionGate data={data} router={router} />;
+}
+
+/**
+ * ⚠️ Its own component, and not merged into `AppRoot`: the hook below may only run once a
+ * `QueryClientProvider` is above it, and `refused` has to be answerable without one — the refusal
+ * screen is what stands there when nothing else works.
+ */
+function SessionGate({ data, router }: { data: IntelDataProvider; router: AppRootDeps["router"] }) {
+  const i18n = useI18n();
+  // ⚠️ `retry: false`, deliberately against the client's default policy: this answer is
+  // authoritative in both directions. A 401 is not a hiccup to be retried — the provider's
+  // `onUnauthorized` is already taking the reader to Gate while this promise rejects — and a retry
+  // here would additionally be PAUSED while the tab is unfocused (`packages/intel/ui/CLAUDE.md`), which
+  // is how a guard turns into a permanent "Loading" for somebody looking elsewhere.
+  //
+  // The key is the one `UserFooter` reads, so the shell's own session query is already answered
+  // when it mounts. One question, asked once.
+  const session = useQuery({
+    queryKey: ["session"],
+    queryFn: () => data.getSession(),
+    retry: false,
+    staleTime: Number.POSITIVE_INFINITY,
+  });
+
+  // ⚠️ Both the waiting and the failing case render NO shell. The failing one is not the same as
+  // "not signed in": a 401 has already sent the reader away by the time it lands here, so what is
+  // left is a surface that could not be reached at all — and saying that is better than a spinner
+  // that never ends. Neither of them draws a sidebar.
+  if (session.isPending) {
+    return (
+      <div className="grid min-h-dvh place-items-center bg-background p-8">
+        <p className="text-sm text-muted-foreground">{i18n.t("common.loading")}</p>
+      </div>
+    );
+  }
+  if (session.isError) {
+    return (
+      <div role="alert" className="grid min-h-dvh place-items-center bg-background p-8">
+        <div className="max-w-prose text-center">
+          <p className="text-sm text-muted-foreground">{i18n.t("signIn.unreachable")}</p>
+          <button
+            type="button"
+            onClick={() => window.location.reload()}
+            className="mt-6 rounded-md border px-4 py-2 text-sm font-medium outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring"
+          >
+            {i18n.t("common.retry")}
+          </button>
+        </div>
+      </div>
+    );
+  }
+  return <RouterProvider router={router} />;
+}
+
+/**
+ * ⚠️ Latching, and that is not an optimisation: once the surface has turned down a freshly issued
+ * credential, later 401s say nothing new. Without the latch every request the page still had in
+ * flight would notify again, and the screen would flicker once per answer.
+ */
+export function createRefusalStore(): RefusalStore {
+  let refused = false;
+  const listeners = new Set<() => void>();
+  return {
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    isRefused: () => refused,
+    refuse() {
+      if (refused) return;
+      refused = true;
+      for (const listener of listeners) listener();
+    },
+  };
+}

package/ui/src/app-root/app-root.types.ts

@@ -0,0 +1,27 @@
+import type { IntelDataProvider } from "@/data/intel-data-provider/intel-data-provider.types.ts";
+import type { createIntelRouter } from "@/router/router.tsx";
+
+/**
+ * Whether the surface has turned down a freshly issued credential (#118) — a store rather than a
+ * module-level `let`, and that is the whole point of #456.
+ *
+ * The refusal arrives from inside a `fetch`, not from React: the data provider calls
+ * `onUnauthorized`, and something on screen has to change because of it. That used to be a
+ * `let refused = false` in `main.tsx` with a hand-written repaint — a decision in bare module body,
+ * which is exactly what nothing could call and therefore what no test ever touched (#130).
+ */
+export interface RefusalStore {
+  subscribe(listener: () => void): () => void;
+  isRefused(): boolean;
+  refuse(): void;
+}
+
+export type IntelRouter = ReturnType<typeof createIntelRouter>;
+
+export interface AppRootDeps {
+  // ⚠️ The provider is handed in rather than read from the router context: that context only exists
+  // INSIDE `RouterProvider`, and the whole point of the gate is to decide before it mounts.
+  data: IntelDataProvider;
+  router: IntelRouter;
+  refusal: RefusalStore;
+}