// ABOUTME: Dashboard card displaying today's training decision.
// ABOUTME: Shows decision status, icon, and reason with color-coded backgrounds.
import type { Decision } from "@/types";

interface DecisionCardProps {
  decision: Decision;
}

function getStatusColors(status: Decision["status"]): {
  background: string;
  text: string;
} {
  switch (status) {
    case "REST":
      return {
        background:
          "bg-red-100 dark:bg-red-900/50 border-red-300 dark:border-red-700",
        text: "text-red-700 dark:text-red-300",
      };
    case "GENTLE":
    case "LIGHT":
    case "REDUCED":
      return {
        background:
          "bg-yellow-100 dark:bg-yellow-900/50 border-yellow-300 dark:border-yellow-700",
        text: "text-yellow-700 dark:text-yellow-300",
      };
    case "TRAIN":
      return {
        background:
          "bg-green-100 dark:bg-green-900/50 border-green-300 dark:border-green-700",
        text: "text-green-700 dark:text-green-300",
      };
    default:
      return { background: "border", text: "text-muted-foreground" };
  }
}

export function DecisionCard({ decision }: DecisionCardProps) {
  const colors = getStatusColors(decision.status);

  return (
    <div className={`rounded-lg p-6 ${colors.background}`}>
      <div className="text-4xl mb-2">{decision.icon}</div>
      <h2 className="text-2xl font-bold">{decision.status}</h2>
      <p className={colors.text}>{decision.reason}</p>
    </div>
  );
}