Allow anonymous users to access the website

I.e, without login or signup

browser-domain/src/App.tsx

@@ -1,5 +1,5 @@
 import { LogIn } from "./components/LogIn/LogIn";
-import { Navigate, Route, RouteProps, Routes } from "react-router";
+import { Navigate, Route, RouteProps, Routes, useNavigate, useParams } from "react-router";
 import { SignUp } from "./components/SignUp/SignUp";
 import { CreateAirline } from "./components/SignUp/CreateAirline";
 import { Home } from "./components/Home/Home";
@@ -7,35 +7,60 @@ import { CreateFlight } from "./components/CreateFlight/CreateFlight";
 import { Button } from "antd";
 import useAuth, { AuthProvider } from "./useAuth";
 import { EditFlight } from "./components/CreateFlight/EditFlight";
+import LandingPage from "./components/Landing/Landing";
 
 function Router() {
     const { user, logout, isAirline, isAdmin } = useAuth();
+    const navigate = useNavigate()
 
     return (
         <div className="App">
             <Routes>
-                <Route path="/login" element={<LogIn />} />
+                <Route path="/login" element={!user ? <LogIn /> : <Navigate to="/flights" />} />
                 <Route path="/signup" element={<SignUp />} />
-                <Route path="/create-airline" element={!isAdmin ? <LogIn /> : <CreateAirline />} />
+                <Route path="/create-airline" element={!isAdmin ? (!user ? <Navigate to="/login" state={"/create-airline"} /> : <Navigate to="/flights" />) : <CreateAirline />} />
-                <Route path="/home" element={!user ? <LogIn /> : <Home />} />
+                <Route path="/flights" element={<Home />} />
-                <Route path="/create-flight" element={!isAirline ? <LogIn /> : <CreateFlight />} />
+                <Route path="/create-flight" element={!isAirline ? (!user ? <Navigate to="/login" state={"/create-flight"} /> : <Navigate to="/flights" />) : <CreateFlight />} />
-                <Route path="/edit-flight/:id" element={!isAirline && !isAdmin ? <LogIn /> : <EditFlight />} />
+                <Route path="/edit-flight/:id" element={<EditFlightComponent />} />
-                <Route path="/" element={!user ? <LogIn /> : <Home />} />
+                <Route path="/" element={<LandingPage />} />
+                <Route path="*" element={<Navigate to="/" />} />
             </Routes>
+            {window.location.pathname != '/' &&
             <div className="LogoutButton">
-                {
+                {!!!localStorage.getItem("token") ?
+                     <Button
+                     onClick={() => navigate("/login")}
+                    >
+                     Login
+                    </Button>
+                :
                     <Button
                         onClick={logout}
-                        disabled={!!!localStorage.getItem("token")}
                     >
                         Logout
                     </Button>
                 }
             </div>
+            }
         </div>
     );
 }
 
+const EditFlightComponent = () => {
+    const { isAirline, isAdmin, user } = useAuth();
+    const params = useParams();
+  
+    if (!isAirline && !isAdmin) {
+      if (!user) {
+        return <Navigate to="/login" state={{ intendedPath: `/edit-flight/${params.id}` }} />;
+      } else {
+        return <Navigate to="/flights" />;
+      }
+    } else {
+      return <EditFlight />;
+    }
+  };
+
 function App() {
     return (
         <AuthProvider>

browser-domain/src/components/CreateFlight/CreateFlight.tsx

@@ -46,7 +46,7 @@ export const CreateFlight = () => {
         createFlight(newFlightData, token)
             .then((data) => {
                 setFlight(data);
-                navigate("/home")
+                navigate("/flights")
             })
             .catch((error) => {
                 try {

browser-domain/src/components/CreateFlight/EditFlight.tsx

@@ -52,7 +52,7 @@ export const EditFlight: React.FC<Props> = (props) => {
 
         editFlight(id, data, token)
             .then((data) => {
-                navigate("/home")
+                navigate("/flights")
             })
             .catch((error) => {
                 try {

browser-domain/src/components/Home/Home.tsx

@@ -75,6 +75,7 @@ export const Home: React.FC<Props> = (props) => {
         } else {
             newParams.delete("search")
         }
+        setCurrentPage(1)
         navigate(`?${newParams.toString()}`);
     };
 
@@ -90,7 +91,6 @@ export const Home: React.FC<Props> = (props) => {
             {isAdmin ? <button onClick={() => { navigate("/create-airline") }}>Create airline user</button> : <></>}
             <form onSubmit={handleSearchSubmit}>
                 <Space size={8} direction="horizontal">
-                    {/* <h2>Flights</h2> */}
                     <div style={{ display: 'flex' }}>
                     <Input
                         type="text"

browser-domain/src/components/Landing/Landing.css

@@ -0,0 +1,38 @@
+.LandingPageContainer {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+    text-align: center;
+  }
+  
+  .Title {
+    font-size: 2.5em;
+    margin-bottom: 20px;
+  }
+  
+  .Description {
+    font-size: 1.2em;
+    margin-bottom: 20px;
+  }
+  
+  .ButtonContainer {
+    display: flex;
+    gap: 20px;
+  }
+  
+  .StyledLink {
+    text-decoration: none;
+  }
+  
+  .StyledButton {
+    padding: 10px 20px;
+    font-size: 1.2em;
+    background-color: #3498db;
+    color: #fff;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+  }
+  

browser-domain/src/components/Landing/Landing.tsx

@@ -0,0 +1,39 @@
+import React from "react";
+import { Link, useNavigate } from "react-router-dom";
+import "./Landing.css";
+
+const LandingPage: React.FC = () => {
+  const navigate = useNavigate();
+
+  const handleSubscribeClick = () => {
+    navigate("/login");
+  };
+
+  const handleGoToFlightsClick = () => {
+    navigate("/flights");
+  };
+
+  return (
+    <div className="LandingPageContainer">
+      <h1 className="Title">Welcome to FIDS!</h1>
+      <p className="Description">
+        If you want to subscribe to flights, please create or log in to your account.
+      </p>
+      <div className="ButtonContainer">
+        <Link to="/login" className="StyledLink">
+          <button className="StyledButton" onClick={handleSubscribeClick}>Create an Account</button>
+        </Link>
+      </div>
+      <p className="Description">
+        Otherwise, you can continue to the flights page.
+      </p>
+      <div className="ButtonContainer">
+        <button className="StyledButton" onClick={handleGoToFlightsClick}>
+          Go to Flights
+        </button>
+      </div>
+    </div>
+  );
+};
+
+export default LandingPage;

browser-domain/src/components/LogIn/LogIn.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { Button, Input } from "antd";
 import useAuth from "../../useAuth";
-import { useNavigate } from "react-router";
+import { useLocation, useNavigate } from "react-router";
 
 export const LogIn = () => {
     const { login, loading, error } = useAuth();
@@ -9,6 +9,11 @@ export const LogIn = () => {
     const [password, setPassword] = useState("");
     const navigate = useNavigate();
 
+    const location = useLocation();
+    const { state } = location;
+
+    console.log(state)
+
     return (
         <div className="Box Small">
             <div className="Section">
@@ -27,7 +32,7 @@ export const LogIn = () => {
                     <Button
                         style={{ width: "100%" }}
                         onClick={async () =>
-                            login({ email, password })
+                            login({ email, password}, state)
                         }
                         name="Login"
                         loading={loading}

browser-domain/src/hooks/useCreateAirline.tsx

@@ -24,7 +24,7 @@ export const useCreateAirline = () => {
             const createResponse = await createAirlineAPI(credentials, token);
 
             if (createResponse.id) {
-                navigate("/home");
+                navigate("/flights");
             } else {
                 setError(createResponse.message);
             }

browser-domain/src/hooks/useCreateUser.tsx

@@ -16,7 +16,7 @@ export const useCreateUser = () => {
             const createResponse = await createUserAPI(credentials);
 
             if (createResponse.id) {
-                login(credentials);
+                login(credentials, null)
             } else {
                 setError(createResponse.message);
             }

browser-domain/src/useAuth.tsx

@@ -11,7 +11,7 @@ interface AuthContextType {
     isAdmin: boolean;
     token?: string;
     error?: any;
-    login: (credentials: Credentials) => void;
+    login: (credentials: Credentials, url: string | null) => void;
     signUp: (email: string, name: string, password: string) => void;
     logout: () => void;
 }
@@ -71,7 +71,7 @@ export function AuthProvider({
         }
     }, []);
 
-    function login(credentials: Credentials) {
+    function login(credentials: Credentials, url: string | null) {
         setLoading(true);
         const tokens = logIn(credentials)
             .then((x) => {
@@ -83,7 +83,7 @@ export function AuthProvider({
                     .then(y => {
                         setUser(y);
                         setToken(x.access_token)
-                        navigate("/home")
+                        navigate(url ? url : "/flights")
                     })
                     .catch((error) => {
                         try {
@@ -107,7 +107,7 @@ export function AuthProvider({
         localStorage.removeItem("token");
         setUser(undefined);
         setToken(undefined)
-        navigate("/login")
+        navigate("/")
     }
 
     const memoedValue = useMemo(