feat(frontend): Topologies page — catalog browser + builder
ci / gates (push) Has been cancelled
ci / rust (push) Has been cancelled
ci / sandbox-k8s (push) Has been cancelled
ci / frontend (push) Has been cancelled
ci / e2e (push) Has been cancelled

New authed workspace page (/topologies, in the global nav) that browses the
topology catalog and builds + visualizes a topology from a kind + roles:
- lib/api/topology.ts: zod schemas + fetchTopologyCatalog (server, authed).
- TopologyGraphView: lightweight SVG renderer (no new deps), laid out per kind
  (row for pipeline/ring, star for delegation kinds, circle otherwise).
- TopologyExplorer (client): catalog list + roles input → POST
  /api/topologies/build via the /api proxy → render the graph.
- ShellNav: add the Topologies nav item.
- e2e (p8): sign in → nav → browse catalog → build a pipeline → graph renders.

Full suite green (38); npm build + TS clean. Goes live with the next server+
frontend deploy (compare/Pareto UI to follow).

Co-Authored-By: Claude Opus 4.8 <[email protected]>
This commit is contained in:
Omar Sobh
2026-06-16 03:41:30 -07:00
co-authored by Claude Opus 4.8
parent a35c82d860
commit 7648487a59
6 changed files with 265 additions and 1 deletions
@@ -0,0 +1,16 @@
import { PageChrome } from "@/components/global/PageChrome";
import { TopologyExplorer } from "@/components/topology/TopologyExplorer";
import { fetchTopologyCatalog } from "@/lib/api/topology";
// Topologies page: browse the catalog and build/visualize a topology.
export default async function TopologiesPage() {
const catalog = await fetchTopologyCatalog();
return (
<PageChrome
title="Topologies"
description={`${catalog.length} organizational patterns to run your agents in`}
>
<TopologyExplorer catalog={catalog} />
</PageChrome>
);
}