import { Link } from "@inertiajs/react";

export default function Pagination({ links }) {
  if (!links || links.length === 0) return null;

  return (
    <nav className="flex justify-center mt-6 space-x-1">
      {links.map((link, i) => (
        <Link
          key={i}
          href={link.url ?? "#"}
          className={`px-3 py-1.5 text-sm rounded-md border transition ${
            link.active
              ? "bg-blue-600 text-white border-blue-600"
              : "bg-white dark:bg-gray-800 dark:text-gray-300 border-gray-300 hover:bg-gray-100"
          } ${!link.url ? "opacity-50 cursor-not-allowed" : ""}`}
          dangerouslySetInnerHTML={{ __html: link.label }}
        />
      ))}
    </nav>
  );
}