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

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

import { useSessionStatus } from '../../hooks/useSessionStatus';

export const SessionStatusAlert = () => {
  const { t } = useLokaliseTranslation('learning');
  const { blockSessionEdition, sessionStatus } = useSessionStatus();

  if (!blockSessionEdition) return null;

  return (
    <Alert
      severity="warning"
      title={t(`session.status.alerts.${sessionStatus.toLowerCase()}.title`)}
      description={t(
        `session.status.alerts.${sessionStatus.toLowerCase()}.description`,
      )}
    />
  );
};