plugin-scanner 2.0.149__tar.gz → 2.0.151__tar.gz

{plugin_scanner-2.0.149 → plugin_scanner-2.0.151}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: plugin-scanner
-Version: 2.0.149
+Version: 2.0.151
 Summary: Lint, verify, and gate plugin ecosystems for maintainers, CI, and publish workflows.
 Project-URL: Homepage, https://github.com/hashgraph-online/ai-plugin-scanner
 Project-URL: Repository, https://github.com/hashgraph-online/ai-plugin-scanner

{plugin_scanner-2.0.149 → plugin_scanner-2.0.151}/dashboard/src/app.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState, useCallback } from "react";
+import { useEffect, useState, useCallback, useRef } from "react";
 
 import {
   clearPolicy,
@@ -142,6 +142,7 @@ export function App() {
   const [policies, setPolicies] = useState<PolicyState>({ kind: "loading" });
   const [inventory, setInventory] = useState<InventoryState>({ kind: "idle" });
   const [resolutionMessage, setResolutionMessage] = useState<string | null>(null);
+  const resolutionInFlight = useRef(false);
 
   useEffect(() => {
     let cancelled = false;
@@ -149,13 +150,13 @@ export function App() {
     const loadRuntimeSnapshot = () => {
       fetchRuntimeSnapshot()
         .then((snapshot) => {
-          if (!cancelled) {
+          if (!cancelled && !resolutionInFlight.current) {
             setRuntime({ kind: "ready", snapshot });
             setRequests({ kind: "ready", items: snapshot.items });
           }
         })
         .catch((error: unknown) => {
-          if (!cancelled) {
+          if (!cancelled && !resolutionInFlight.current) {
             const message =
               error instanceof Error ? error.message : "Unable to load the local approval queue.";
             setRuntime({ kind: "error", message });
@@ -330,17 +331,22 @@ export function App() {
     workspace?: string;
     reason: string;
   }) => {
+    resolutionInFlight.current = true;
     const queuedItemsSnapshot = requests.kind === "ready" ? requests.items : [];
-    const result = await resolveRequestWithQueueResult(payload);
-    const nextId = selectNextAfterResolution(result, queuedItemsSnapshot);
-    if (nextId !== null) {
-      setResolutionMessage(null);
-      navigate(`/requests/${nextId}`);
-    } else {
-      setResolutionMessage(result.resolution_summary || "Decision saved. Return to your chat and retry the command.");
-      navigate("/inbox");
+    try {
+      const result = await resolveRequestWithQueueResult(payload);
+      const nextId = selectNextAfterResolution(result, queuedItemsSnapshot);
+      if (nextId !== null) {
+        setResolutionMessage(null);
+        navigate(`/requests/${nextId}`);
+      } else {
+        setResolutionMessage(result.resolution_summary || "Decision saved. Return to your chat and retry the command.");
+        navigate("/inbox");
+      }
+      await refreshStateAfterAction();
+    } finally {
+      resolutionInFlight.current = false;
     }
-    await refreshStateAfterAction();
   }, [requests, refreshStateAfterAction, setResolutionMessage]);
 
   const handleBulkApprove = useCallback(async (ids: string[]) => {
@@ -360,6 +366,34 @@ export function App() {
     await refreshStateAfterAction();
   }, [refreshStateAfterAction, setResolutionMessage]);
 
+  const handleRetry = useCallback(() => {
+    setRuntime({ kind: "loading" });
+    setRequests({ kind: "loading" });
+    fetchRuntimeSnapshot()
+      .then((snapshot) => {
+        setRuntime({ kind: "ready", snapshot });
+        setRequests({ kind: "ready", items: snapshot.items });
+      })
+      .catch((error: unknown) => {
+        const message =
+          error instanceof Error ? error.message : "Unable to load the local approval queue.";
+        setRuntime({ kind: "error", message });
+        setRequests({ kind: "error", message });
+      });
+  }, []);
+
+  const handleConnectHarness = useCallback((_harness: string) => {
+    navigate("/settings");
+  }, []);
+
+  const handleTestHarness = useCallback((_harness: string) => {
+    navigate("/inbox");
+  }, []);
+
+  const handleRepairHarness = useCallback((_harness: string) => {
+    navigate("/settings");
+  }, []);
+
   return (
     <ApprovalCenterLayout
       view={view}
@@ -387,12 +421,16 @@ export function App() {
       onOpenRequest={handleOpenRequest}
       onResolve={handleResolve}
       onBulkApprove={handleBulkApprove}
+      onRetry={handleRetry}
       fleetContent={
         runtime.kind === "ready" ? (
           <FleetWorkspace
             runtime={runtime.snapshot}
             policies={policies.kind === "ready" ? policies.items : []}
             inventory={inventory}
+            onConnectHarness={handleConnectHarness}
+            onTestHarness={handleTestHarness}
+            onRepairHarness={handleRepairHarness}
           />
         ) : null
       }

{plugin_scanner-2.0.149 → plugin_scanner-2.0.151}/dashboard/src/approval-center-layout.tsx

@@ -7,6 +7,10 @@ import {
   HiMiniNoSymbol,
   HiMiniArrowTopRightOnSquare,
   HiMiniChevronLeft,
+  HiBars3,
+  HiMiniXMark as HiMiniXMarkLayout,
+  HiMiniCheckCircle,
+  HiMiniInformationCircle,
 } from "react-icons/hi2";
 import {
   ShellHeader,
@@ -19,12 +23,13 @@ import {
   EmptyState,
   WelcomeState,
   SectionLabel,
-  ListControls,
   PaginationControls
 } from "./approval-center-primitives";
 import { DataFlowEvidenceCard } from "./data-flow-evidence-card";
 import { SkillRiskCard, SupplyChainRiskCard, DecodedLayerCard } from "./risk-signal-cards";
 import { ReceiptsWorkspace } from "./receipts-workspace";
+import { QueueChipFilter } from "./queue-chip-filter";
+import { ScannerEvidenceSection } from "./scanner-evidence-badge";
 import {
   buildPauseLine,
   buildRecommendation,
@@ -110,6 +115,7 @@ type LayoutProps = {
   onGoHome: () => void;
   onNavigate: (pathname: string) => void;
   onOpenRequest: (requestId: string) => void;
+  onRetry?: () => void;
   onResolve: (payload: {
     requestId: string;
     action: "allow" | "block";
@@ -132,9 +138,14 @@ const commonScopeValues = new Set<DecisionScope>(["artifact", "workspace"]);
 const broadScopeValues = new Set<DecisionScope>(["publisher", "harness", "global"]);
 const queuePageSize = 8;
 export function ApprovalCenterLayout(props: LayoutProps) {
+  const [mobileQueueOpen, setMobileQueueOpen] = useState(false);
   const queuedItems = props.requests.kind === "ready" ? props.requests.items : [];
   const activeHarness =
     props.detail.kind === "ready" ? props.detail.item.harness : queuedItems[0]?.harness ?? null;
+
+  const handleOpenMobileQueue = useCallback(() => setMobileQueueOpen(true), []);
+  const handleCloseMobileQueue = useCallback(() => setMobileQueueOpen(false), []);
+
   return (
     <div className="min-h-screen bg-white text-brand-dark">
       <ShellHeader
@@ -142,8 +153,18 @@ export function ApprovalCenterLayout(props: LayoutProps) {
         activeHarness={activeHarness}
         view={props.view}
         onNavigate={props.onNavigate}
+        onOpenMobileQueue={handleOpenMobileQueue}
       />
       <ShellSidebar queuedCount={queuedItems.length} activeHarness={activeHarness} view={props.view} />
+      {mobileQueueOpen && props.view === "inbox" && props.requests.kind === "ready" && (
+        <MobileQueueDrawer
+          requests={props.requests.items}
+          activeRequestId={props.activeRequestId}
+          onClose={handleCloseMobileQueue}
+          onOpenRequest={props.onOpenRequest}
+          onBulkApprove={props.onBulkApprove}
+        />
+      )}
       <div className="flex flex-col lg:pl-64">
         <main className="flex-1 p-6 lg:p-10">
           <div className="mx-auto max-w-6xl">
@@ -166,6 +187,7 @@ export function ApprovalCenterLayout(props: LayoutProps) {
                 onGoHome={props.onGoHome}
                 onResolve={props.onResolve}
                 onBulkApprove={props.onBulkApprove}
+                onRetry={props.onRetry}
               />
             )}
           </div>
@@ -175,6 +197,45 @@ export function ApprovalCenterLayout(props: LayoutProps) {
   );
 }
 
+function MobileQueueDrawer(props: {
+  requests: GuardApprovalRequest[];
+  activeRequestId: string | null;
+  onClose: () => void;
+  onOpenRequest: (requestId: string) => void;
+  onBulkApprove?: (ids: string[]) => void;
+}) {
+  return (
+    <div
+      className="fixed inset-0 z-50 flex lg:hidden"
+    >
+      <div className="absolute inset-0 bg-black/30 backdrop-blur-sm" onClick={props.onClose} />
+      <div className="relative ml-0 flex w-full max-w-sm flex-col overflow-hidden bg-white shadow-2xl" onClick={(e) => e.stopPropagation()}>
+        <div className="flex items-center justify-between border-b border-slate-200 px-4 py-3">
+          <span className="text-sm font-semibold text-brand-dark">
+            Review Queue ({props.requests.length})
+          </span>
+          <button
+            type="button"
+            onClick={props.onClose}
+            aria-label="Close queue"
+            className="rounded-full p-1.5 text-slate-500 hover:bg-slate-100"
+          >
+            <HiMiniXMarkLayout className="h-5 w-5" />
+          </button>
+        </div>
+        <div className="flex-1 overflow-y-auto">
+          <QueueBrowser
+            activeRequestId={props.activeRequestId}
+            items={props.requests}
+            onOpenRequest={props.onOpenRequest}
+            onBulkApprove={props.onBulkApprove}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}
+
 function QueueWorkspace(props: {
   requests: RequestState;
   detail: DetailState;
@@ -185,6 +246,7 @@ function QueueWorkspace(props: {
   onGoHome: () => void;
   onResolve: LayoutProps["onResolve"];
   onBulkApprove?: (ids: string[]) => void;
+  onRetry?: () => void;
 }) {
   if (props.requests.kind === "loading") {
     return (
@@ -195,10 +257,24 @@ function QueueWorkspace(props: {
     );
   }
   if (props.requests.kind === "error") {
+    const approvalUrl =
+      props.runtime.kind === "ready" ? props.runtime.snapshot.approval_center_url : null;
     return (
-      <Surface tone="danger">
-        <p className="text-sm text-brand-purple">{props.requests.message}</p>
-      </Surface>
+      <div className="space-y-4">
+        <Surface tone="danger">
+          <p className="text-sm text-brand-purple">{props.requests.message}</p>
+          <div className="mt-4 flex flex-wrap gap-3">
+            {props.onRetry && (
+              <ActionButton onClick={props.onRetry}>Retry</ActionButton>
+            )}
+            {approvalUrl && (
+              <ActionButton href={approvalUrl} variant="outline">
+                Open Guard dashboard
+              </ActionButton>
+            )}
+          </div>
+        </Surface>
+      </div>
     );
   }
   if (props.requests.items.length === 0) {
@@ -222,6 +298,12 @@ function QueueWorkspace(props: {
   );
   return (
     <div className="space-y-4">
+      {props.resolutionMessage && props.requests.items.length > 0 && (
+        <div className="flex items-start gap-3 rounded-2xl border border-brand-green/25 bg-brand-green-bg/30 px-4 py-3">
+          <HiMiniCheckCircle className="mt-0.5 h-4 w-4 shrink-0 text-brand-green" aria-hidden="true" />
+          <p className="text-sm font-medium text-brand-green-text">{props.resolutionMessage}</p>
+        </div>
+      )}
       <QueueHeader
         activeRequestId={props.activeRequestId}
         requests={props.requests.items}
@@ -329,6 +411,14 @@ function QueueBrowser(props: {
   const pageStart = (currentPage - 1) * queuePageSize;
   const visibleGroups = groups.slice(pageStart, pageStart + queuePageSize);
 
+  const allGroups = useMemo(() => groupDuplicates(props.items), [props.items]);
+  const nextUpItem = useMemo(() => {
+    if (allGroups.length < 2 || props.activeRequestId === null) return null;
+    const activeIdx = allGroups.findIndex((g) => g.primary.request_id === props.activeRequestId);
+    if (activeIdx < 0 || activeIdx >= allGroups.length - 1) return null;
+    return allGroups[activeIdx + 1]?.primary ?? null;
+  }, [allGroups, props.activeRequestId]);
+
   useEffect(() => {
     setPage(1);
   }, [harnessFilter, searchTerm, sortDirection, props.items.length]);
@@ -337,10 +427,6 @@ function QueueBrowser(props: {
     setSearchTerm(event.target.value);
   }, []);
 
-  const handleHarnessFilterChange = useCallback((event: ChangeEvent<HTMLSelectElement>) => {
-    setHarnessFilter(event.target.value);
-  }, []);
-
   const handleSortChange = useCallback((event: ChangeEvent<HTMLSelectElement>) => {
     setSortDirection(event.target.value as QueueSortDirection);
   }, []);
@@ -391,18 +477,24 @@ function QueueBrowser(props: {
           </button>
         </div>
       )}
-      <div className="mb-3 grid gap-2">
-        <ListControls
-          searchLabel="Search waiting actions"
-          searchValue={searchTerm}
-          searchPlaceholder="Command, file, MCP, host…"
-          filterLabel="Filter by app"
-          filterValue={harnessFilter}
-          filterOptions={harnesses}
-          allLabel="All apps"
-          onSearchChange={handleSearchChange}
-          onFilterChange={handleHarnessFilterChange}
-        />
+      <div className="mb-3 space-y-2">
+        <label className="block">
+          <span className="sr-only">Search waiting actions</span>
+          <input
+            type="search"
+            value={searchTerm}
+            onChange={handleSearchChange}
+            placeholder="Command, file, MCP, host…"
+            className="min-h-11 w-full rounded-lg border border-slate-200 bg-white px-3 text-sm text-brand-dark placeholder:text-slate-400 transition-colors duration-150 focus:border-brand-blue focus:outline-none focus:ring-2 focus:ring-brand-blue/20"
+          />
+        </label>
+        {harnesses.length > 1 && (
+          <QueueChipFilter
+            harnesses={harnesses}
+            activeFilter={harnessFilter}
+            onFilterChange={setHarnessFilter}
+          />
+        )}
         <label className="block">
           <span className="sr-only">Sort order</span>
           <select
@@ -422,6 +514,11 @@ function QueueBrowser(props: {
               key={group.primary.request_id}
               group={group}
               activeRequestId={props.activeRequestId}
+              nextUpItem={
+                nextUpItem !== null && group.primary.request_id === props.activeRequestId
+                  ? nextUpItem
+                  : null
+              }
               onOpenRequest={props.onOpenRequest}
             />
           ))
@@ -447,6 +544,7 @@ function QueueBrowser(props: {
 function QueueCardRow(props: {
   group: ReturnType<typeof groupDuplicates>[number];
   activeRequestId: string | null;
+  nextUpItem: GuardApprovalRequest | null;
   onOpenRequest: (requestId: string) => void;
 }) {
   const handleClick = useCallback(() => {
@@ -454,12 +552,22 @@ function QueueCardRow(props: {
   }, [props.onOpenRequest, props.group.primary.request_id]);
 
   return (
-    <QueueCard
-      item={props.group.primary}
-      duplicateCount={props.group.duplicateCount}
-      active={props.group.primary.request_id === props.activeRequestId}
-      onClick={handleClick}
-    />
+    <div>
+      <QueueCard
+        item={props.group.primary}
+        duplicateCount={props.group.duplicateCount}
+        active={props.group.primary.request_id === props.activeRequestId}
+        onClick={handleClick}
+      />
+      {props.nextUpItem !== null && (
+        <div className="border-t border-slate-100 bg-slate-50/60 px-4 py-2">
+          <p className="truncate text-[11px] text-muted-foreground">
+            <span className="font-semibold">Next up:</span>{" "}
+            {displayArtifactName(props.nextUpItem)}
+          </p>
+        </div>
+      )}
+    </div>
   );
 }
 
@@ -633,8 +741,19 @@ function DecisionWorkspace(props: {
   const { item, diff, receipt, policy } = props.detail;
   const commonScopeOpts = scopeOptions.filter((option) => commonScopeValues.has(option.value));
   const broadScopeOpts = scopeOptions.filter((option) => !commonScopeValues.has(option.value));
+  const isAlreadyDecided = item.resolution_action !== null;
+  const decidedLabel =
+    item.resolution_action === "allow" ? "allow" : item.resolution_action === "block" ? "block" : item.resolution_action ?? "decided";
   return (
     <div className="guard-surface-in space-y-4">
+      {isAlreadyDecided && (
+        <div className="flex items-start gap-3 rounded-2xl border border-slate-200/60 bg-slate-50 px-4 py-3">
+          <HiMiniInformationCircle className="mt-0.5 h-4 w-4 shrink-0 text-slate-400" aria-hidden="true" />
+          <p className="text-sm text-muted-foreground">
+            This action was already decided — {decidedLabel}. No further action needed.
+          </p>
+        </div>
+      )}
       {confirmPending !== null && (
         <ConfirmModal
           action={confirmPending}
@@ -655,13 +774,18 @@ function DecisionWorkspace(props: {
         onReasonChange={setReason}
         onResolve={handleRequestResolve}
       />
-      <ScannerEvidenceSection item={item} />
+      <ScannerEvidenceSectionFull item={item} />
       <WhatChanged item={item} diff={diff} receipt={receipt} policy={policy} />
     </div>
   );
 }
 
-function ScannerEvidenceSection(props: { item: GuardApprovalRequest }) {
+function InlineScannerSection(props: { item: GuardApprovalRequest }) {
+  const allSignals = props.item.decision_v2_json?.signals ?? [];
+  return <ScannerEvidenceSection signals={allSignals} />;
+}
+
+function ScannerEvidenceSectionFull(props: { item: GuardApprovalRequest }) {
   const hasSignals =
     (props.item.risk_signals ?? []).length > 0 ||
     !!props.item.risk_summary ||
@@ -669,6 +793,7 @@ function ScannerEvidenceSection(props: { item: GuardApprovalRequest }) {
   if (!hasSignals) return null;
   return (
     <div className="space-y-3">
+      <InlineScannerSection item={props.item} />
       <WhyGuardCares item={props.item} />
       <DataFlowEvidenceCard item={props.item} />
       <SkillRiskCard item={props.item} />
@@ -795,7 +920,7 @@ function RuleBuilder(props: {
         </div>
       </div>
 
-      <div className="relative mt-5">
+      <div className="relative mt-5 sticky top-4 z-10">
         <DecisionActionPanel
           allowLabel={allowLabel}
           previewText={previewText}
@@ -1009,6 +1134,10 @@ function BlockedActionCard(props: { item: GuardApprovalRequest }) {
   const bannerLabel = isBlocked ? "Blocked" : "Paused for review";
   const bannerIcon = isBlocked ? HiMiniNoSymbol : HiMiniExclamationTriangle;
   const BannerIcon = bannerIcon;
+  const envelope = props.item.action_envelope_json;
+  const isMcpTool = envelope?.action_type === "mcp_tool";
+  const mcpServer = isMcpTool ? (envelope?.mcp_server ?? null) : null;
+  const mcpTool = isMcpTool ? (envelope?.mcp_tool ?? null) : null;
 
   return (
     <div className="overflow-hidden rounded-[1.65rem] border border-brand-blue/15 bg-white/70 shadow-[inset_0_1px_0_rgba(255,255,255,0.85)]">
@@ -1030,6 +1159,16 @@ function BlockedActionCard(props: { item: GuardApprovalRequest }) {
         ) : null}
       </div>
       <div className="p-4">
+        {isMcpTool && mcpServer !== null && mcpTool !== null && (
+          <div className="mb-3 flex items-center gap-2 rounded-xl border border-brand-blue/20 bg-brand-blue/[0.04] px-3 py-2">
+            <span className="font-mono text-[11px] font-semibold uppercase tracking-[0.15em] text-brand-blue">
+              MCP
+            </span>
+            <span className="font-mono text-sm font-medium text-brand-dark">
+              {mcpServer} → {mcpTool}
+            </span>
+          </div>
+        )}
         <div className="flex flex-wrap items-center justify-between gap-2">
           <SectionLabel>What was stopped</SectionLabel>
         </div>

{plugin_scanner-2.0.149 → plugin_scanner-2.0.151}/dashboard/src/approval-center-primitives.tsx

@@ -9,6 +9,7 @@ import {
   HiMiniServerStack,
   HiMiniAdjustmentsHorizontal,
   HiMiniShieldCheck,
+  HiBars3,
 } from "react-icons/hi2";
 
 import { guardAwareHref } from "./guard-api";
@@ -53,6 +54,7 @@ export function ShellHeader(props: {
   activeHarness: string | null;
   view: "home" | "inbox" | "fleet" | "evidence" | "settings";
   onNavigate: (pathname: string) => void;
+  onOpenMobileQueue?: () => void;
 }) {
   function handleMobileNavigationChange(event: ChangeEvent<HTMLSelectElement>) {
     props.onNavigate(event.target.value);
@@ -85,13 +87,26 @@ export function ShellHeader(props: {
             ))}
           </select>
         </div>
-        <a
-          href={guardAwareHref("/inbox")}
-          className="inline-flex min-h-11 shrink-0 items-center rounded-full border border-white/25 bg-white/10 px-3 py-2 text-sm font-semibold text-white no-underline transition-colors duration-150 hover:bg-white/15"
-          aria-label={`${props.queuedCount} Guard actions queued`}
-        >
-          {props.queuedCount > 99 ? "99+" : props.queuedCount}
-        </a>
+        {props.onOpenMobileQueue && props.view === "inbox" && props.queuedCount > 0 && (
+          <button
+            type="button"
+            onClick={props.onOpenMobileQueue}
+            aria-label="Open queue list"
+            className="inline-flex min-h-11 shrink-0 items-center gap-1.5 rounded-full border border-white/25 bg-white/10 px-3 py-2 text-sm font-semibold text-white no-underline transition-colors duration-150 hover:bg-white/15"
+          >
+            <HiBars3 className="h-4 w-4" aria-hidden="true" />
+            {props.queuedCount > 99 ? "99+" : props.queuedCount}
+          </button>
+        )}
+        {(!props.onOpenMobileQueue || props.view !== "inbox" || props.queuedCount === 0) && (
+          <a
+            href={guardAwareHref("/inbox")}
+            className="inline-flex min-h-11 shrink-0 items-center rounded-full border border-white/25 bg-white/10 px-3 py-2 text-sm font-semibold text-white no-underline transition-colors duration-150 hover:bg-white/15"
+            aria-label={`${props.queuedCount} Guard actions queued`}
+          >
+            {props.queuedCount > 99 ? "99+" : props.queuedCount}
+          </a>
+        )}
       </div>
     </header>
   );
@@ -523,9 +538,9 @@ export function WelcomeState(props: {
       <div className="mb-6 flex h-20 w-20 items-center justify-center rounded-full bg-brand-green-bg/50 ring-1 ring-brand-green/20">
         <HiMiniShieldCheck className="h-10 w-10 text-brand-green" aria-hidden="true" />
       </div>
-      <h2 className="text-2xl font-semibold tracking-tight text-brand-dark sm:text-3xl">Your environment is secure</h2>
+      <h2 className="text-2xl font-semibold tracking-tight text-brand-dark sm:text-3xl">No blocked actions</h2>
       <p className="mx-auto mt-4 max-w-lg text-[15px] leading-relaxed text-muted-foreground">
-        HOL Guard is watching connected apps on this machine. Connect Cloud when you want shared decisions across the team.
+        Guard is still watching your apps. You'll be notified here if something needs your approval.
       </p>
       
       <div className="mt-12 text-left w-full max-w-3xl">

{plugin_scanner-2.0.149 → plugin_scanner-2.0.151}/dashboard/src/fleet-workspace.tsx

@@ -1,12 +1,13 @@
+import { useCallback } from "react";
 import {
   ActionButton,
-  Badge,
   EmptyState,
   KeyValueGrid,
   SectionLabel,
   Tag
 } from "./approval-center-primitives";
 import { harnessDisplayName } from "./approval-center-utils";
+import { WatchedAppCard } from "./watched-app-card";
 import type { GuardInventoryItem, GuardPolicyDecision, GuardReceipt, GuardRuntimeSnapshot } from "./guard-types";
 
 type FleetWorkspaceProps = {
@@ -17,6 +18,9 @@ type FleetWorkspaceProps = {
     | { kind: "loading" }
     | { kind: "error"; message: string }
     | { kind: "ready"; items: GuardInventoryItem[] };
+  onConnectHarness?: (harness: string) => void;
+  onTestHarness?: (harness: string) => void;
+  onRepairHarness?: (harness: string) => void;
 };
 
 function collectHarnesses(snapshot: GuardRuntimeSnapshot): string[] {
@@ -50,6 +54,20 @@ export function FleetWorkspace(props: FleetWorkspaceProps) {
   ).sort((left, right) => left.localeCompare(right));
   const runtimeState = props.runtime.runtime_state;
 
+  const receiptHarnesses = new Set(props.runtime.latest_receipts.map((r) => r.harness));
+
+  const handleConnect = useCallback((harness: string) => {
+    props.onConnectHarness?.(harness);
+  }, [props.onConnectHarness]);
+
+  const handleTest = useCallback((harness: string) => {
+    props.onTestHarness?.(harness);
+  }, [props.onTestHarness]);
+
+  const handleRepair = useCallback((harness: string) => {
+    props.onRepairHarness?.(harness);
+  }, [props.onRepairHarness]);
+
   return (
     <div className="space-y-6">
       <section className="guard-surface-in relative overflow-hidden rounded-[2rem] border border-brand-blue/15 bg-[radial-gradient(circle_at_top_left,rgba(85,153,254,0.12),transparent_32%),linear-gradient(135deg,#ffffff_0%,#ffffff_62%,rgba(72,223,123,0.10)_100%)] p-5 shadow-[0_20px_60px_rgba(63,65,116,0.08)] sm:p-6 lg:p-7">
@@ -86,26 +104,25 @@ export function FleetWorkspace(props: FleetWorkspaceProps) {
         <section className="rounded-[1.75rem] border border-slate-200/70 bg-white/80 p-5 shadow-sm sm:p-6">
           <SectionLabel>App coverage</SectionLabel>
           {visibleHarnesses.length > 0 ? (
-            <div className="mt-4 overflow-hidden rounded-[1.5rem] border border-slate-200/70 bg-white/75">
+            <div className="mt-4 grid gap-3 sm:grid-cols-2">
               {visibleHarnesses.map((harness) => {
                 const install = managedInstalls.find((item) => item.harness === harness);
                 const harnessInventory = inventory.filter((item) => item.harness === harness && item.present);
                 const harnessPolicies = props.policies.filter((item) => item.harness === harness);
-                const statusLabel = install === undefined ? "Observed" : install.active ? "Protected" : "Disabled";
+                const hasReceipts = receiptHarnesses.has(harness);
                 return (
-                  <div key={harness} className="border-b border-slate-200/70 px-4 py-3 last:border-b-0">
-                    <div className="flex items-start justify-between gap-3">
-                      <div>
-                        <p className="text-sm font-semibold text-brand-dark">{harnessDisplayName(harness)}</p>
-                        <p className="mt-1 text-xs text-muted-foreground">
-                          {harnessInventory.length} actions seen · {harnessPolicies.length} saved approvals
-                        </p>
-                      </div>
-                      <Badge tone={install === undefined || install.active ? "success" : "destructive"}>
-                        {statusLabel}
-                      </Badge>
-                    </div>
-                  </div>
+                  <WatchedAppCard
+                    key={harness}
+                    harness={harness}
+                    install={install}
+                    harnessInventory={harnessInventory}
+                    harnessPolicies={harnessPolicies}
+                    hasReceipts={hasReceipts}
+                    fleetUrl={props.runtime.fleet_url}
+                    onConnect={handleConnect}
+                    onTest={handleTest}
+                    onRepair={handleRepair}
+                  />
                 );
               })}
             </div>