// ScanProgress — terminal-style live progress pane.
function ScanProgress({ scan, onCancel }) {
  const pct = Math.floor(scan.progress * 100);
  const eta = Math.max(0, Math.ceil(scan.etaMs / 1000));
  return (
    <div className="scan-progress">
      <div className="sp-head">
        <span className="rec-dot" />
        <span className="sp-title">scanning {scan.repoUrl}</span>
        <button className="sp-cancel" onClick={onCancel}>cancel</button>
      </div>
      <div className="sp-bar-wrap">
        <div className="sp-bar">
          <div className="sp-bar-fill" style={{ width: `${pct}%` }} />
        </div>
        <div className="sp-bar-meta">
          <span>{scan.filesScanned.toLocaleString()} / {scan.totalFiles.toLocaleString()} files</span>
          <span>·</span>
          <span>{scan.findings.length} findings</span>
          <span>·</span>
          <span>eta {eta}s</span>
        </div>
      </div>
      <div className="sp-log">
        {scan.log.map((ln, i) => (
          <div key={i} className="sp-log-line">
            <span className="sp-log-caret">›</span> {ln}
          </div>
        ))}
      </div>
    </div>
  );
}
window.ScanProgress = ScanProgress;