"use client";

import Link from "next/link";
import { TriangleAlert } from "lucide-react";

import { EmptyState } from "@/components/ui/EmptyState";
import { Button } from "@/components/ui/Button";
import { buttonClass } from "@/lib/ui/variants";

interface ErrorBoundaryProps {
  error: Error & { digest?: string };
  reset: () => void;
}

export default function Error({ reset }: ErrorBoundaryProps) {
  return (
    <main className="flex min-h-screen items-center justify-center bg-bg px-6 py-16">
      <div className="w-full max-w-md">
        <EmptyState
          icon={TriangleAlert}
          title="出错了"
          description="刚才的操作没能完成。可以重试，或先回到作品库。"
          action={
            <div className="flex items-center justify-center gap-2">
              <Button variant="primary" onClick={reset}>
                重试
              </Button>
              <Link href="/" className={buttonClass({ variant: "secondary" })}>
                返回作品库
              </Link>
            </div>
          }
        />
      </div>
    </main>
  );
}