swarm-ui: split pages/agents into two pages and the agent components

pages/agents held the roster page, the terminal page and every component under them. It keeps the two pages; the components move to src/agent, by concern: roster (card, wanted menu, actions), detail (panel body, dialog, inference, linked accounts, link menu) and terminal (preview, input, subagents, stream hooks, favicon), with the shared row type and icon at the top. Moves and import rewrites only.

frontend/packages/swarm-ui/src/agent/AgentIcon.tsx

@@ -0,0 +1,38 @@
+// <AgentIcon> — the agent's icon from swarm-controller's
+// `GET /api/agents/{name}/icon`, the same square and fallback as the hive
+// dashboard's container row: an agent with no icon (404) or an unreachable
+// controller shows the dimmed hyperhive mark instead of a broken image.
+// Always an `<img>`: the body is an agent-authored SVG, and only an image load
+// keeps its script from running.
+import { useState } from "preact/hooks";
+import "./AgentIcon.css";
+
+export function AgentIcon({
+  name,
+  small = false,
+}: {
+  name: string;
+  /** Badge-sized, for beside a line of text, rather than the card's square. */
+  small?: boolean;
+}) {
+  const [fallback, setFallback] = useState(false);
+  return (
+    <div
+      class={
+        "ui-agent-icon" +
+        (small ? " ui-agent-icon-small" : "") +
+        (fallback ? " ui-agent-icon-none" : "")
+      }
+    >
+      <img
+        alt=""
+        src={
+          fallback
+            ? "/favicon.svg"
+            : `/api/agents/${encodeURIComponent(name)}/icon`
+        }
+        onError={() => setFallback(true)}
+      />
+    </div>
+  );
+}