FunctionProject/website/contexts/UserContext.jsx

import { createContext, useState, useEffect } from 'react'
import Cookies from 'universal-cookie'
import api from '../utils/api'

const cookies = new Cookies()

export const UserContext = createContext()

function UserContextProvider (props) {
  const [user, setUser] = useState(null)
  const [isAuth, setIsAuth] = useState(false)
  const [loginLoading, setLoginLoading] = useState(false)
  const [messageLogin, setMessageLogin] = useState('')

  useEffect(() => {
    const newUser = cookies.get('user')
    if (newUser != null) {
      setIsAuth(true)
      setUser(newUser)
    }
  }, [])

  useEffect(() => {
    if (isAuth) {
      setMessageLogin('<p class="form-error"><b>Erreur:</b> Vous devez être déconnecter avant de vous connecter.</p>')
    } else {
      setMessageLogin('')
    }
  }, [isAuth])

  const logoutUser = () => {
    cookies.remove('user', { path: '/' })
    setUser(null)
    setIsAuth(false)
  }

  const loginUser = async ({ email, password }) => {
    setLoginLoading(true)
    try {
      const response = await api.post('/users/login', { email, password })
      const newUser = response.data
      cookies.remove('user', { path: '/' })
      cookies.set('user', newUser, { path: '/', maxAge: newUser.expiresIn })
      setUser(newUser)
      setIsAuth(true)
      setMessageLogin('<p class="form-success"><b>Succès:</b> Connexion réussi!</p>')
      setLoginLoading(false)
    } catch (error) {
      setMessageLogin(`<p class="form-error"><b>Erreur:</b> ${error.response.data.message}</p>`)
      setLoginLoading(false)
      setIsAuth(false)
      setUser(null)
    }
  }

  return (
    <UserContext.Provider value={{ user, loginUser, logoutUser, loginLoading, messageLogin, isAuth, setMessageLogin }}>
      {props.children}
    </UserContext.Provider>
  )
}

export default UserContextProvider