'use client';

import { useEffect } from 'react';
import { useTranslations } from 'next-intl';
import { ErrorState } from '@/components/ui/error-state';

/**
 * C6 — route-level error boundary for the locale segment. A render-time throw in
 * any page now shows a localized, in-shell error card (header/footer stay
 * mounted, since this renders inside the [locale] layout) with a retry, instead
 * of escalating to the chrome-less whole-app `global-error`.
 */
export default function LocaleError({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) {
  const t = useTranslations('errors');
  const tCommon = useTranslations('common');

  useEffect(() => {
    // eslint-disable-next-line no-console
    console.error(error);
  }, [error]);

  return (
    <div className="mx-auto max-w-2xl px-4 py-16">
      <ErrorState heading={t('heading')} body={t('generic')} onRetry={reset} retryLabel={tCommon('retry')} />
    </div>
  );
}
