swarm-ui: open an agent's details in a dialog from its terminal tab

The terminal page gets an agent badge (icon and name) that opens the agent's detail panel in a dialog over the terminal, without the terminal preview. The panel body and the actions on an agent (declare a wanted state, link an account, with their confirm and form dialogs) move out of the agent roster page into AgentDetail and useAgentActions, so the roster and the dialog share them. AgentIcon moves to its own file for the same reason.

frontend/packages/swarm-ui/src/pages/agents/AgentCard.tsx

@@ -12,11 +12,11 @@
 // `WantedMenu` below keeps its own clicks (mouse or keyboard-synthesized,
 // `WantedMenu` hosts real `<button>`s) from also firing `Card`'s
 // `onClick` and opening the detail panel.
-import { useState } from "preact/hooks";
 import { Badge } from "@hive/shared/badge.js";
 import type { ProblemDetails } from "@hive/shared/api-error.js";
 import { Card } from "../../ui/card/Card.js";
 import { RelativeTime } from "../../ui/relative-time/RelativeTime.js";
+import { AgentIcon } from "./AgentIcon.js";
 import { FRESHNESS, type AgentRow } from "./AgentTypes.js";
 import { WantedMenu } from "./WantedMenu.js";
 import "./AgentCard.css";
@@ -100,31 +100,3 @@ export function AgentCard({
     </Card>
   );
 }
-
-// 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.
-function AgentIcon({ name }: { name: string }) {
-  const [fallback, setFallback] = useState(false);
-  return (
-    <div
-      class={
-        fallback
-          ? "ui-agent-card-icon ui-agent-card-icon-none"
-          : "ui-agent-card-icon"
-      }
-    >
-      <img
-        alt=""
-        src={
-          fallback
-            ? "/favicon.svg"
-            : `/api/agents/${encodeURIComponent(name)}/icon`
-        }
-        onError={() => setFallback(true)}
-      />
-    </div>
-  );
-}