@elench/testkit 0.1.85 → 0.1.87

package/lib/cli/tui/run-session-app.mjs

@@ -1,432 +0,0 @@
-import React, { createElement, useEffect, useState } from "react";
-import { Box, Text, useAnimation, useInput } from "ink";
-import figures from "figures";
-import { formatDuration } from "../../runner/formatting.mjs";
-import {
-  bold,
-  colorService,
-  colorTypeBadge,
-  dim,
-  green,
-  red,
-  yellow,
-} from "../presentation/colors.mjs";
-import { renderSummaryBox } from "../presentation/summary-box.mjs";
-import { renderFailureBlock } from "../presentation/failure-presentation.mjs";
-import { getTerminalWidth } from "../presentation/terminal-layout.mjs";
-import { defaultInvestigationMessage } from "../agents/prompt-builder.mjs";
-import { loadInvestigationContext } from "../agents/investigation-context.mjs";
-
-const TREE_BRANCH = "\u251C\u2500\u2500 ";
-const TREE_LAST = "\u2514\u2500\u2500 ";
-const TREE_PIPE = "\u2502   ";
-const TREE_SPACE = "    ";
-const SPINNER_FRAMES = ["\u280B", "\u2819", "\u2839", "\u2838", "\u283C", "\u2834", "\u2826", "\u2827", "\u2807", "\u280F"];
-
-export function RunSessionApp({
-  sessionState,
-  stdout,
-  productDir,
-  onInvestigate,
-  onRequestClose,
-  onCancelInvestigation,
-} = {}) {
-  const [snapshot, setSnapshot] = useState(() => sessionState.getSnapshot());
-  const [detailLines, setDetailLines] = useState([]);
-  const { frame } = useAnimation({ interval: 80, isActive: !snapshot.finished });
-  const spinnerFrame = SPINNER_FRAMES[frame % SPINNER_FRAMES.length];
-
-  useEffect(() => {
-    const unsubscribe = sessionState.subscribe(() => {
-      setSnapshot(sessionState.getSnapshot());
-    });
-    return unsubscribe;
-  }, [sessionState]);
-
-  useEffect(() => {
-    if (!snapshot.selectedFailure) {
-      setDetailLines([]);
-      return;
-    }
-    try {
-      const context = loadInvestigationContext({
-        productDir,
-        serviceName: snapshot.selectedFailure.serviceName,
-        filePath: snapshot.selectedFailure.filePath,
-      });
-      setDetailLines(context.detailLines);
-    } catch (error) {
-      setDetailLines([error instanceof Error ? error.message : String(error)]);
-    }
-  }, [productDir, snapshot.selectedFailure?.key]);
-
-  useInput((input, key) => {
-    if (!snapshot.finished) {
-      if (input === "q") sessionState.setNotice("Run is still in progress. Wait for completion before closing.");
-      return;
-    }
-
-    if (input === "q") {
-      onRequestClose?.();
-      return;
-    }
-
-    if (snapshot.mode === "complete") {
-      if (key.downArrow || input === "j") {
-        sessionState.selectNextFailure();
-        return;
-      }
-      if (key.upArrow || input === "k") {
-        sessionState.selectPreviousFailure();
-        return;
-      }
-      if (input === "y" || input === "i") {
-        if (snapshot.selectedFailure) {
-          onInvestigate?.({
-            provider: "auto",
-            userMessage: defaultInvestigationMessage(),
-          });
-        }
-        return;
-      }
-      if (input === "c" && snapshot.selectedFailure) {
-        onInvestigate?.({ provider: "claude", userMessage: defaultInvestigationMessage() });
-        return;
-      }
-      if (input === "o" && snapshot.selectedFailure) {
-        onInvestigate?.({ provider: "codex", userMessage: defaultInvestigationMessage() });
-      }
-      return;
-    }
-
-    if (snapshot.mode === "investigating") {
-      if (input === "t") {
-        sessionState.toggleInvestigationViewMode();
-        return;
-      }
-      if (input === "x") {
-        onCancelInvestigation?.();
-        return;
-      }
-      if (input === "b" && snapshot.agentSession?.status !== "running") {
-        sessionState.returnToSummary();
-      }
-    }
-  });
-
-  const treeElements = buildTreeElements({ snapshot, spinnerFrame, stdout });
-  const detailElements =
-    snapshot.mode === "investigating"
-      ? buildAgentPane(snapshot)
-      : buildFailureDetailPane(snapshot, detailLines);
-
-  const footerText = buildFooterText(snapshot);
-  const headerText = buildHeaderText(snapshot);
-  const summaryLines =
-    snapshot.finished && snapshot.summaryData
-      ? renderSummaryBox(snapshot.summaryData.rows, { stdout })
-      : [];
-  const terminalWidth = getTerminalWidth(stdout, 100);
-  const leftWidth = Math.max(42, Math.floor(terminalWidth * 0.58));
-  const rightWidth = Math.max(28, terminalWidth - leftWidth - 1);
-
-  return createElement(
-    Box,
-    { flexDirection: "column" },
-    createElement(Text, { key: "header" }, dim(headerText)),
-    snapshot.notice ? createElement(Text, { key: "notice" }, yellow(snapshot.notice)) : null,
-    createElement(
-      Box,
-      { key: "main", marginTop: 1, flexDirection: "row" },
-      createElement(Box, { width: leftWidth, flexDirection: "column", paddingRight: 1 }, ...treeElements),
-      createElement(Box, { width: rightWidth, flexDirection: "column", paddingLeft: 1 }, ...detailElements)
-    ),
-    summaryLines.length > 0 ? createElement(Text, { key: "summary-gap" }, "") : null,
-    ...summaryLines.map((line, index) => createElement(Text, { key: `summary-${index}` }, line)),
-    createElement(Text, { key: "footer-gap" }, ""),
-    createElement(Text, { key: "footer" }, dim(footerText))
-  );
-}
-
-export function buildHeaderText(snapshot) {
-  const progressText = snapshot.totalCount > 0 ? `[${snapshot.completedCount}/${snapshot.totalCount}]` : "[0/0]";
-  const phaseText = snapshot.phase || (snapshot.finished ? "run complete" : "preparing");
-  const modeText = snapshot.mode === "investigating"
-    ? `investigating with ${snapshot.agentSession?.provider || "agent"}`
-    : snapshot.finished
-      ? "interactive summary"
-      : "live run tree";
-  return [progressText, phaseText, modeText].filter(Boolean).join(" · ");
-}
-
-export function buildFooterText(snapshot) {
-  if (!snapshot.finished) return "Run in progress";
-  if (snapshot.mode === "investigating") {
-    if (snapshot.agentSession?.status === "running" || snapshot.agentSession?.status === "starting") {
-      return "t transcript · x cancel investigation · q quit";
-    }
-    return "t transcript · b back to summary · q quit";
-  }
-  if (!snapshot.selectedFailure) return "q quit";
-  return "↑/↓ select failure · y investigate · c Claude · o Codex · q quit";
-}
-
-function buildTreeElements({ snapshot, spinnerFrame, stdout }) {
-  const elements = [];
-  for (let serviceIndex = 0; serviceIndex < snapshot.services.length; serviceIndex += 1) {
-    const service = snapshot.services[serviceIndex];
-    const isLastService = serviceIndex === snapshot.services.length - 1;
-    const serviceConnector = isLastService ? TREE_LAST : TREE_BRANCH;
-
-    if (service.skipped) {
-      elements.push(
-        createElement(
-          Text,
-          { key: `svc-${service.name}` },
-          `${serviceConnector}${colorService(service.name)} ${dim(service.skipReason || "skipped")}`
-        )
-      );
-      continue;
-    }
-
-    elements.push(
-      createElement(Text, { key: `svc-${service.name}` }, `${serviceConnector}${colorService(service.name)}`)
-    );
-
-    const serviceIndent = isLastService ? TREE_SPACE : TREE_PIPE;
-    for (let typeIndex = 0; typeIndex < service.types.length; typeIndex += 1) {
-      const typeNode = service.types[typeIndex];
-      const isLastType = typeIndex === service.types.length - 1;
-      const typeConnector = isLastType ? TREE_LAST : TREE_BRANCH;
-
-      if (typeNode.collapsed) {
-        const totalFiles = typeNode.suites.reduce((sum, suite) => sum + suite.fileCount, 0);
-        const totalDuration = typeNode.suites.reduce((sum, suite) => sum + suite.totalDurationMs, 0);
-        const allSkipped = typeNode.suites.every((suite) => suite.collapseStatus === "all_skipped");
-        const icon = allSkipped ? yellow(figures.arrowDown) : green(figures.tick);
-        const suffix = allSkipped
-          ? dim(`(${totalFiles} files skipped)`)
-          : dim(`(${totalFiles} files) ${formatDuration(totalDuration)}`);
-        elements.push(
-          createElement(
-            Text,
-            { key: `type-${service.name}-${typeNode.type}` },
-            `${serviceIndent}${typeConnector}${colorTypeBadge(typeNode.type.toUpperCase())} ${icon} ${suffix}`
-          )
-        );
-        continue;
-      }
-
-      elements.push(
-        createElement(
-          Text,
-          { key: `type-${service.name}-${typeNode.type}` },
-          `${serviceIndent}${typeConnector}${colorTypeBadge(typeNode.type.toUpperCase())}`
-        )
-      );
-
-      const typeIndent = serviceIndent + (isLastType ? TREE_SPACE : TREE_PIPE);
-      for (let suiteIndex = 0; suiteIndex < typeNode.suites.length; suiteIndex += 1) {
-        const suite = typeNode.suites[suiteIndex];
-        const isLastSuite = suiteIndex === typeNode.suites.length - 1;
-        const suiteConnector = isLastSuite ? TREE_LAST : TREE_BRANCH;
-
-        if (suite.collapsed) {
-          const icon = suite.collapseStatus === "all_skipped" ? yellow(figures.arrowDown) : green(figures.tick);
-          const suffix = suite.collapseStatus === "all_skipped"
-            ? dim(`(${suite.fileCount} files skipped)`)
-            : dim(`(${suite.fileCount} files) ${formatDuration(suite.totalDurationMs)}`);
-          elements.push(
-            createElement(
-              Text,
-              { key: `suite-${service.name}-${suite.key}` },
-              `${typeIndent}${suiteConnector}${icon} ${bold(suite.groupLabel)} ${suffix}`
-            )
-          );
-          continue;
-        }
-
-        const mixedLabel =
-          suite.passedCount > 0 && suite.passedCount < suite.fileCount
-            ? dim(` (${suite.fileCount} files · ${suite.passedCount} passed)`)
-            : "";
-        elements.push(
-          createElement(
-            Text,
-            { key: `suite-${service.name}-${suite.key}` },
-            `${typeIndent}${suiteConnector}${bold(suite.groupLabel)}${mixedLabel}`
-          )
-        );
-
-        const suiteIndent = typeIndent + (isLastSuite ? TREE_SPACE : TREE_PIPE);
-        for (let fileIndex = 0; fileIndex < suite.visibleFiles.length; fileIndex += 1) {
-          const file = suite.visibleFiles[fileIndex];
-          const isLastFile = fileIndex === suite.visibleFiles.length - 1;
-          const fileConnector = isLastFile ? TREE_LAST : TREE_BRANCH;
-          const failureKey = `${service.name}::${file.path}`;
-          const selected = failureKey === snapshot.selectedFailureKey;
-          const pointer = selected ? `${bold(">")} ` : "";
-          const icon = statusIcon(file.status, spinnerFrame);
-          const duration = file.durationMs != null ? ` ${dim(formatDuration(file.durationMs))}` : "";
-          elements.push(
-            createElement(
-              Text,
-              { key: `file-${service.name}-${file.path}` },
-              `${suiteIndent}${fileConnector}${pointer}${icon} ${file.displayName}${duration}`
-            )
-          );
-
-          if (file.status !== "failed" || (!file.error && !file.failureDetails)) continue;
-          const failureLines = renderFailureBlock(
-            {
-              serviceName: service.name,
-              type: suite.key.split(":")[0],
-              file: file.path,
-              framework: suite.framework,
-            },
-            {
-              error: file.error,
-              failureDetails: file.failureDetails || [],
-              failed: true,
-            },
-            {
-              width: Math.max(40, Math.floor(getTerminalWidth(stdout, 100) * 0.55)),
-              regressionCatalog: snapshot.regressionCatalog,
-            }
-          );
-          const failureIndent = suiteIndent + (isLastFile ? TREE_SPACE : TREE_PIPE);
-          for (let failureIndex = 0; failureIndex < failureLines.length; failureIndex += 1) {
-            elements.push(
-              createElement(
-                Text,
-                { key: `failure-${service.name}-${file.path}-${failureIndex}` },
-                `${failureIndent}${failureLines[failureIndex]}`
-              )
-            );
-          }
-        }
-      }
-    }
-  }
-  return elements;
-}
-
-function buildFailureDetailPane(snapshot, detailLines) {
-  if (!snapshot.selectedFailure) {
-    return [
-      createElement(Text, { key: "detail-title" }, bold("Selected Failure")),
-      createElement(Text, { key: "detail-empty" }, dim("No failed file selected.")),
-    ];
-  }
-
-  const lines = detailLines.length > 0 ? detailLines : ["Loading failure details..."];
-  return [
-    createElement(Text, { key: "detail-title" }, bold("Selected Failure")),
-    createElement(
-      Text,
-      { key: "detail-path" },
-      `${snapshot.selectedFailure.serviceName} · ${snapshot.selectedFailure.filePath}`
-    ),
-    createElement(Text, { key: "detail-gap" }, ""),
-    ...lines.slice(0, 30).map((line, index) => createElement(Text, { key: `detail-${index}` }, line)),
-  ];
-}
-
-function buildAgentPane(snapshot) {
-  const transcriptEntries = snapshot.agentSession?.transcriptEntries || [];
-  const timeline = snapshot.agentSession?.timeline || [];
-  const viewMode = snapshot.agentSession?.viewMode || "summary";
-  const status = snapshot.agentSession?.status || "idle";
-  const statusText =
-    status === "running" || status === "starting"
-      ? yellow(`Status: ${status}`)
-      : status === "error"
-        ? red(`Status: ${status}`)
-        : green(`Status: ${status}`);
-  const phaseText = snapshot.agentSession?.activePhase
-    ? dim(`Phase: ${snapshot.agentSession.activePhase}`)
-    : dim("Phase: planning");
-
-  return [
-    createElement(Text, { key: "agent-title" }, bold("Investigation")),
-    createElement(Text, { key: "agent-status" }, statusText),
-    createElement(Text, { key: "agent-phase" }, phaseText),
-    createElement(Text, { key: "agent-gap" }, ""),
-    ...(viewMode === "transcript"
-      ? buildTranscriptEntries(transcriptEntries)
-      : buildSummaryEntries(snapshot.agentSession, timeline)),
-  ];
-}
-
-function buildSummaryEntries(agentSession, timeline) {
-  const summaryLines = [];
-  const activeStep = agentSession?.activeStep || null;
-  const summary = agentSession?.summary || { inspectedCount: 0, rerunCount: 0, editedFiles: [] };
-
-  if (activeStep?.label) {
-    summaryLines.push(
-      createElement(Text, { key: "summary-step" }, `${yellow(figures.pointerSmall)} ${activeStep.label}${activeStep.detail ? ` ${dim(`· ${activeStep.detail}`)}` : ""}`)
-    );
-  }
-
-  if (summary.inspectedCount > 0 || summary.editedFiles.length > 0 || summary.rerunCount > 0) {
-    const parts = [];
-    if (summary.inspectedCount > 0) parts.push(`${summary.inspectedCount} check${summary.inspectedCount === 1 ? "" : "s"}`);
-    if (summary.editedFiles.length > 0) parts.push(`${summary.editedFiles.length} file${summary.editedFiles.length === 1 ? "" : "s"} edited`);
-    if (summary.rerunCount > 0) parts.push(`${summary.rerunCount} rerun${summary.rerunCount === 1 ? "" : "s"}`);
-    summaryLines.push(createElement(Text, { key: "summary-counts" }, dim(parts.join(" · "))));
-  }
-
-  const renderedTimeline = timeline.filter((entry) => entry.kind !== "step").slice(-8);
-  if (renderedTimeline.length === 0) {
-    summaryLines.push(createElement(Text, { key: "summary-empty" }, dim("Waiting for investigation progress...")));
-    return summaryLines;
-  }
-
-  summaryLines.push(createElement(Text, { key: "summary-gap-2" }, ""));
-  for (let index = 0; index < renderedTimeline.length; index += 1) {
-    const entry = renderedTimeline[index];
-    summaryLines.push(
-      createElement(Text, { key: `timeline-${index}` }, formatTimelineEntry(entry))
-    );
-  }
-  return summaryLines;
-}
-
-function buildTranscriptEntries(entries) {
-  if (entries.length === 0) {
-    return [createElement(Text, { key: "agent-empty" }, dim("Waiting for agent output..."))];
-  }
-  return entries.slice(-24).map((entry, index) =>
-    createElement(Text, { key: `agent-${index}` }, formatAgentEntry(entry))
-  );
-}
-
-export function formatTimelineEntry(entry) {
-  if (entry.kind === "phase") return dim(entry.label);
-  if (entry.kind === "finding") return `${yellow(figures.bullet)} ${entry.summary}`;
-  if (entry.kind === "edit") return `${yellow(figures.bullet)} ${entry.summary}`;
-  if (entry.kind === "rerun") return `${yellow(figures.bullet)} ${entry.summary}`;
-  if (entry.kind === "result") return `${green(figures.tick)} ${entry.summary}`;
-  if (entry.kind === "notice") {
-    return entry.severity === "error" ? red(entry.message) : yellow(entry.message);
-  }
-  return entry.label || entry.summary || entry.message || "";
-}
-
-export function formatAgentEntry(entry) {
-  if (entry.kind === "tool") return yellow(`[tool] ${entry.text}`);
-  if (entry.kind === "status") return dim(`[status] ${entry.text}`);
-  if (entry.kind === "error") return red(`[error] ${entry.text}`);
-  return entry.text;
-}
-
-function statusIcon(status, spinnerFrame) {
-  if (status === "pending") return dim(figures.bullet);
-  if (status === "running") return spinnerFrame;
-  if (status === "passed") return green(figures.tick);
-  if (status === "failed") return red(figures.cross);
-  if (status === "skipped") return yellow(figures.arrowDown);
-  if (status === "not_run") return dim(figures.bullet);
-  return dim(figures.bullet);
-}