import { IconPlayerPause } 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';

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

  return (
    <Stack sx={{ width: '100%', minWidth: 0 }}>
      <StateCard
        icon={IconPlayerPause}
        title={t('paused.title')}
        description={t('paused.message')}
        slotProps={{
          card: {
            sx: {
              width: '100%',
            },
          },
        }}
      />
    </Stack>
  );
};

export default PlanPausedState;