@geminilight/mindos 0.6.73 → 0.6.74

package/_standalone/components/panels/AgentsPanel.tsx

@@ -1,203 +0,0 @@
-'use client';
-
-import { useState } from 'react';
-import { useRouter, usePathname, useSearchParams } from 'next/navigation';
-import { Globe, Loader2, RefreshCw, Settings } from 'lucide-react';
-import { useMcpData } from '@/lib/stores/mcp-store';
-import { useA2aRegistry } from '@/hooks/useA2aRegistry';
-import { useLocale } from '@/lib/stores/locale-store';
-import PanelHeader from './PanelHeader';
-import { AgentsPanelHubNav } from './AgentsPanelHubNav';
-import { AgentsPanelAgentGroups } from './AgentsPanelAgentGroups';
-import DiscoverAgentModal from '../agents/DiscoverAgentModal';
-import IMChannelsView from './IMChannelsView';
-
-interface AgentsPanelProps {
-  active: boolean;
-  maximized?: boolean;
-  onMaximize?: () => void;
-  selectedAgentKey?: string | null;
-}
-
-export default function AgentsPanel({
-  active,
-  maximized,
-  onMaximize,
-  selectedAgentKey = null,
-}: AgentsPanelProps) {
-  const { t } = useLocale();
-  const p = t.panels.agents;
-  const router = useRouter();
-  const mcp = useMcpData();
-  const pathname = usePathname();
-  const searchParams = useSearchParams();
-  const isChannelsTab = pathname === '/agents' && searchParams.get('tab') === 'channels';
-  const [refreshing, setRefreshing] = useState(false);
-  const [showNotDetected, setShowNotDetected] = useState(false);
-  const [showDiscoverModal, setShowDiscoverModal] = useState(false);
-  const a2a = useA2aRegistry();
-
-  const handleRefresh = async () => {
-    setRefreshing(true);
-    await mcp.refresh();
-    setRefreshing(false);
-  };
-
-  const handleChannelsClick = () => {
-    router.push('/agents?tab=channels');
-  };
-
-  const openAdvancedConfig = () => {
-    window.dispatchEvent(new CustomEvent('mindos:open-settings', { detail: { tab: 'mcp' } }));
-  };
-
-  const connected = mcp.agents.filter(a => a.present && a.installed);
-  const detected = mcp.agents.filter(a => a.present && !a.installed);
-  const notFound = mcp.agents.filter(a => !a.present);
-
-  const installAgentWithRefresh = async (key: string) => {
-    const ok = await mcp.installAgent(key);
-    if (ok) await mcp.refresh();
-    return ok;
-  };
-
-  const routeSelectedAgentKey = pathname?.startsWith('/agents/')
-    ? decodeURIComponent(pathname.slice('/agents/'.length))
-    : null;
-  const effectiveSelectedAgentKey = routeSelectedAgentKey ?? selectedAgentKey;
-
-  const listCopy = {
-    installing: p.installing,
-    install: p.install,
-    installSuccess: p.installSuccess,
-    installFailed: p.installFailed,
-    retryInstall: p.retryInstall,
-  };
-
-  const hubCopy = {
-    navOverview: p.navOverview,
-    navMcp: p.navMcp,
-    navSkills: p.navSkills,
-    navChannels: p.channels,
-    navNetwork: p.navNetwork,
-    navSessions: p.navSessions,
-    navActivity: p.navActivity,
-  };
-
-  const hub = (
-    <AgentsPanelHubNav
-      copy={hubCopy}
-      connectedCount={connected.length}
-      mcpEnabled={mcp.status?.connectionMode?.mcp ?? false}
-      channelsActive={isChannelsTab}
-      onChannelsClick={handleChannelsClick}
-    />
-  );
-
-  return (
-    <div className={`flex flex-col h-full ${active ? '' : 'hidden'}`}>
-      <PanelHeader title={p.title} maximized={maximized} onMaximize={onMaximize}>
-        <div className="flex items-center gap-1.5">
-          {!mcp.loading && (
-            <span className="text-2xs text-muted-foreground">
-              {connected.length} {p.connected}
-              {a2a.agents.length > 0 && (
-                <> &middot; {p.a2aLabel} {a2a.agents.length}</>
-              )}
-            </span>
-          )}
-          <button
-            onClick={handleRefresh}
-            disabled={refreshing}
-            className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground disabled:opacity-50 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-            aria-label={p.refresh}
-            title={p.refresh}
-            type="button"
-          >
-            <RefreshCw size={12} className={refreshing ? 'animate-spin' : ''} />
-          </button>
-        </div>
-      </PanelHeader>
-
-      <div className="flex-1 overflow-y-auto min-h-0">
-        {mcp.loading ? (
-          <div className="flex justify-center py-8">
-            <Loader2 size={16} className="animate-spin text-muted-foreground" />
-          </div>
-        ) : mcp.agents.length === 0 && mcp.skills.length === 0 ? (
-          <div className="flex flex-col gap-2 py-4 px-0">
-            {hub}
-            <div className="mx-4 border-t border-border" />
-            <div className="mx-3 rounded-lg border border-border/40 bg-card/30 px-3 py-5 text-center">
-              <p className="text-xs text-muted-foreground/70 mb-1.5">{p.noAgents}</p>
-              <p className="text-2xs text-muted-foreground/40 mb-3">{p.skillsEmptyHint}</p>
-              <button
-                onClick={handleRefresh}
-                type="button"
-                className="inline-flex items-center gap-1.5 px-2.5 py-1.5 text-xs rounded-lg border border-border text-muted-foreground hover:text-foreground hover:bg-muted transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-              >
-                <RefreshCw size={11} /> {p.retry}
-              </button>
-            </div>
-          </div>
-        ) : (
-          <div className="pb-3">
-            {hub}
-
-            <div className="mx-4 border-t border-border" />
-
-            {isChannelsTab ? (
-              <IMChannelsView />
-            ) : (
-            <div className="px-3 py-3 space-y-4">
-              <AgentsPanelAgentGroups
-                connected={connected}
-                detected={detected}
-                notFound={notFound}
-                selectedAgentKey={effectiveSelectedAgentKey}
-                listCopy={listCopy}
-                onInstallAgent={installAgentWithRefresh}
-                showNotDetected={showNotDetected}
-                setShowNotDetected={setShowNotDetected}
-                p={{
-                  rosterLabel: p.rosterLabel,
-                  sectionConnected: p.sectionConnected,
-                  sectionDetected: p.sectionDetected,
-                  sectionNotDetected: p.sectionNotDetected,
-                }}
-              />
-            </div>
-            )}
-          </div>
-        )}
-      </div>
-
-      <div className="px-3 py-2 border-t border-border shrink-0 space-y-1">
-        <button
-          type="button"
-          onClick={() => setShowDiscoverModal(true)}
-          className="flex items-center gap-1.5 text-2xs text-muted-foreground hover:text-foreground transition-colors w-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm"
-        >
-          <Globe size={11} />
-          {p.a2aDiscover}
-        </button>
-        <button
-          type="button"
-          onClick={openAdvancedConfig}
-          className="flex items-center gap-1.5 text-2xs text-muted-foreground hover:text-foreground transition-colors w-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm"
-        >
-          <Settings size={11} />
-          {p.advancedConfig}
-        </button>
-      </div>
-
-      <DiscoverAgentModal
-        open={showDiscoverModal}
-        onClose={() => setShowDiscoverModal(false)}
-        onDiscover={a2a.discover}
-        discovering={a2a.discovering}
-        error={a2a.error}
-      />
-    </div>
-  );
-}

package/_standalone/components/panels/AgentsPanelAgentDetail.tsx

@@ -1,191 +0,0 @@
-'use client';
-
-import { useState, useMemo } from 'react';
-import { ChevronLeft, X, Loader2, CheckCircle2, AlertCircle, Copy, Monitor, Globe } from 'lucide-react';
-import { toast } from '@/lib/toast';
-import { generateSnippet } from '@/lib/mcp-snippets';
-import { copyToClipboard } from '@/lib/clipboard';
-import type { AgentInfo, McpStatus } from '../settings/types';
-import type { AgentsPanelAgentDetailStatus } from './agents-panel-resolve-status';
-
-export type { AgentsPanelAgentDetailStatus };
-
-export interface AgentsPanelAgentDetailCopy {
-  connected: string;
-  installing: string;
-  install: string;
-  installFailed: string;
-  copyConfig: string;
-  copied: string;
-  transportLocal: string;
-  transportRemote: string;
-  configPath: string;
-  notFoundDetail: string;
-  backToList: string;
-  /** Close button (dock header) — aria-label */
-  closeDetail?: string;
-  agentDetailTransport: string;
-  agentDetailSnippet: string;
-}
-
-export default function AgentsPanelAgentDetail({
-  agent,
-  agentStatus,
-  mcpStatus,
-  onBack,
-  onInstallAgent,
-  copy,
-  headerVariant = 'inline',
-}: {
-  agent: AgentInfo;
-  agentStatus: AgentsPanelAgentDetailStatus;
-  mcpStatus: McpStatus | null;
-  onBack: () => void;
-  onInstallAgent: (key: string) => Promise<boolean>;
-  copy: AgentsPanelAgentDetailCopy;
-  /** `dock`: right-side sheet title + X. `inline`: back chevron (legacy sidebar drill). */
-  headerVariant?: 'inline' | 'dock';
-}) {
-  const [installing, setInstalling] = useState(false);
-  const [result, setResult] = useState<{ type: 'success' | 'error'; text: string } | null>(null);
-  const [transport, setTransport] = useState<'stdio' | 'http'>(() => agent.preferredTransport);
-
-  const snippet = useMemo(() => {
-    if (agentStatus === 'notFound') return null;
-    return generateSnippet(agent, mcpStatus, transport);
-  }, [agent, mcpStatus, transport, agentStatus]);
-
-  const handleInstall = async () => {
-    setInstalling(true);
-    setResult(null);
-    const ok = await onInstallAgent(agent.key);
-    setResult(
-      ok
-        ? { type: 'success', text: `${agent.name} ${copy.connected}` }
-        : { type: 'error', text: copy.installFailed },
-    );
-    setInstalling(false);
-  };
-
-  const handleCopy = async () => {
-    if (!snippet) return;
-    const ok = await copyToClipboard(snippet.snippet);
-    if (ok) toast.copy();
-  };
-
-  const dot =
-    agentStatus === 'connected' ? 'bg-[var(--success)]' : agentStatus === 'detected' ? 'bg-[var(--amber)]' : 'bg-muted-foreground';
-
-  return (
-    <div className="flex flex-col h-full min-h-0">
-      {headerVariant === 'dock' ? (
-        <header className="shrink-0 flex items-center justify-between gap-3 border-b border-border px-4 py-3 bg-card">
-          <div className="flex items-center gap-2.5 min-w-0">
-            <span className={`w-2 h-2 rounded-full shrink-0 ${dot}`} />
-            <h2 className="text-sm font-semibold text-foreground truncate" title={agent.name}>{agent.name}</h2>
-          </div>
-          <button
-            type="button"
-            onClick={onBack}
-            className="p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-muted transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring shrink-0"
-            aria-label={copy.closeDetail ?? 'Close'}
-          >
-            <X size={16} />
-          </button>
-        </header>
-      ) : (
-        <div className="sticky top-0 z-10 flex items-center gap-2 border-b border-border bg-background/95 px-3 py-2.5 backdrop-blur-sm shrink-0">
-          <button
-            type="button"
-            onClick={onBack}
-            className="flex items-center gap-1 text-2xs text-muted-foreground hover:text-foreground rounded-md px-1 py-1 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring shrink-0"
-          >
-            <ChevronLeft size={16} />
-            {copy.backToList}
-          </button>
-          <span className={`w-1.5 h-1.5 rounded-full shrink-0 ${dot}`} />
-          <span className="text-sm font-medium text-foreground truncate" title={agent.name}>{agent.name}</span>
-        </div>
-      )}
-
-      <div className="px-4 py-4 space-y-4 flex-1 min-h-0 overflow-y-auto">
-        {agentStatus === 'detected' && (
-          <div className="flex flex-wrap items-center gap-2">
-            <button
-              type="button"
-              onClick={handleInstall}
-              disabled={installing}
-              className="inline-flex items-center gap-1.5 px-3 py-2 text-xs rounded-lg font-medium text-[var(--amber-foreground)] disabled:opacity-50 bg-[var(--amber)] hover:bg-[var(--amber)]/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-            >
-              {installing ? <Loader2 size={14} className="animate-spin" /> : null}
-              {installing ? copy.installing : copy.install}
-            </button>
-            {result && (
-              <span
-                className={`flex items-center gap-1 text-2xs ${result.type === 'success' ? 'text-success' : 'text-destructive'}`}
-              >
-                {result.type === 'success' ? <CheckCircle2 size={12} /> : <AlertCircle size={12} />}
-                {result.text}
-              </span>
-            )}
-          </div>
-        )}
-
-        {agentStatus === 'notFound' && (
-          <p className="text-sm text-muted-foreground leading-relaxed">{copy.notFoundDetail}</p>
-        )}
-
-        {agentStatus !== 'notFound' && snippet && (
-          <>
-            <div>
-              <p className="text-2xs font-medium text-muted-foreground uppercase tracking-wider mb-1">{copy.configPath}</p>
-              <p className="text-xs font-mono text-foreground break-all">{snippet.path}</p>
-            </div>
-
-            <div>
-              <p className="text-2xs font-medium text-muted-foreground uppercase tracking-wider mb-2">{copy.agentDetailTransport}</p>
-              <div className="flex items-center gap-1 p-0.5 rounded-lg bg-muted/40 w-fit">
-                <button
-                  type="button"
-                  onClick={() => setTransport('stdio')}
-                  className={`flex items-center gap-1.5 px-3 py-1.5 text-xs rounded-md transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${
-                    transport === 'stdio' ? 'bg-card shadow-sm text-foreground' : 'text-muted-foreground'
-                  }`}
-                >
-                  <Monitor size={13} />
-                  {copy.transportLocal}
-                </button>
-                <button
-                  type="button"
-                  onClick={() => setTransport('http')}
-                  className={`flex items-center gap-1.5 px-3 py-1.5 text-xs rounded-md transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${
-                    transport === 'http' ? 'bg-card shadow-sm text-foreground' : 'text-muted-foreground'
-                  }`}
-                >
-                  <Globe size={13} />
-                  {copy.transportRemote}
-                </button>
-              </div>
-            </div>
-
-            <div>
-              <p className="text-2xs font-medium text-muted-foreground uppercase tracking-wider mb-2">{copy.agentDetailSnippet}</p>
-              <pre className="text-[11px] font-mono bg-muted/50 border border-border rounded-lg p-3 overflow-x-auto whitespace-pre max-h-[min(320px,50vh)] overflow-y-auto select-all">
-                {snippet.displaySnippet}
-              </pre>
-            </div>
-
-            <button
-              type="button"
-              onClick={handleCopy}
-              className="inline-flex items-center gap-1.5 px-3 py-2 rounded-lg border border-border text-muted-foreground hover:text-foreground hover:bg-muted transition-colors text-xs focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-            >
-              <Copy size={14} />
-              {copy.copyConfig}
-            </button>
-          </>
-        )}
-      </div>
-    </div>
-  );
-}

package/_standalone/components/panels/AgentsPanelAgentGroups.tsx

@@ -1,113 +0,0 @@
-'use client';
-
-import { ChevronDown, ChevronRight } from 'lucide-react';
-import type { AgentInfo } from '../settings/types';
-import AgentsPanelAgentListRow, { type AgentsPanelAgentListRowCopy } from './AgentsPanelAgentListRow';
-
-type AgentsCopy = {
-  rosterLabel: string;
-  sectionConnected: string;
-  sectionDetected: string;
-  sectionNotDetected: string;
-};
-
-export function AgentsPanelAgentGroups({
-  connected,
-  detected,
-  notFound,
-  selectedAgentKey,
-  onInstallAgent,
-  listCopy,
-  showNotDetected,
-  setShowNotDetected,
-  p,
-}: {
-  connected: AgentInfo[];
-  detected: AgentInfo[];
-  notFound: AgentInfo[];
-  selectedAgentKey?: string | null;
-  onInstallAgent: (key: string) => Promise<boolean>;
-  listCopy: AgentsPanelAgentListRowCopy;
-  showNotDetected: boolean;
-  setShowNotDetected: (v: boolean | ((prev: boolean) => boolean)) => void;
-  p: AgentsCopy;
-}) {
-  return (
-    <div>
-      <div className="px-0 py-1.5 mb-1">
-        <span className="text-2xs font-semibold text-muted-foreground/70 uppercase tracking-wider">{p.rosterLabel}</span>
-      </div>
-      {connected.length > 0 && (
-        <section className="mb-3">
-          <h3 className="flex items-center gap-1.5 text-[11px] font-medium text-muted-foreground/80 uppercase tracking-wider mb-2 pl-0.5">
-            <span className="w-1 h-3 rounded-full bg-[var(--success)]/50" aria-hidden="true" />
-            {p.sectionConnected} <span className="text-muted-foreground/50 tabular-nums">({connected.length})</span>
-          </h3>
-          <div className="space-y-1.5">
-            {connected.map(agent => (
-              <AgentsPanelAgentListRow
-                key={agent.key}
-                agent={agent}
-                agentStatus="connected"
-                selected={selectedAgentKey === agent.key}
-                detailHref={`/agents/${encodeURIComponent(agent.key)}`}
-                onInstallAgent={onInstallAgent}
-                copy={listCopy}
-              />
-            ))}
-          </div>
-        </section>
-      )}
-
-      {detected.length > 0 && (
-        <section className="mb-3">
-          <h3 className="flex items-center gap-1.5 text-[11px] font-medium text-muted-foreground/80 uppercase tracking-wider mb-2 pl-0.5">
-            <span className="w-1 h-3 rounded-full bg-[var(--amber)]/50" aria-hidden="true" />
-            {p.sectionDetected} <span className="text-muted-foreground/50 tabular-nums">({detected.length})</span>
-          </h3>
-          <div className="space-y-1.5">
-            {detected.map(agent => (
-              <AgentsPanelAgentListRow
-                key={agent.key}
-                agent={agent}
-                agentStatus="detected"
-                selected={selectedAgentKey === agent.key}
-                detailHref={`/agents/${encodeURIComponent(agent.key)}`}
-                onInstallAgent={onInstallAgent}
-                copy={listCopy}
-              />
-            ))}
-          </div>
-        </section>
-      )}
-
-      {notFound.length > 0 && (
-        <section>
-          <button
-            type="button"
-            onClick={() => setShowNotDetected(!showNotDetected)}
-            className="flex items-center gap-1 text-[11px] font-medium text-muted-foreground uppercase tracking-wider mb-2 hover:text-foreground transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm pl-0.5"
-          >
-            {showNotDetected ? <ChevronDown size={12} /> : <ChevronRight size={12} />}
-            {p.sectionNotDetected} ({notFound.length})
-          </button>
-          {showNotDetected && (
-            <div className="space-y-1.5">
-              {notFound.map(agent => (
-                <AgentsPanelAgentListRow
-                  key={agent.key}
-                  agent={agent}
-                  agentStatus="notFound"
-                  selected={selectedAgentKey === agent.key}
-                  detailHref={`/agents/${encodeURIComponent(agent.key)}`}
-                  onInstallAgent={onInstallAgent}
-                  copy={listCopy}
-                />
-              ))}
-            </div>
-          )}
-        </section>
-      )}
-    </div>
-  );
-}

package/_standalone/components/panels/AgentsPanelAgentListRow.tsx

@@ -1,133 +0,0 @@
-'use client';
-
-import { useState } from 'react';
-import Link from 'next/link';
-import { Check, ChevronRight, Globe, Loader2, RotateCw } from 'lucide-react';
-import type { AgentInfo } from '../settings/types';
-import { AgentAvatar } from '../agents/AgentsPrimitives';
-
-export type AgentsPanelAgentListStatus = 'connected' | 'detected' | 'notFound';
-
-export interface AgentsPanelAgentListRowCopy {
-  installing: string;
-  install: string;
-  installSuccess: string;
-  installFailed: string;
-  retryInstall: string;
-}
-
-export default function AgentsPanelAgentListRow({
-  agent,
-  agentStatus,
-  selected = false,
-  detailHref,
-  onInstallAgent,
-  copy,
-  isA2aReady = false,
-  a2aTooltip,
-}: {
-  agent: AgentInfo;
-  agentStatus: AgentsPanelAgentListStatus;
-  selected?: boolean;
-  detailHref: string;
-  onInstallAgent: (key: string) => Promise<boolean>;
-  copy: AgentsPanelAgentListRowCopy;
-  isA2aReady?: boolean;
-  a2aTooltip?: string;
-}) {
-  return (
-    <div
-      className={`
-        group flex items-center gap-0 rounded-xl border transition-all duration-150
-        ${selected
-          ? 'border-border ring-2 ring-ring/50 bg-[var(--amber-dim)]/45'
-          : 'border-border/70 bg-card/50 hover:border-border hover:bg-muted/25'}
-      `}
-    >
-      <Link
-        href={detailHref}
-        className="flex flex-1 min-w-0 items-center gap-2.5 text-left rounded-xl pl-2.5 pr-2 py-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-      >
-        <AgentAvatar name={agent.name} status={agentStatus} size="sm" />
-        <span className="text-sm font-medium text-foreground truncate leading-tight">{agent.name}</span>
-        {agentStatus === 'connected' && agent.transport && (
-          <span className="text-2xs font-mono tabular-nums px-1.5 py-0.5 rounded-md bg-muted/90 text-muted-foreground shrink-0 border border-border/50">
-            {agent.transport}
-          </span>
-        )}
-        {isA2aReady && (
-          <span title={a2aTooltip} className="shrink-0 text-muted-foreground/70">
-            <Globe size={12} />
-          </span>
-        )}
-        <span className="flex-1 min-w-[4px]" />
-        <ChevronRight
-          size={15}
-          className={`shrink-0 transition-opacity duration-150 ${selected ? 'text-[var(--amber)] opacity-90' : 'text-muted-foreground/45 group-hover:text-muted-foreground/80'}`}
-          aria-hidden
-        />
-      </Link>
-
-      {agentStatus === 'detected' && (
-        <div className="pr-2 py-2 shrink-0">
-          <AgentInstallButton agentKey={agent.key} agentName={agent.name} onInstallAgent={onInstallAgent} copy={copy} />
-        </div>
-      )}
-    </div>
-  );
-}
-
-function AgentInstallButton({
-  agentKey,
-  agentName,
-  onInstallAgent,
-  copy,
-}: {
-  agentKey: string;
-  agentName: string;
-  onInstallAgent: (key: string) => Promise<boolean>;
-  copy: AgentsPanelAgentListRowCopy;
-}) {
-  const [installing, setInstalling] = useState(false);
-  const [installState, setInstallState] = useState<'idle' | 'success' | 'error'>('idle');
-
-  const handleInstall = async (e: React.MouseEvent) => {
-    e.stopPropagation();
-    if (installing) return;
-    setInstalling(true);
-    setInstallState('idle');
-    const ok = await onInstallAgent(agentKey);
-    setInstalling(false);
-    setInstallState(ok ? 'success' : 'error');
-  };
-
-  const isError = installState === 'error';
-  const isSuccess = installState === 'success';
-  const label = installing
-    ? copy.installing
-    : isSuccess
-      ? copy.installSuccess
-      : isError
-        ? copy.retryInstall
-        : copy.install;
-
-  return (
-    <button
-      type="button"
-      onClick={handleInstall}
-      disabled={installing}
-      className={`flex items-center gap-1 px-2 py-1.5 text-2xs rounded-lg font-medium text-white disabled:opacity-50 transition-colors shrink-0 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${
-        isError ? 'bg-error hover:bg-error/90' : isSuccess ? 'bg-success hover:bg-success/90' : 'bg-[var(--amber)] hover:bg-[var(--amber)]/90'
-      }`}
-      aria-label={`${agentName} ${label}`}
-    >
-      {installing ? <Loader2 size={10} className="animate-spin" /> : null}
-      {!installing && isSuccess ? <Check size={10} /> : null}
-      {!installing && isError ? <RotateCw size={10} /> : null}
-      {label}
-      <span className="sr-only" aria-live="polite">
-        {isError ? copy.installFailed : ''}
-      </span>
-    </button>
-  );
-}