@mndrk/agx 2.1.0 → 2.3.0

package/cloud-runtime/standalone/apps/local/components/linear/LinearWorkerRunLog.tsx

@@ -0,0 +1,190 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { RefreshCw, CheckCircle2, XCircle, Clock, Loader2, Ban } from "lucide-react";
+import type { PromptRun } from "@/src/prompt-scheduler/types";
+
+interface LinearWorkerRunLogProps {
+  jobId: string | null;
+}
+
+function StatusIcon({ status }: { status: PromptRun["status"] }) {
+  switch (status) {
+    case "success":
+      return <CheckCircle2 size={14} className="text-emerald-400" />;
+    case "failed":
+      return <XCircle size={14} className="text-red-400" />;
+    case "running":
+      return <Loader2 size={14} className="text-blue-400 animate-spin" />;
+    case "queued":
+      return <Clock size={14} className="text-yellow-400" />;
+    case "cancelled":
+      return <Ban size={14} className="text-[var(--muted-foreground)]" />;
+    default:
+      return <Clock size={14} className="text-[var(--muted-foreground)]" />;
+  }
+}
+
+function statusLabel(status: PromptRun["status"]): string {
+  return status.charAt(0).toUpperCase() + status.slice(1);
+}
+
+function statusColor(status: PromptRun["status"]): string {
+  switch (status) {
+    case "success":
+      return "text-emerald-400";
+    case "failed":
+      return "text-red-400";
+    case "running":
+      return "text-blue-400";
+    case "queued":
+      return "text-yellow-400";
+    case "cancelled":
+      return "text-[var(--muted-foreground)]";
+    default:
+      return "text-[var(--muted-foreground)]";
+  }
+}
+
+function formatDuration(ms: number | null): string {
+  if (ms === null) return "—";
+  if (ms < 1000) return `${ms}ms`;
+  if (ms < 60_000) return `${(ms / 1000).toFixed(1)}s`;
+  if (ms < 3_600_000) return `${Math.round(ms / 60_000)}m ${Math.round((ms % 60_000) / 1000)}s`;
+  return `${Math.round(ms / 3_600_000)}h ${Math.round((ms % 3_600_000) / 60_000)}m`;
+}
+
+function formatTime(iso: string | null): string {
+  if (!iso) return "—";
+  const d = new Date(iso);
+  return d.toLocaleString(undefined, {
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit",
+  });
+}
+
+export default function LinearWorkerRunLog({ jobId }: LinearWorkerRunLogProps) {
+  const [runs, setRuns] = useState<PromptRun[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [expandedId, setExpandedId] = useState<string | null>(null);
+  const initialFetch = useRef(false);
+
+  const fetchRuns = useCallback(async () => {
+    if (!jobId) {
+      setLoading(false);
+      return;
+    }
+    try {
+      const res = await fetch(`/api/prompt-jobs/${jobId}/runs`);
+      if (!res.ok) return;
+      const data = await res.json();
+      setRuns(data.runs ?? []);
+    } catch {
+      // ignore
+    } finally {
+      setLoading(false);
+    }
+  }, [jobId]);
+
+  useEffect(() => {
+    if (!initialFetch.current) {
+      initialFetch.current = true;
+      fetchRuns();
+    }
+  }, [fetchRuns]);
+
+  // Poll for updates
+  useEffect(() => {
+    const interval = setInterval(fetchRuns, 10_000);
+    return () => clearInterval(interval);
+  }, [fetchRuns]);
+
+  if (!jobId) {
+    return (
+      <div className="flex items-center justify-center py-16 text-sm text-[var(--muted-foreground)]">
+        No worker configured yet. Enable the worker to see run history.
+      </div>
+    );
+  }
+
+  if (loading) {
+    return (
+      <div className="flex items-center gap-2 py-12 justify-center text-sm text-[var(--muted-foreground)]">
+        <RefreshCw size={14} className="animate-spin" />
+        Loading run history...
+      </div>
+    );
+  }
+
+  if (runs.length === 0) {
+    return (
+      <div className="flex items-center justify-center py-16 text-sm text-[var(--muted-foreground)]">
+        No runs yet. The worker will log runs here once it starts executing.
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-1">
+      {/* Header */}
+      <div className="grid grid-cols-[minmax(0,1fr)_100px_140px_140px_90px] gap-3 px-4 py-2 text-[10px] font-semibold text-[var(--muted-foreground)] uppercase tracking-widest border-b border-[var(--card-border)]">
+        <span>Status</span>
+        <span>Duration</span>
+        <span>Started</span>
+        <span>Finished</span>
+        <span>Run ID</span>
+      </div>
+
+      {/* Rows */}
+      <div className="max-h-[60vh] overflow-y-auto">
+        {runs.map((run) => (
+          <div key={run.id}>
+            <button
+              type="button"
+              onClick={() => setExpandedId(expandedId === run.id ? null : run.id)}
+              className="grid w-full grid-cols-[minmax(0,1fr)_100px_140px_140px_90px] gap-3 px-4 py-2.5 text-left text-sm transition-colors hover:bg-[var(--card-bg)] rounded-lg"
+            >
+              <span className={`flex items-center gap-2 font-medium ${statusColor(run.status)}`}>
+                <StatusIcon status={run.status} />
+                {statusLabel(run.status)}
+              </span>
+              <span className="text-[var(--muted-foreground)]">
+                {formatDuration(run.durationMs)}
+              </span>
+              <span className="text-[var(--muted-foreground)]">
+                {formatTime(run.startedAt)}
+              </span>
+              <span className="text-[var(--muted-foreground)]">
+                {formatTime(run.finishedAt)}
+              </span>
+              <span className="text-[var(--muted-foreground)] font-mono text-xs truncate">
+                {run.id.slice(0, 8)}
+              </span>
+            </button>
+
+            {/* Expanded detail */}
+            {expandedId === run.id && (run.output || run.error) && (
+              <div className="mx-4 mb-2 rounded-lg border border-[var(--card-border)] bg-[var(--muted)] overflow-hidden">
+                {run.error && (
+                  <div className="px-4 py-3 border-b border-[var(--card-border)]">
+                    <div className="text-[10px] font-semibold text-red-400 uppercase tracking-widest mb-1">Error</div>
+                    <pre className="text-xs text-red-300 whitespace-pre-wrap font-mono">{run.error}</pre>
+                  </div>
+                )}
+                {run.output && (
+                  <div className="px-4 py-3">
+                    <div className="text-[10px] font-semibold text-[var(--muted-foreground)] uppercase tracking-widest mb-1">Output</div>
+                    <pre className="text-xs text-[var(--foreground)] whitespace-pre-wrap font-mono max-h-[300px] overflow-y-auto">{run.output}</pre>
+                  </div>
+                )}
+              </div>
+            )}
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}

package/cloud-runtime/standalone/apps/local/components/linear/TicketRow.tsx

@@ -0,0 +1,158 @@
+"use client";
+
+import React, { useState, useCallback, useEffect, useRef } from "react";
+import { Check, ExternalLink, Link2, Pin } from "lucide-react";
+import type { LinearIssue } from "@/hooks/useLinearIssues";
+import type { Participant } from "@/lib/types";
+import { STATUS_LABELS } from "@/lib/linear-run-status";
+import { agentAvatarUrl, openLinearIssueTab } from "@/lib/linear-board-utils";
+
+export function TicketRow({
+  issue,
+  selected,
+  pinned,
+  onSelect,
+  onTogglePin,
+  activeAgents,
+  participants,
+}: {
+  issue: LinearIssue;
+  selected: boolean;
+  pinned?: boolean;
+  onSelect: () => void;
+  onTogglePin?: () => void;
+  activeAgents?: Array<{ agentId: string; agentName: string }>;
+  participants?: Participant[];
+}) {
+  const [copied, setCopied] = useState(false);
+  const copyResetTimeoutRef = useRef<number | null>(null);
+
+  useEffect(() => {
+    return () => {
+      if (copyResetTimeoutRef.current) {
+        window.clearTimeout(copyResetTimeoutRef.current);
+      }
+    };
+  }, []);
+
+  const handleCopyUrl = useCallback(async (event: React.MouseEvent<HTMLButtonElement>) => {
+    event.stopPropagation();
+    if (!issue.url) {
+      return;
+    }
+
+    try {
+      await navigator.clipboard.writeText(issue.url);
+      setCopied(true);
+      if (copyResetTimeoutRef.current) {
+        window.clearTimeout(copyResetTimeoutRef.current);
+      }
+      copyResetTimeoutRef.current = window.setTimeout(() => {
+        setCopied(false);
+      }, 1500) as unknown as number;
+    } catch (error) {
+      console.error("Failed to copy Linear issue URL:", error);
+      setCopied(false);
+    }
+  }, [issue.url]);
+
+  const handleOpenIssue = useCallback((event: React.MouseEvent<HTMLButtonElement>) => {
+    event.stopPropagation();
+    if (!issue.url) {
+      return;
+    }
+    openLinearIssueTab(issue.url);
+  }, [issue.url]);
+
+  const shortStatus = STATUS_LABELS[issue.status] ?? issue.status.slice(0, 6);
+  return (
+    <div
+      className={`group relative flex cursor-pointer items-center gap-3 px-4 py-2.5 text-sm transition-colors ${
+        selected
+          ? "bg-[var(--card-bg)]"
+          : "hover:bg-[var(--card-bg)]/50"
+      }`}
+      onClick={onSelect}
+      role="button"
+      tabIndex={0}
+      onKeyDown={(event) => {
+        if (event.key === "Enter" || event.key === " ") {
+          event.preventDefault();
+          onSelect();
+        }
+      }}
+    >
+      {selected && (
+        <div className="absolute left-0 top-0 bottom-0 w-[3px] rounded-r-full bg-blue-500" />
+      )}
+      <span className="w-24 shrink-0 whitespace-nowrap font-mono text-xs text-[var(--muted-foreground)]">
+        {issue.identifier}
+      </span>
+      <span className={`min-w-0 flex-1 truncate text-xs ${selected ? "font-medium text-[var(--foreground)]" : "text-[var(--muted-foreground)]"}`}>
+        {issue.title}
+      </span>
+      <span className="shrink-0 text-xs text-[var(--muted-foreground)]">
+        {shortStatus}
+      </span>
+      {activeAgents && activeAgents.length > 0 && (
+        <span className="inline-flex items-center -space-x-1 shrink-0">
+          {activeAgents.slice(0, 3).map((agent) => {
+            const participant = participants?.find((p) => p.id === agent.agentId);
+            return (
+              <span key={agent.agentId} className="relative inline-block" title={participant?.name ?? agent.agentName}>
+                <img src={agentAvatarUrl(agent.agentId, participant?.color, 16)} alt={participant?.name ?? agent.agentName} className="h-3 w-3 rounded-full ring-[1.5px] ring-[var(--app-shell-pane)]" />
+                <span className="absolute -bottom-px -right-px h-1.5 w-1.5 rounded-full bg-green-500 ring-[1px] ring-[var(--app-shell-pane)]" />
+              </span>
+            );
+          })}
+        </span>
+      )}
+      <div className="flex shrink-0 items-center gap-1">
+        {onTogglePin && (
+          <button
+            type="button"
+            className={`flex h-6 w-6 shrink-0 items-center justify-center rounded transition-all hover:bg-zinc-700 hover:text-[var(--foreground)] ${
+              pinned
+                ? "text-amber-400 opacity-100"
+                : `text-[var(--muted-foreground)] ${selected ? "opacity-100" : "opacity-0 group-hover:opacity-100"}`
+            }`}
+            onClick={(event) => {
+              event.stopPropagation();
+              onTogglePin();
+            }}
+            title={pinned ? "Unpin ticket" : "Pin to top"}
+            aria-label={pinned ? "Unpin ticket" : "Pin to top"}
+          >
+            <Pin size={10} className={pinned ? "fill-current" : ""} />
+          </button>
+        )}
+        <button
+          type="button"
+          className={`flex h-6 w-6 shrink-0 items-center justify-center rounded text-[var(--muted-foreground)] transition-all hover:bg-zinc-700 hover:text-[var(--foreground)] ${
+            selected ? "opacity-100" : "opacity-0 group-hover:opacity-100"
+          } ${issue.url ? "" : "cursor-not-allowed opacity-40 hover:bg-transparent hover:text-[var(--muted-foreground)]"}`}
+          onClick={(event) => {
+            void handleCopyUrl(event);
+          }}
+          title={copied ? "Copied ticket URL" : "Copy ticket URL"}
+          aria-label={copied ? "Copied ticket URL" : "Copy ticket URL"}
+          disabled={!issue.url}
+        >
+          {copied ? <Check size={10} className="text-emerald-400" /> : <Link2 size={10} />}
+        </button>
+        <button
+          type="button"
+          className={`flex h-6 w-6 shrink-0 items-center justify-center rounded text-[var(--muted-foreground)] transition-all hover:bg-zinc-700 hover:text-[var(--foreground)] ${
+            selected ? "opacity-100" : "opacity-0 group-hover:opacity-100"
+          } ${issue.url ? "" : "cursor-not-allowed opacity-40 hover:bg-transparent hover:text-[var(--muted-foreground)]"}`}
+          onClick={handleOpenIssue}
+          title={issue.url ? "Open this Linear ticket in a new tab" : "This ticket does not have a Linear URL"}
+          aria-label={issue.url ? "Open this Linear ticket in a new tab" : "This ticket does not have a Linear URL"}
+          disabled={!issue.url}
+        >
+          <ExternalLink size={10} />
+        </button>
+      </div>
+    </div>
+  );
+}

package/cloud-runtime/standalone/apps/local/components/projects/ObjectiveHealthTrend.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import {
   buildObjectiveHealthHistoryFromActivities,
   mergeObjectiveHealthSamples,
@@ -23,19 +23,19 @@ interface ObjectiveHealthTrendProps {
 const STATUS_META: Record<ProjectObjectiveHealth, { label: string; stroke: string }> = {
   on_track: {
     label: "On track",
-    stroke: "var(--status-completed-text)",
+    stroke: "var(--status-completed)",
   },
   at_risk: {
     label: "At risk",
-    stroke: "var(--status-blocked-text)",
+    stroke: "var(--status-blocked)",
   },
   off_track: {
     label: "Off track",
-    stroke: "var(--status-failed-text)",
+    stroke: "var(--status-failed)",
   },
   done: {
     label: "Done",
-    stroke: "var(--status-in-progress-text)",
+    stroke: "var(--status-in-progress)",
   },
 };
 
@@ -51,20 +51,19 @@ function formatUpdateLabel(iso: string): string {
 function buildPolylinePoints(samples: ObjectiveHealthSample[], width: number, height: number): string {
   const leftPad = 6;
   const rightPad = 6;
-  const topPad = 6;
-  const bottomPad = 6;
+  const topPad = 2;
   const xSpan = Math.max(1, width - leftPad - rightPad);
-  const ySpan = Math.max(1, height - topPad - bottomPad);
+  const ySpan = Math.max(1, height - topPad);
 
   if (samples.length === 1) {
-    const progressY = height - bottomPad - (samples[0].progress / 100) * ySpan;
-    return `${width / 2},${progressY}`;
+    const progressY = height - (samples[0].progress / 100) * ySpan;
+    return `${leftPad},${progressY} ${width - rightPad},${progressY}`;
   }
 
   return samples
     .map((sample, index) => {
       const x = leftPad + (index / Math.max(1, samples.length - 1)) * xSpan;
-      const y = height - bottomPad - (sample.progress / 100) * ySpan;
+      const y = height - (sample.progress / 100) * ySpan;
       return `${x},${y}`;
     })
     .join(" ");
@@ -136,9 +135,14 @@ export function ObjectiveHealthTrend(props: ObjectiveHealthTrendProps) {
     };
   }, [historyFromMetadata, objectiveId, objectiveKey, projectId]);
 
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    const frame = requestAnimationFrame(() => setMounted(true));
+    return () => cancelAnimationFrame(frame);
+  }, []);
+
   const plottedSamples = mergeObjectiveHealthSamples(samples, [currentSample]);
   const latestSample = plottedSamples[plottedSamples.length - 1];
-  const polylinePoints = buildPolylinePoints(plottedSamples, 180, 52);
   const statusMeta = STATUS_META[latestSample.status];
   const sampleCountLabel = samples.length === 0
     ? "Current state"
@@ -149,65 +153,45 @@ export function ObjectiveHealthTrend(props: ObjectiveHealthTrendProps) {
   return (
     <div
       data-testid="objective-health-trend"
-      className="flex min-w-[260px] flex-1 items-center gap-4 rounded-2xl border border-[var(--border)] bg-[var(--overlay-panel-muted)] px-4 py-3"
+      className="ml-auto inline-flex items-center gap-3 rounded-xl border border-[var(--border)] bg-[var(--overlay-panel-muted)] px-3 py-2"
     >
-      <div className="min-w-[84px]">
+      <div>
         <div className="text-[10px] font-semibold uppercase tracking-[0.16em] text-[var(--muted-foreground)]">
           Objective health
         </div>
-        <div className="mt-1 text-[24px] font-semibold leading-none text-[var(--foreground)]">
+        <div className="mt-0.5 text-[20px] font-semibold leading-none text-[var(--foreground)]">
           {latestSample.progress}%
         </div>
-        <div className="mt-1 text-[11px] font-medium" style={{ color: statusMeta.stroke }}>
+        <div className="mt-0.5 text-[10px] font-medium" style={{ color: statusMeta.stroke }}>
           {statusMeta.label}
         </div>
       </div>
 
-      <div className="min-w-0 flex-1">
-        <svg
-          viewBox="0 0 180 52"
-          className="h-[52px] w-full overflow-visible"
-          role="img"
-          aria-label="Objective health trend"
-        >
-          <line
-            x1="6"
-            y1="26"
-            x2="174"
-            y2="26"
-            stroke="var(--border)"
-            strokeDasharray="3 3"
-            strokeWidth="1"
-          />
-          <polyline
-            fill="none"
-            stroke={statusMeta.stroke}
-            strokeWidth="2.5"
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            points={polylinePoints}
-          />
-          {plottedSamples.map((sample, index) => {
-            const pointString = polylinePoints.split(" ")[index] ?? "";
-            const [cx = "0", cy = "0"] = pointString.split(",");
-            return (
-              <circle
-                key={`${sample.recordedAt}-${index}`}
-                cx={cx}
-                cy={cy}
-                r={index === plottedSamples.length - 1 ? 4 : 3}
-                fill={statusMeta.stroke}
-                fillOpacity={index === plottedSamples.length - 1 ? 1 : 0.2}
-                stroke={statusMeta.stroke}
-                strokeWidth="1.5"
-              />
-            );
-          })}
-        </svg>
-
-        <div className="mt-1 flex items-center justify-between gap-2 text-[10px] text-[var(--muted-foreground)]">
-          <span>{sampleCountLabel}</span>
-          <span>{formatUpdateLabel(latestSample.recordedAt)}</span>
+      <div
+        className="h-[40px] w-[14px] overflow-hidden rounded-sm"
+        style={{ background: "var(--muted)" }}
+        role="progressbar"
+        aria-valuenow={latestSample.progress}
+        aria-valuemin={0}
+        aria-valuemax={100}
+        aria-label="Objective health"
+        title={`${latestSample.progress}%`}
+      >
+        <div className="flex h-full flex-col justify-end">
+          <div
+            className="relative w-full overflow-hidden rounded-sm transition-[height] duration-700 ease-out"
+            style={{
+              height: mounted ? `${latestSample.progress}%` : "0%",
+              backgroundColor: statusMeta.stroke,
+            }}
+          >
+            <div
+              className="absolute inset-0 animate-pulse"
+              style={{
+                background: `linear-gradient(0deg, transparent 0%, rgba(255,255,255,0.15) 50%, transparent 100%)`,
+              }}
+            />
+          </div>
         </div>
       </div>
     </div>

package/cloud-runtime/standalone/apps/local/components/projects/ObjectiveScheduledTasksPanel.tsx

@@ -577,41 +577,45 @@ export function ObjectiveScheduledTasksPanel({
                 const isFailed = run.status === "failed";
                 const isRunning = run.status === "running";
                 return (
-                  <div
-                    key={run.id}
-                    className="flex items-center gap-3 py-2 px-2 rounded-md text-xs"
-                  >
-                    <span
-                      className={`flex size-5 shrink-0 items-center justify-center rounded-full border ${
-                        isSuccess
-                          ? "border-emerald-500/40 text-emerald-400"
-                          : isFailed
-                            ? "border-[var(--status-failed-border)] text-[var(--destructive)]"
-                            : isRunning
-                              ? "border-sky-500/40 text-sky-400"
-                              : "border-[var(--border)] text-[var(--muted-foreground)]"
-                      }`}
-                    >
-                      {isSuccess ? (
-                        <Check className="h-3 w-3" />
-                      ) : isFailed ? (
-                        <XCircle className="h-3 w-3" />
-                      ) : (
-                        <span className={`block size-1.5 rounded-full ${isRunning ? "bg-sky-400 animate-pulse" : "bg-current"}`} />
-                      )}
-                    </span>
-                    <span className="truncate text-[var(--muted-foreground)]">
-                      {run.jobName}
-                    </span>
-                    <span className="ml-auto shrink-0 text-[11px] text-[var(--muted-foreground)]">
-                      {formatDateTime(ts)}
-                    </span>
-                    {run.durationMs != null && (
-                      <span className="shrink-0 font-mono text-[11px] text-[var(--muted-foreground)]">
-                        {run.durationMs < 1000
-                          ? `${run.durationMs}ms`
-                          : `${Math.round(run.durationMs / 1000)}s`}
+                  <div key={run.id} className="py-2 px-2 rounded-md text-xs">
+                    <div className="flex items-center gap-3">
+                      <span
+                        className={`flex size-5 shrink-0 items-center justify-center rounded-full border ${
+                          isSuccess
+                            ? "border-emerald-500/40 text-emerald-400"
+                            : isFailed
+                              ? "border-[var(--status-failed-border)] text-[var(--destructive)]"
+                              : isRunning
+                                ? "border-sky-500/40 text-sky-400"
+                                : "border-[var(--border)] text-[var(--muted-foreground)]"
+                        }`}
+                      >
+                        {isSuccess ? (
+                          <Check className="h-3 w-3" />
+                        ) : isFailed ? (
+                          <XCircle className="h-3 w-3" />
+                        ) : (
+                          <span className={`block size-1.5 rounded-full ${isRunning ? "bg-sky-400 animate-pulse" : "bg-current"}`} />
+                        )}
                       </span>
+                      <span className="truncate text-[var(--muted-foreground)]">
+                        {run.jobName}
+                      </span>
+                      <span className="ml-auto shrink-0 text-[11px] text-[var(--muted-foreground)]">
+                        {formatDateTime(ts)}
+                      </span>
+                      {run.durationMs != null && (
+                        <span className="shrink-0 font-mono text-[11px] text-[var(--muted-foreground)]">
+                          {run.durationMs < 1000
+                            ? `${run.durationMs}ms`
+                            : `${Math.round(run.durationMs / 1000)}s`}
+                        </span>
+                      )}
+                    </div>
+                    {isFailed && run.error && (
+                      <p className="mt-1 ml-8 text-[11px] leading-snug text-[var(--destructive)] opacity-80 line-clamp-2">
+                        {run.error}
+                      </p>
                     )}
                   </div>
                 );

package/cloud-runtime/standalone/apps/local/components/projects/RecentlyCompletedCard.tsx

@@ -157,7 +157,6 @@ export function RecentlyCompletedCard({
         <table className="min-w-full text-sm">
           <thead className="bg-[var(--secondary)]">
             <tr className="text-left text-[11px] uppercase tracking-[0.18em] text-[var(--muted-foreground)]">
-              <th className="px-4 py-3 font-medium">Team</th>
               <th className="px-4 py-3 font-medium">Agent</th>
               <th className="px-4 py-3 font-medium">Status</th>
               <th className="px-4 py-3 font-medium">Thread</th>
@@ -177,21 +176,6 @@ export function RecentlyCompletedCard({
                   )
                 }
               >
-                <td className="px-4 py-3">
-                  {agentTeamMap.has(process.agentId) ? (
-                    <button
-                      onClick={(event) => {
-                        event.stopPropagation();
-                        router.push(`/projects/${projectSlug}/teams/${agentTeamMap.get(process.agentId)!.id}`);
-                      }}
-                      className="text-left font-medium text-[var(--foreground)] transition-colors hover:text-[var(--primary)]"
-                    >
-                      {agentTeamMap.get(process.agentId)!.name}
-                    </button>
-                  ) : (
-                    <span className="text-[var(--muted-foreground)]">Unassigned</span>
-                  )}
-                </td>
                 <td className="px-4 py-3 text-[var(--foreground)]">{getAgentName(process.agentId)}</td>
                 <td className="px-4 py-3">
                   <span className="inline-flex items-center gap-1.5 rounded-full border border-[var(--border)] bg-[var(--secondary)] px-2 py-0.5 text-[11px] font-medium text-[var(--muted-foreground)]">

package/cloud-runtime/standalone/apps/local/components/projects/ReplaceAgentsModal.tsx

@@ -263,7 +263,7 @@ export default function ReplaceAgentsModal({
                       <div className="w-5 h-5 rounded-md flex items-center justify-center flex-shrink-0 bg-emerald-500/15">
                         <Check className="w-3 h-3 text-emerald-400" />
                       </div>
-                      <span className="text-sm font-medium truncate">{preset.name}</span>
+                      <span className="text-sm font-medium truncate">{preset.role}</span>
                       <span className="text-[10px] px-1.5 py-0.5 rounded-full flex-shrink-0" style={{ background: "var(--card-bg)", color: "var(--muted-foreground)" }}>
                         {preset.skillProfileId}
                       </span>
@@ -316,7 +316,7 @@ export default function ReplaceAgentsModal({
                     onMouseLeave={(e) => { e.currentTarget.style.borderColor = "var(--border)"; e.currentTarget.style.color = "var(--muted-foreground)"; }}
                   >
                     <Plus className="w-3 h-3" />
-                    {preset.name}
+                    {preset.role}
                   </button>
                 ))}
                 {availablePresets.length === 0 && (