/**
 * Dashboard TUI component for /workflows command.
 *
 * Provides an interactive overlay to:
 *  - View running and completed workflow runs
 *  - Inspect individual step progress and output
 *  - Cancel running workflows
 *  - Toggle auto-refresh
 */

import type { Component } from "@earendil-works/pi-tui";
import type { Theme } from "@earendil-works/pi-coding-agent";
import {
  truncateToWidth,
} from "@earendil-works/pi-tui";
import type { WorkflowProgress, StepProgress, DashboardState } from "./types.ts";
import { listRuns, loadProgress } from "./artifacts.ts";
import { getActiveRuns, type ActiveRun } from "./cleanup.ts";

// ── Rendering Helpers ───────────────────────────────────────────────────────────

function formatTime(ts: number | null): string {
  if (!ts) return "--";
  return new Date(ts).toLocaleTimeString();
}

function formatDuration(ms: number): string {
  if (ms < 1000) return `${ms}ms`;
  if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
  return `${Math.floor(ms / 60000)}m${Math.round((ms % 60000) / 1000)}s`;
}

function statusIcon(status: string, theme: any): string {
  const fg = theme.fg || ((_: string, t: string) => t);
  switch (status) {
    case "running":
      return fg("warning", "⟳");
    case "completed":
      return fg("success", "✓");
    case "failed":
      return fg("error", "✗");
    case "cancelled":
      return fg("dim", "✕");
    default:
      return fg("dim", "○");
  }
}

function stepStatusIcon(status: string, theme: any): string {
  const fg = theme.fg || ((_: string, t: string) => t);
  switch (status) {
    case "running":
      return fg("warning", "▸");
    case "completed":
      return fg("success", "✓");
    case "failed":
      return fg("error", "✗");
    case "cancelled":
      return fg("dim", "✕");
    default:
      return fg("dim", "·");
  }
}

function formatTokens(n: number): string {
  if (n < 1000) return String(n);
  if (n < 10000) return `${(n / 1000).toFixed(1)}k`;
  return `${Math.round(n / 1000)}k`;
}

// ── Dashboard Component ─────────────────────────────────────────────────────────

export class DashboardComponent implements Component {
  private state: DashboardState;
  private theme: any;
  private width = 80;
  private needsRefresh = true;

  constructor(state: DashboardState, theme: any) {
    this.state = state;
    this.theme = theme;

    if (state.autoRefresh) {
      this.state.refreshInterval = setInterval(() => {
        this.refreshRuns();
      }, 1_500);
    }
  }

  private refreshRuns(): void {
    const activeMap = new Map<string, WorkflowProgress>();
    for (const run of getActiveRuns()) {
      activeMap.set(run.runId, run.progress);
    }

    const saved = listRuns()
      .filter((id: string) => !activeMap.has(id))
      .map((id: string) => ({ runId: id, progress: loadProgress(id) }));

    const active = Array.from(activeMap.entries()).map(([runId, progress]: [string, WorkflowProgress]) => ({
      runId,
      progress,
    }));

    this.state.runs = [...active, ...saved];

    if (this.state.selectedIndex >= this.state.runs.length) {
      this.state.selectedIndex = Math.max(0, this.state.runs.length - 1);
    }

    this.needsRefresh = true;
  }

  render(width: number, _height?: number): string[] {
    this.width = width;
    if (this.state.autoRefresh) {
      this.refreshRuns();
    }

    const lines: string[] = [];
    const theme = this.theme;
    const fg = theme.fg || ((_: string, t: string) => t);
    const bold = theme.bold || ((t: string) => t);
    const innerW = Math.max(1, width - 4);

    // Header
    lines.push(fg("accent", bold("Workflow Dashboard")));
    lines.push(fg("dim", `${"─".repeat(Math.max(0, innerW - 2))}`));

    if (this.state.runs.length === 0) {
      lines.push("");
      lines.push(fg("dim", "  No workflow runs found."));
      lines.push(fg("dim", "  Use the workflow tool or /workflows run <script> to start a run."));
    } else {
      for (let i = 0; i < this.state.runs.length; i++) {
        const { runId, progress } = this.state.runs[i];
        const isSelected = i === this.state.selectedIndex;
        const prefix = isSelected ? fg("accent", "▶") : " ";
        const shortId = runId.slice(0, 8);

        if (!progress) {
          lines.push(
            truncateToWidth(
              `${prefix} ${fg("dim", shortId)}  ${fg("dim", "(no data)")}`,
              width,
              "…",
            ),
          );
          continue;
        }

        const icon = statusIcon(progress.status, theme);
        const name = progress.workflowName || "unnamed";
        const stepInfo = `${progress.steps.filter((s: StepProgress) => s.status === "completed").length}/${progress.steps.length} steps`;
        const duration = progress.finishedAt
          ? formatDuration(progress.finishedAt - progress.startedAt)
          : formatDuration(Date.now() - progress.startedAt);

        const line = `${prefix} ${icon} ${fg("toolTitle", bold(name))} ${fg("dim", `[${shortId}]`)} ${fg("dim", `${stepInfo} · ${duration}`)}`;
        lines.push(truncateToWidth(line, width, "…"));

        // Expanded view
        if (isSelected && this.state.expanded) {
          lines.push(fg("dim", `     Started: ${formatTime(progress.startedAt)} · Status: ${progress.status}`));
          if (progress.error) {
            lines.push(fg("error", `     Error: ${progress.error.slice(0, innerW - 10)}`));
          }

          for (const step of progress.steps) {
            const sIcon = stepStatusIcon(step.status, theme);
            const sDuration = step.finishedAt && step.startedAt
              ? formatDuration(step.finishedAt - step.startedAt)
              : step.startedAt
                ? formatDuration(Date.now() - step.startedAt)
                : "--";
            const usageStr = step.usage.totalTokens > 0
              ? ` · ${formatTokens(step.usage.totalTokens)} tok`
              : "";
            const label = step.label || step.stepId;
            const modelStr = step.model ? ` · ${step.model}` : "";

            const stepLine = `       ${sIcon} ${label} ${fg("dim", `(${step.phase || "default"}) ${sDuration}${usageStr}${modelStr}`)}`;
            lines.push(truncateToWidth(stepLine, width, "…"));

            if (step.error) {
              lines.push(fg("error", `         Error: ${step.error.slice(0, innerW - 16)}`));
            }
          }
        }
      }
    }

    lines.push("");
    lines.push(fg("dim", `  ─${"─".repeat(Math.max(0, innerW - 2))}`));
    lines.push(
      fg("dim", `  ↑↓ select  Enter${this.state.expanded ? " collapse" : " expand"}  R refresh  C cancel  Esc close`),
    );

    return lines;
  }

  handleInput(data: string): boolean {
    switch (data) {
      case "up":
      case "k":
        if (this.state.selectedIndex > 0) {
          this.state.selectedIndex--;
          this.needsRefresh = true;
        }
        return true;
      case "down":
      case "j":
        if (this.state.selectedIndex < this.state.runs.length - 1) {
          this.state.selectedIndex++;
          this.needsRefresh = true;
        }
        return true;
      case "enter":
        this.state.expanded = !this.state.expanded;
        this.needsRefresh = true;
        return true;
      case "r":
      case "R":
        this.refreshRuns();
        this.needsRefresh = true;
        return true;
      case "c":
      case "C":
        this.cancelSelected();
        return true;
      case "escape":
        this.dispose();
        this.state.onClose();
        return true;
    }
    return false;
  }

  private cancelSelected(): void {
    const selected = this.state.runs[this.state.selectedIndex];
    if (!selected?.progress) return;

    const activeRun = getActiveRuns().find((r: ActiveRun) => r.runId === selected.runId);
    if (activeRun && activeRun.progress.status === "running") {
      activeRun.abortController.abort();
      selected.progress.status = "cancelled";
    }
    this.needsRefresh = true;
  }

  invalidate(): void {
    this.needsRefresh = true;
  }

  dispose(): void {
    if (this.state.refreshInterval) {
      clearInterval(this.state.refreshInterval);
      this.state.refreshInterval = null;
    }
  }
}

// ── Dashboard Factory ───────────────────────────────────────────────────────────

export function createDashboard(
  theme: any,
  onClose: () => void,
): DashboardComponent {
  const runs: { runId: string; progress: WorkflowProgress | null }[] = listRuns()
    .map((id: string) => ({ runId: id, progress: loadProgress(id) }));

  const activeRuns = getActiveRuns();
  for (const run of activeRuns) {
    if (!runs.find((r: { runId: string; progress: WorkflowProgress | null }) => r.runId === run.runId)) {
      runs.unshift({ runId: run.runId, progress: run.progress });
    }
  }

  return new DashboardComponent(
    {
      runs,
      selectedIndex: 0,
      expanded: false,
      autoRefresh: true,
      refreshInterval: null,
      onClose,
    },
    theme,
  );
}