'use client'

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

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

  return (
    <div className="mx-auto max-w-2xl rounded-lg border border-red-200 bg-red-50 p-6 text-red-900 dark:border-red-900 dark:bg-red-950/30 dark:text-red-100">
      <h2 className="text-lg font-semibold">Une erreur est survenue dans l'administration</h2>
      <p className="mt-2 text-sm opacity-90">
        Le rendu de cette page a echoue. Vous pouvez reessayer sans recharger toute l'application.
      </p>
      <div className="mt-4">
        <Button type="button" onClick={reset}>
          Reessayer
        </Button>
      </div>
    </div>
  )
}