import { IconCheck } from '@material-hu/icons/tabler';
import Stack from '@material-hu/mui/Stack';

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

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

export const SuccessStep = () => {
  const { t } = useLokaliseTranslation('loans');

  return (
    <Stack
      sx={{
        width: '100%',
        minWidth: 0,
      }}
    >
      <StateCard
        variant="success"
        icon={IconCheck}
        title={t('success.title')}
        description={t('success.message')}
        slotProps={{
          card: {
            sx: {
              width: '100%',
              py: 4,
            },
          },
        }}
      />
    </Stack>
  );
};
