import { Routes, Route, Navigate } from  "react-router-dom";
import { Toaster } from "react-hot-toast"
import useAuthStore from "./store/useAuthStore.js";
import { useEffect } from "react";
import Navbar from "./components/Navbar.jsx";
import TaskManager from "./components/TaskManager.jsx";
import Login from "./components/Login.jsx";
import Register from "./components/Register.jsx";
function App() {
  const { isLoggedIn, checkAuth, user } = useAuthStore();
  useEffect(() =>{
    checkAuth()
  }, [])
  return (
    <div className='flex flex-row'>
      <Toaster />
      <Navbar isLoggedIn={isLoggedIn} user={user} />
      <Routes>
        <Route path="/" element={isLoggedIn ? <TaskManager /> : <Login />} />
        <Route path="/register" element={!isLoggedIn ? <Register /> : <Navigate to="/" />} />
        <Route path="/login" element={!isLoggedIn ? <Login /> : <Navigate to="/" />} />
        <Route path="*" element={<Navigate to="/" />} />
      </Routes>
    </div>
  )
}

export default App