import React, { FC } from 'react';
import ModalRedesign from '../../blocks/ModalRedesign';
import IconStop from '../../assets/icons/icon_stop.svg';
import css from './index.module.css';

export interface InternetExplorerAlertProps {
  onClose: () => void;
  translations: {
    title: string;
    lead: string;
  };
}
const InternetExplorerAlert: FC<InternetExplorerAlertProps> = ({
  onClose,
  translations,
}) => {
  return (
    <ModalRedesign withAnimation={false} onRequestClose={onClose} isOpen={true}>
      <div className={css.alert}>
        <div className={css.alert__icon}>
          <IconStop />
        </div>
        <h2>{translations.title}</h2>
        <div className="lead-2">{translations.lead}</div>
      </div>
    </ModalRedesign>
  );
};

export default InternetExplorerAlert;