"use client";

import { ProjectCard } from "@/components/ProjectCard";
import type { Project } from "@/data/projects";

interface MasonryGridProps {
  projects: Project[];
}

export function MasonryGrid({ projects }: MasonryGridProps) {
  return (
    <div className="columns-1 gap-6 space-y-6 sm:columns-2 lg:columns-3">
      {projects.map((project) => (
        <div key={project.id} className="break-inside-avoid">
          <ProjectCard project={project} />
        </div>
      ))}
    </div>
  );
}