import styles from '../../styles/Parcourir.module.css'
import Header from "../../Component/Page/Header";
import Container from "../../Component/Page/Container";
import useTranslation from "next-translate/useTranslation";
import TextContainerWithBorder from "../../Component/TextContainerWithBorder/TextContainerWithBorder";
import {useRouter} from "next/router";
import Separator from "../../Component/Separator/Separator";
import Menu from "../../Component/Menu/Menu";
import setLanguage from "next-translate/setLanguage";
import {LANGUAGE} from "../../const/env";

export default function Index() {
    const { t } = useTranslation('common')
    const router = useRouter()

    const navigateTo = (path: string) => {
        router.push(path)
    }

    const setLanguages = async (language: string) => {
        localStorage.setItem(LANGUAGE, language)
        await setLanguage(language)

        router.push('/')
    }

  return (
    <Container className={styles.container}>
        <Header  title={"MENU_PARAMETRE"} />

      <main className={styles.main}>
          <TextContainerWithBorder>
<>
    <div className={styles.menu} onClick={() => setLanguages('fr')} >{t('MENU_LANGUE')}</div>
    <Separator />
    <div className={styles.menu} onClick={() => setLanguages('en')} >{t('MENU_IDENTIFICATION')}</div>

</>
          </TextContainerWithBorder>
      </main>
        <Menu  />

    </Container>
  )
}