import Button from '~/src/components/Button';
import ErrorText from '~/src/components/ErrorText';
import { useI18n } from '~/src/lib/i18n';
import { Layout } from '~/src/ui/layouts/layout';

export const ErrorState = ({
  error,
  onRetry,
}: {
  error: Error;
  onRetry: () => void;
}) => {
  const { t } = useI18n('app');

  return (
    <Layout column align="center" justify="center" minHeight="6rem" gap="2">
      <ErrorText error={error} centered />
      <Button
        text={t('actions.retry')}
        onClick={() => {
          onRetry();
        }}
      />
    </Layout>
  );
};