'use client'

import { useEffect } from 'react'
import Link from 'next/link'
import { Button } from '@/components/ui/button'

export default function Error({
  error,
  reset,
}: {
  error: Error & { digest?: string }
  reset: () => void
}) {
  useEffect(() => {
    console.error(error)
  }, [error])

  return (
    <div className="flex min-h-[60vh] flex-col items-center justify-center gap-6 px-4 text-center">
      <h2 className="text-xl font-semibold text-foreground">خطایی رخ داد</h2>
      <p className="text-muted-foreground max-w-md text-sm">
        لطفاً دوباره تلاش کنید یا به صفحه اصلی برگردید.
      </p>
      <div className="flex flex-wrap gap-3 justify-center">
        <Button onClick={() => reset()}>تلاش مجدد</Button>
        <Button asChild variant="outline">
          <Link href="/">صفحه اصلی</Link>
        </Button>
      </div>
    </div>
  )
}