import styles from "./Footer.module.css"
import {Link} from "react-router";
import {useState} from "react";
import Modal from "../ui/modal/modal.jsx";
import Button from "../ui/button/button.jsx";
import scrollToTop from "../../utils/scrollToTop.js";

export default function Footer(){
    const currentYear = new Date().getFullYear();
    const [isCopyrightModal, setIsCopyrightModal] = useState(false);


    return <>
        <footer className={`${styles.footer} glassCard`}>
            <div className={styles.footerContent}>
                <Button
                    variant={"transparent"}
                    className={styles.link}
                    onClick={() => setIsCopyrightModal(true)}
                >
                    Copyright © {currentYear}. Tous droits réservés.
                </Button>

                <div className={styles.copyright}>

                </div>

                <nav className={styles.footerNav}>
                    <Link to="/RGPD" className={styles.link} onClick={scrollToTop}>
                        Fiche RGPD
                    </Link>
                    <span className={styles.separator}></span>
                    <Link to="/legalNotices" className={styles.link} onClick={scrollToTop}>
                        Mentions légales
                    </Link>
                    <span className={styles.separator}></span>
                    <Link to={"https://comite.beaupont.fr/contactez-nous"} className={styles.link}>
                        Contact
                    </Link>
                    <span className={styles.separator}></span>
                    <Link to="/" className={styles.link} onClick={scrollToTop}>
                        Accueil
                    </Link>
                </nav>
            </div>
        </footer>

        {/* TODO : mettre nos noms dans un fichier de configuration */}
        <Modal title={"Réalisé par"} open={isCopyrightModal} onClose={() => setIsCopyrightModal(false)}>
            <section className={styles.section}>
                <div className={styles.inputContainer}>
                    <p>Quentin T'jampens</p>
                    <p>Antoine Ordonneau</p>
                    <p>Malo Leblond</p>
                    <p>
                        Giovanni Josserand (
                        <Link to={"https://linktree.josserand.ovh/"}>linktree</Link>
                        )
                    </p>
                </div>
            </section>
        </Modal>
    </>
}