"use client";

import { CodingProject } from "@/content/cv/portfolio";
import ProjectItem from "./project-item";

interface ProjectListProps {
  projects: CodingProject[];
  onTagClick?: (tagSlug: string) => void;
  selectedTags?: string[];
}

export default function ProjectList({
  projects,
  onTagClick,
  selectedTags = [],
}: ProjectListProps) {
  if (projects.length === 0) {
    return (
      <div className="bg-white py-24">
        <div className="mx-auto max-w-7xl px-6 lg:px-8">
          <div className="text-center">
            <h3 className="text-lg font-medium text-gray-900 mb-2">
              No projects found
            </h3>
            <p className="text-gray-600">
              Try adjusting your filters to see more results.
            </p>
          </div>
        </div>
      </div>
    );
  }

  return (
    <div className="bg-white py-16">
      <div className="mx-auto max-w-7xl px-6 lg:px-8">
        <div className="mx-auto max-w-4xl">
          {projects.map((project) => (
            <ProjectItem
              key={project.title}
              project={project}
              onTagClick={onTagClick}
              selectedTags={selectedTags}
            />
          ))}
        </div>
      </div>
    </div>
  );
}
