resources/js/components/App.js

   1 import axios from 'axios';
   2 import React, { useEffect, useState } from 'react';
   3 import { BrowserRouter, Route, Routes } from 'react-router-dom';
   4
   5 import Header from './common/Header';
   6 import Front from './pages/Front';
   7 import UserContext from '../helpers/UserContext';
   8
   9 const App = () => {
  10         const [user, setUser] = useState(null);
  11
  12         const checkAuth = async () => {
  13                 try {
  14                         const response = await axios.get('/api/user');
  15                         setUser(response.data);
  16                 } catch (e) {
  17                         setUser(null);
  18                 }
  19         };
  20
  21         const doLogout = async () => {
  22                 await axios.post('/logout');
  23                 await checkAuth();
  24         };
  25
  26         useEffect(() => {
  27                 let timer = null;
  28                 axios
  29                         .get('/sanctum/csrf-cookie')
  30                         .then(() => {
  31                                 checkAuth();
  32                                 timer = setInterval(checkAuth, 15 * 60 * 1000);
  33                         });
  34                 return () => {
  35                         if (timer) clearInterval(timer);
  36                 };
  37         }, []);
  38
  39         return <BrowserRouter>
  40                 <UserContext.Provider value={user}>
  41                         <Header doLogout={doLogout} />
  42                         {user ?
  43                                 <Routes>
  44                                         <Route path="*" element={<Front />} />
  45                                 </Routes>
  46                         : <Front />}
  47                 </UserContext.Provider>
  48         </BrowserRouter>;
  49 };
  50
  51 export default App;