import { IconClockHour4 } 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 PlanPendingDisbursementState = () => {
  const { t } = useLokaliseTranslation('loans');

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

export default PlanPendingDisbursementState;