// ProjectCard primitive — the one way a project renders as a card (overview,
// future dashboards/switcher). Pure renderer: no fetching, no navigation —
// the parent decides what "open" means. See COMPONENTS.md.
function ProjectCard({ project, onOpen }) {
  return (
    <button onClick={() => onOpen(project.slug)}
      className="text-left bg-white border border-neutral-200 rounded-2xl p-5 shadow-sm hover:shadow-md hover:border-indigo-300 transition-all">
      <div className="font-bold text-neutral-800 mb-2">{project.name}</div>
      <div className="text-xs text-neutral-400 font-mono">
        PM {project.pmProjectId ?? "—"} · AL {project.alProjectId ?? "—"}
      </div>
      <div className="mt-4 text-sm font-semibold text-indigo-600">Open →</div>
    </button>
  );
}

window.ProjectCard = ProjectCard;