55 lines
1.7 KiB
JavaScript
55 lines
1.7 KiB
JavaScript
import React from "react";
|
|
import Modal from "../../components/ui/Modal.jsx";
|
|
import cookiesModalCover from "../../assets/img/illustrations/cookies-modal-cover.svg";
|
|
import { Link } from "react-router-dom";
|
|
import { useUser } from "../../hooks/useUser.jsx";
|
|
|
|
export default function CookiesModal() {
|
|
const { screensTranslations, hasConsentedCookies, setHasConsentedCookies, acceptCookies } = useUser();
|
|
|
|
if (
|
|
!screensTranslations ||
|
|
!screensTranslations.pagesName ||
|
|
!screensTranslations.cookies ||
|
|
!screensTranslations.ui
|
|
)
|
|
return <p>loading</p>;
|
|
const cookiesTranslations = screensTranslations.cookies;
|
|
const pagesName = screensTranslations.pagesName;
|
|
const uiTranslations = screensTranslations.ui;
|
|
|
|
return (
|
|
<Modal
|
|
unclosable
|
|
className='classic-modal'
|
|
id='modal-cookies'
|
|
open={!hasConsentedCookies}
|
|
onClose={setHasConsentedCookies}>
|
|
<div className='modal-content-container modal-content-container--centered '>
|
|
<div className='modal-content-container__content'>
|
|
<img
|
|
className='modal-content-container__modal-cover'
|
|
src={cookiesModalCover}
|
|
alt='close'
|
|
/>
|
|
<h3 className='titling-construction '>{cookiesTranslations.title}</h3>
|
|
<p className='explanation'>{cookiesTranslations.description}</p>
|
|
<div className='pages-redirection'>
|
|
<Link to='/confidentiality' className='classic-link'>
|
|
{pagesName.confidentiality}
|
|
</Link>
|
|
<Link to='/data' className='classic-link'>
|
|
{pagesName.cookies}
|
|
</Link>
|
|
</div>
|
|
<button
|
|
className='cta cta--lhoist cta--schief cta--zuume cta--spaced-normal'
|
|
onClick={acceptCookies}>
|
|
{uiTranslations.continue}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</Modal>
|
|
);
|
|
}
|