Newer
Older
import React from 'react'
import './connectionInfoCreationEnedisAccountModal.scss'
import { useI18n } from 'cozy-ui/transpiled/react/I18n'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
import Icon from 'cozy-ui/transpiled/react/Icon'
import IconButton from '@material-ui/core/IconButton'
import CloseIcon from 'assets/icons/ico/close.svg'
interface ConnectionInfoCreationEnedisAccountModalProps {
open: boolean
handleCloseClick: () => void
}
const ConnectionInfoCreationEnedisAccountModal: React.FC<ConnectionInfoCreationEnedisAccountModalProps> = ({
open,
handleCloseClick,
}: ConnectionInfoCreationEnedisAccountModalProps) => {
const { t } = useI18n()
return (
<Dialog
open={open}
disableBackdropClick
disableEscapeKeyDown
onClose={handleCloseClick}
aria-labelledby={'accessibility-title'}
classes={{
root: 'modal-root',
paper: 'modal-paper',
}}
>
<div id={'accessibility-title'}>
{t('auth.enedisgrandlyon.infoModal.accessibility.window_title')}
'auth.enedisgrandlyon.infoModal.accessibility.button_close'
)}
className="modal-paper-close-button"
onClick={handleCloseClick}
>
<Icon icon={CloseIcon} size={16} />
</IconButton>
<div className="enedisInfoModal">
<p className="text-16-normal">
{t('auth.enedisgrandlyon.infoModal.text1')}
<br />
{t('auth.enedisgrandlyon.infoModal.text2')}
</p>
<p className="text-16-normal">
{t('auth.enedisgrandlyon.infoModal.text3')}
</p>
<p className="text-16-normal">
{t('auth.enedisgrandlyon.infoModal.text4')}
</p>
<p className="text-16-normal">
{t('auth.enedisgrandlyon.infoModal.text5')}
</p>
<p className="text-16-normal">
{t('auth.enedisgrandlyon.infoModal.text6')}
<br />
{t('auth.enedisgrandlyon.infoModal.text7')}
</p>
'auth.enedisgrandlyon.infoModal.accessibility.buttonText'
</Button>
</div>
</Dialog>
)
}
export default ConnectionInfoCreationEnedisAccountModal