import { Link } from 'react-router-dom';
import { Archive, RotateCcw, FolderOpen } from 'lucide-react';
import StatusPill from '@/components/workshop/StatusPill';
import OriginBadge from '@/components/workshop/OriginBadge';
export default function ProjectCard({ project, customer, onToggle }) {
  const archived = project.record_state === 'archived';
  return <Link to={`/projects/${project.uuid}`} className="panel block p-5 transition hover:border-shire-purple/40"><div className="flex items-start justify-between gap-3"><div><p className="text-xs font-semibold text-violet-400">{project.project_id} · REV {project.revision}</p><h2 className="mt-1 font-semibold text-white">{customer?.full_name || 'Unknown customer'}</h2>{customer?.customer_number && <p className="text-xs text-slate-500">{customer.customer_number}</p>}</div><div className="flex flex-col items-end gap-1"><StatusPill tone={project.status === 'Complete' ? 'green' : archived ? 'slate' : 'amber'}>{archived ? 'Archived' : project.status}</StatusPill><OriginBadge record={project} /></div></div><p className="mt-3 text-sm text-slate-400">{project.prosthesis_configuration || 'Configuration not set'}</p>{project.reason_for_cover && <p className="mt-2 line-clamp-2 text-xs text-slate-500">{project.reason_for_cover}</p>}<dl className="mt-3 grid grid-cols-2 gap-x-4 gap-y-1 text-xs text-slate-500"><dt>Due</dt><dd className="text-slate-400">{project.due_date || 'not set'}</dd><dt>Last activity</dt><dd className="text-slate-400">{project.updated_date?.slice(0, 10)}</dd></dl><div className="mt-4 flex items-center gap-2"><span className="btn-primary flex-1 text-center text-sm"><FolderOpen />Open Project</span>{onToggle && <button onClick={(e) => { e.preventDefault(); onToggle(project); }} className="icon-btn" aria-label={archived ? 'Restore project' : 'Archive project'}>{archived ? <RotateCcw /> : <Archive />}</button>}</div></Link>;
}