import Stack from '@material-hu/mui/Stack';

import StateCard from '@material-hu/components/design-system/StateCard';

import { useLokaliseTranslation } from 'src/utils/i18n';

type ArticleErrorProps = {
  onRetry: () => void;
};

export const ArticleError = ({ onRetry }: ArticleErrorProps) => {
  const { t } = useLokaliseTranslation('general');

  return (
    <Stack sx={{ width: '100%', m: 3 }}>
      <StateCard
        variant="error"
        title={t('error_general')}
        description={t('error_description')}
        primaryAction={{
          label: t('retry'),
          onClick: onRetry,
        }}
      />
    </Stack>
  );
};