Replay diagnosis methods and streamline the report action

- Each diagnosis row can be replayed individually, updating its result and
  the copied report.
- The report controls collapse to a single Copy report button in the action
  row, dropping the empty bordered panel.

Author: pgherveou

playground/src/app/globals.css

@@ -1552,20 +1552,9 @@ button {
   cursor: not-allowed;
 }
 
-.autotest__report {
-  margin-top: 28px;
-  border: 1px solid var(--rule);
-  border-radius: var(--radius-lg);
-  overflow: hidden;
-}
-.autotest__report-head {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 10px 14px;
-  border-bottom: 1px solid var(--rule);
-}
 .autotest__report-copy {
+  margin-left: auto;
+  align-self: center;
   padding: 6px 14px;
   font-family: var(--font-mono), monospace;
   font-size: 11px;
@@ -1574,26 +1563,14 @@ button {
   color: var(--ink-3);
   background: transparent;
   border: 1px solid var(--rule-strong);
+  border-radius: var(--radius);
   cursor: pointer;
   transition: background 120ms ease, color 120ms ease;
 }
 .autotest__report-copy:hover {
   background: var(--bg-tint);
   color: var(--ink);
 }
-.autotest__report-body {
-  margin: 0;
-  padding: 14px;
-  font-family: var(--font-mono), monospace;
-  font-size: 12px;
-  line-height: 1.55;
-  color: var(--console-ink);
-  background: var(--console-bg);
-  white-space: pre-wrap;
-  word-break: break-word;
-  max-height: 360px;
-  overflow-y: auto;
-}
 
 .diag__callout {
   margin: 12px 0 0;

playground/src/app/page.tsx

@@ -20,6 +20,7 @@ import {
   type TestEntry,
   DIAGNOSIS_ID,
   runDiagnosis,
+  runSingleTest,
 } from "@/src/lib/auto-test";
 import packageJson from "../../package.json";
 
@@ -268,6 +269,16 @@ export default function PlaygroundPage() {
     abortRef.current?.abort();
   }, []);
 
+  const handleRetryDiagnosis = useCallback(
+    async (serviceName: string, methodName: string) => {
+      if (isTestRunning) return;
+      await runSingleTest(services, serviceName, methodName, (id, entry) => {
+        setTestResults((prev) => ({ ...prev, [id]: entry }));
+      });
+    },
+    [isTestRunning],
+  );
+
   const hasView = selection !== null;
   const isDiagnosis = selection?.service === DIAGNOSIS_ID;
 
@@ -295,6 +306,7 @@ export default function PlaygroundPage() {
               isRunning={isTestRunning}
               onRun={handleRunDiagnosis}
               onStop={handleStopTests}
+              onRetry={handleRetryDiagnosis}
               onBack={handleBack}
             />
           ) : selection ? (

playground/src/components/DiagnosisView.tsx

@@ -13,6 +13,8 @@ const STATUS_LABEL: Record<TestStatus, string> = {
 
 interface Row {
   id: string;
+  service: string;
+  method: string;
   status: TestStatus;
   output?: string;
 }
@@ -23,13 +25,15 @@ export function DiagnosisView({
   isRunning,
   onRun,
   onStop,
+  onRetry,
   onBack,
 }: {
   services: ServiceInfo[];
   testResults: Record<string, TestEntry>;
   isRunning: boolean;
   onRun: () => void;
   onStop: () => void;
+  onRetry: (service: string, method: string) => void;
   onBack: () => void;
 }) {
   const [copied, setCopied] = useState(false);
@@ -43,6 +47,8 @@ export function DiagnosisView({
         const entry = testResults[id];
         out.push({
           id,
+          service: svc.name,
+          method: m.name,
           status: entry?.status ?? "idle",
           output: entry?.output,
         });
@@ -129,24 +135,17 @@ export function DiagnosisView({
             {passCount} success · {failCount} failed
           </span>
         )}
+        {hasResults && !isRunning && (
+          <button
+            type="button"
+            className="autotest__report-copy"
+            onClick={handleCopyReport}
+          >
+            {copied ? "Copied ✓" : "Copy report"}
+          </button>
+        )}
       </div>
 
-      {hasResults && !isRunning && (
-        <div className="autotest__report">
-          <div className="autotest__report-head">
-            <span className="panel__label">Report</span>
-            <button
-              type="button"
-              className="autotest__report-copy"
-              onClick={handleCopyReport}
-            >
-              {copied ? "Copied ✓" : "Copy report"}
-            </button>
-          </div>
-          <pre className="autotest__report-body">{reportMarkdown}</pre>
-        </div>
-      )}
-
       {hasResults && (
         <div className="diag__log">
           {rows.map((r) => {
@@ -181,6 +180,19 @@ export function DiagnosisView({
                       {r.status === "fail" ? "Error" : "Response"}
                     </div>
                     <pre className="autotest__detail-body">{r.output}</pre>
+                    <button
+                      type="button"
+                      className="autotest__retry"
+                      disabled={isRunning}
+                      title={
+                        isRunning
+                          ? "Wait for the diagnosis run to finish before replaying"
+                          : "Re-run this method"
+                      }
+                      onClick={() => onRetry(r.service, r.method)}
+                    >
+                      ▶ Replay
+                    </button>
                   </div>
                 )}
               </div>

playground/src/lib/auto-test.ts

@@ -194,6 +194,19 @@ async function runSubscription(
   });
 }
 
+// Re-run a single method, e.g. to replay a failed diagnosis row.
+export async function runSingleTest(
+  services: ServiceInfo[],
+  serviceName: string,
+  methodName: string,
+  onUpdate: (id: string, entry: TestEntry) => void,
+): Promise<void> {
+  const svc = services.find((s: ServiceInfo) => s.name === serviceName);
+  const method = svc?.methods.find((m: MethodInfo) => m.name === methodName);
+  if (!svc || !method) return;
+  await runOne({ serviceName, method, onUpdate, excludeSet: new Set() });
+}
+
 async function runAutoTests(
   services: ServiceInfo[],
   onUpdate: (id: string, entry: TestEntry) => void,