import { type EvaluationRun, steps } from "@/hooks/useRoundEvaluationRun";

type EvaluationStepsListProps = {
  run: EvaluationRun | null;
  isOfficialRun: boolean;
  currentStepIndex: number;
  isSucceeded: boolean;
};

export default function EvaluationStepsList({
  run,
  isOfficialRun,
  currentStepIndex,
  isSucceeded,
}: EvaluationStepsListProps) {
  if (!run || !isOfficialRun) return null;

  return (
    <div className="pt-2">
      <div className="font-semibold mb-1">Prubeh</div>
      <div className="space-y-1">
        {steps.map((step, index) => {
          const isCurrent = !isSucceeded && index === currentStepIndex;
          const isDone = isSucceeded || (currentStepIndex > -1 && index < currentStepIndex);
          const tone = isCurrent
            ? "text-foreground"
            : isDone
              ? "text-foreground-600"
              : "text-foreground-400";
          return (
            <div key={step.key} className={`flex items-center gap-2 ${tone}`}>
              <span>{isDone ? "●" : isCurrent ? "○" : "·"}</span>
              <span>{step.label}</span>
            </div>
          );
        })}
      </div>
    </div>
  );
}