import { Calculator, FileSpreadsheet, ListChecks, Sparkles } from 'lucide-react';
import type { Course } from '@/lib/types';
import { Logo } from '@/components/ui/logo';

const ICONS = [Sparkles, Calculator, ListChecks, FileSpreadsheet, Sparkles];

export function EmptyState({ course, onPick, term }: { course?: Course; onPick: (t: string) => void; term: string }) {
  return (
    <div className="mx-auto max-w-[760px] px-4 pt-8 sm:pt-16 pb-6 text-center animate-fadein">
      <Logo className="justify-center" withText={false} />
      <h1 className="mt-4 text-xl sm:text-2xl font-bold text-uqo-blue-dark">Bonjour ! Sur quoi travaille-t-on aujourd'hui ?</h1>
      <p className="mt-2 text-sm sm:text-base text-neutral-muted">
        {course ? <><b className="text-uqo-blue">{course.code}</b> — {course.title}</> : 'Tuteur IA en évaluation immobilière'} · {term}
      </p>
      {course?.announcement && (
        <div className="mt-4 rounded-xl border border-uqo-gold/50 bg-[#fff8dc] text-left px-4 py-3 text-sm">
          <b className="text-[#7a6300]">Annonce du professeur</b>
          <p className="mt-0.5">{course.announcement}</p>
        </div>
      )}
      <div className="mt-6 grid gap-2 sm:grid-cols-2">
        {(course?.suggestions || []).map((s, i) => {
          const Icon = ICONS[i % ICONS.length];
          return (
            <button key={s} onClick={() => onPick(s)} className="flex items-center gap-3 rounded-xl border border-neutral-line bg-white px-4 py-3 text-left text-sm hover:border-uqo-blue hover:bg-uqo-blue-light/40 min-h-[56px] shadow-card">
              <Icon size={18} className="text-uqo-blue shrink-0" />
              <span>{s}</span>
            </button>
          );
        })}
      </div>
      {course?.deadlines?.length ? (
        <div className="mt-6 text-left">
          <div className="text-xs font-semibold text-neutral-muted uppercase tracking-wide">Échéances</div>
          <ul className="mt-1 text-sm space-y-1">
            {course.deadlines.map((d) => <li key={d.label} className="flex justify-between border-b border-neutral-line/70 py-1"><span>{d.label}</span><span className="text-neutral-muted">{d.date}</span></li>)}
          </ul>
        </div>
      ) : null}
    </div>
  );
}