// app/error.tsx
"use client";

import Link from "next/link";

export default function Error({
  error,
  reset,
}: {
  error: Error;
  reset: () => void;
}) {
  return (
    <div className="h-screen flex flex-col items-center justify-center text-center text-white bg-black px-4">
      <h1 className="text-3xl font-bold text-red-500 mb-4">Something went wrong</h1>
      <p className="mb-6 text-gray-300">{error.message}</p>
      <div className="flex gap-4">
        <button
          onClick={reset}
          className="bg-white text-black px-4 py-2 rounded hover:bg-gray-200"
        >
          Try again
        </button>
        <Link
          href="/"
          className="border border-white px-4 py-2 rounded hover:bg-white hover:text-black"
        >
          Go home
        </Link>
      </div>
    </div>
  );
}