import type { LucideIcon } from "lucide-react";
import { CircleCheckBig } from "lucide-react";
import { Card } from "@/components/ui/card";

export function EmptyState({ title, description, icon: Icon = CircleCheckBig }: { title: string; description: string; icon?: LucideIcon }) {
  return (
    <Card className="flex min-h-52 flex-col items-center justify-center p-8 text-center">
      <div className="mb-4 rounded-control bg-accent/10 p-3 text-accent"><Icon className="size-6" /></div>
      <h2 className="text-lg font-semibold">{title}</h2>
      <p className="mt-2 max-w-md text-sm leading-6 text-muted">{description}</p>
    </Card>
  );
}