404} />
@@ -25,14 +36,34 @@ function App() {
const PrivateRoute = () => {
- const { isAuthenticated } = useContext(AuthContext);
+ const { token } = useAuth();
const location = useLocation();
+ const [checked, setChecked] = useState(false);
+ const [isValid, setIsValid] = useState(false);
+
+ useEffect(() => {
+ const checkAuth = async () => {
+ if (!token) {
+ setIsValid(false);
+ setChecked(true);
+ return;
+ }
+ const result = await ping(token);
+ console.log(result)
+ setIsValid(result);
+ setChecked(true);
+ };
+ checkAuth();
+ }, [token]);
+
+ if (!checked) {
+ return Checking server availability...
;
+ }
return (
- isAuthenticated === true ?
-
- :
-
+ isValid
+ ?
+ :
);
}
diff --git a/src/auth/auth-provider.tsx b/src/auth/auth-provider.tsx
index 93aeac1..cf99ebf 100644
--- a/src/auth/auth-provider.tsx
+++ b/src/auth/auth-provider.tsx
@@ -9,7 +9,7 @@ type AuthContextType = {
const AuthContext = createContext({
token: null,
- setToken: () => { },
+ setToken: () => {},
});
@@ -20,15 +20,19 @@ export const AuthProvider = ({ children }: { children: JSX.Element }) => {
const savedToken = localStorage.getItem("token");
if (savedToken) {
setTokenState(savedToken);
+ console.log("meow")
}
+ console.log(savedToken)
}, []);
const setToken = (newToken: string | null) => {
setTokenState(newToken);
if (newToken) {
localStorage.setItem("token", newToken);
+ console.log("saved")
} else {
localStorage.removeItem("token");
+ console.log("removed")
}
};
diff --git a/src/auth/auth.tsx b/src/auth/auth.tsx
index a514003..3a34f25 100644
--- a/src/auth/auth.tsx
+++ b/src/auth/auth.tsx
@@ -3,9 +3,7 @@ import AuthContext from "./auth-provider"
function useAuth() {
- return (
- useContext(AuthContext)
- );
+ return useContext(AuthContext);
}
export default useAuth;
diff --git a/src/auth/logout.tsx b/src/auth/logout.tsx
index 51d8511..75c1d9d 100644
--- a/src/auth/logout.tsx
+++ b/src/auth/logout.tsx
@@ -1,12 +1,15 @@
+import { useNavigate } from "react-router-dom";
import useAuth from "./auth";
-const logout = () => {
- // eslint-disable-next-line react-hooks/rules-of-hooks
- const { setToken: setAuth } = useAuth();
+
+const useLogout = () => {
+ const { setToken } = useAuth();
+ const navigate = useNavigate();
return () => {
- setAuth(false);
+ setToken(null);
+ navigate("/login");
};
}
-export default logout;
+export default useLogout;
diff --git a/src/auth/ping.tsx b/src/auth/ping.tsx
index 93427be..753508c 100644
--- a/src/auth/ping.tsx
+++ b/src/auth/ping.tsx
@@ -1,16 +1,10 @@
-const ping = () => {
+const ping = async (token: string | null): Promise => {
// TODO: request to API
- return () => {
- return true;
- };
-}
-
-// const ping = async (token: string): Promise => {
-// return new Promise((resolve) => {
-// setTimeout(() => {
-// resolve(!!token);
-// }, 300);
-// });
-// };
+ return new Promise((resolve) => {
+ setTimeout(() => {
+ resolve(!!token);
+ }, 300);
+ });
+};
export default ping;
diff --git a/src/pages/dashboard/dashboard.tsx b/src/pages/dashboard/dashboard.tsx
index e69de29..9d72125 100644
--- a/src/pages/dashboard/dashboard.tsx
+++ b/src/pages/dashboard/dashboard.tsx
@@ -0,0 +1,9 @@
+const Dashboard = () => {
+ return (
+
+
Dashboard
+
+ )
+}
+
+export default Dashboard;
diff --git a/src/pages/home/home.tsx b/src/pages/home/home.tsx
index 225a0cb..305dd86 100644
--- a/src/pages/home/home.tsx
+++ b/src/pages/home/home.tsx
@@ -1,11 +1,23 @@
+import { useNavigate } from "react-router-dom";
+import useAuth from "../../auth/auth";
+
import { Link } from 'react-router-dom';
-import logout from "../../auth/logout"
+import useLogout from "../../auth/logout"
+
const Home = () => {
+ const { setToken } = useAuth();
+ const navigate = useNavigate();
+
+ const handleLogout = () => {
+ setToken(null);
+ navigate("/login");
+ };
+
return (
Home
-