// Cross-project landing: composes window.ProjectCard. Progress/review counts
// arrive in slice 2 (live board data); slice 1 shows identity + boards + Open.
function ProjectsOverview({ projects }) {
  return (
    <div className="max-w-5xl mx-auto p-8">
      <h1 className="text-2xl font-bold text-neutral-800 mb-1">Projects</h1>
      <p className="text-neutral-500 mb-6">Pick a project to open its live board.</p>
      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
        {projects.map((p) => (
          <window.ProjectCard key={p.slug} project={p} onOpen={(slug) => window.navigate(`/projects/${slug}`)} />
        ))}
        <div className="border border-dashed border-neutral-300 rounded-2xl p-5 flex items-center justify-center text-neutral-400" title="Create-project arrives in a later slice">
          + New project
        </div>
      </div>
      {projects.length === 0 && (
        <div className="text-neutral-400 mt-6">No projects configured. Add one to <code>assembly-line-frontend/projects.json</code>.</div>
      )}
    </div>
  );
}

window.ProjectsOverview = ProjectsOverview;