diff --git a/frontend/src/components/Posts.jsx b/frontend/src/components/Posts.jsx index 0f72a74..f0f1a0f 100644 --- a/frontend/src/components/Posts.jsx +++ b/frontend/src/components/Posts.jsx @@ -14,8 +14,9 @@ import { import axios from "axios"; import CreatePost from "./CreatePosts"; import InfiniteScroll from "react-infinite-scroll-component"; -import { useNavigate } from "react-router-dom"; +import { Navigate, useNavigate } from "react-router-dom"; import SearchBar from "./SearchBar"; +import { useUser } from "../hook/useUser"; const Posts = () => { const [posts, setPosts] = useState([]); const [communities, setCommunities] = useState([]); @@ -24,6 +25,7 @@ const Posts = () => { const [selectedCommunity, setSelectedCommunity] = useState("all"); const [allCommunities, setAllCommunities] = useState([]); const [page, setPage] = useState(1); + const { userDeatils} = useUser(); const navigate = useNavigate(); const fetchPosts = async () => { @@ -132,7 +134,8 @@ const Posts = () => { ); window.location.reload(); }; - + if (loading) return <div>Loading...</div>; + if (!userDeatils) return <Navigate to="/login" />; return ( <Container centerContent> <SearchBar /> diff --git a/frontend/src/components/chatroomui/chatroom.jsx b/frontend/src/components/chatroomui/chatroom.jsx index a05c5f0..7f5fff3 100644 --- a/frontend/src/components/chatroomui/chatroom.jsx +++ b/frontend/src/components/chatroomui/chatroom.jsx @@ -2,6 +2,7 @@ import React, { useEffect, useRef, useState } from "react"; import useWebSocket from "react-use-websocket"; import { ReadyState } from "react-use-websocket"; import axios from "axios"; +import { Navigate } from "react-router-dom"; const Chatroom = () => { const userId = localStorage.getItem("userId"); @@ -10,6 +11,7 @@ const Chatroom = () => { const [prevMsg, setPrevMsg] = useState([]); const [myMsg, setMyMsg] = useState(""); const messageEndRef = useRef(null); + const {loading, userDeatils} = useUser(); const { sendJsonMessage, lastJsonMessage, readyState } = useWebSocket('ws://localhost:8080'); @@ -65,7 +67,12 @@ const Chatroom = () => { } }, [allMsg]); - + if (loading) { + return <div>Loading...</div>; + } + if (!userDeatils) { + return <Navigate to="/login" />; + } // Submit message function const submit = () => { diff --git a/frontend/src/components/chatroomui/createRoom1.jsx b/frontend/src/components/chatroomui/createRoom1.jsx index a0963e1..b4f8827 100644 --- a/frontend/src/components/chatroomui/createRoom1.jsx +++ b/frontend/src/components/chatroomui/createRoom1.jsx @@ -1,7 +1,7 @@ import axios from 'axios'; import React, { useEffect, useState } from 'react'; import { useUser } from '../../hook/useUser'; -import { useNavigate } from 'react-router-dom'; +import { Navigate, useNavigate } from 'react-router-dom'; import { useToast } from '@chakra-ui/react'; const Createroom1 = () => { @@ -96,6 +96,11 @@ const Createroom1 = () => { } if (loading) return <div className="flex justify-center items-center h-screen text-xl text-gray-400">Loading...</div>; + if (!userDetails) { + + return <Navigate to="/homepage" />; + + } return ( <div className="min-h-screen bg-gray-900 flex flex-col items-center justify-center py-10"> diff --git a/frontend/src/components/chatroomui/main.jsx b/frontend/src/components/chatroomui/main.jsx index 65ae8cd..eb76ffd 100644 --- a/frontend/src/components/chatroomui/main.jsx +++ b/frontend/src/components/chatroomui/main.jsx @@ -1,8 +1,10 @@ import React, { useEffect, useState } from "react"; -import { Outlet, useNavigate } from "react-router-dom"; +import { Navigate, Outlet, useNavigate } from "react-router-dom"; import { useContext } from "react"; import { chatRoomApi } from "../contexts/chatRoomApi"; import axios from "axios"; +import { useUser } from "../../hook/useUser"; + function Createroom() { //@ts-ignore @@ -121,6 +123,8 @@ function Joinroom() { function Mainbuttons() { const navigate = useNavigate(); + const {loading, userDetatails} = useUser(); + const createroom = () => { console.log("creating the rooms"); navigate("/room/createroom"); @@ -130,6 +134,13 @@ function Mainbuttons() { navigate("/room/joinroom"); console.log("joining the rooms"); }; + if (loading) { + return <div>Loading...</div>; + } + if (!userDetatails) { + + return <Navigate to="/login" />; + } return ( <div> <button onClick={createroom}>createroom</button> diff --git a/frontend/src/components/homePage/HomePage.jsx b/frontend/src/components/homePage/HomePage.jsx index e4bb307..7df5cb2 100644 --- a/frontend/src/components/homePage/HomePage.jsx +++ b/frontend/src/components/homePage/HomePage.jsx @@ -1,5 +1,5 @@ import React, { useEffect } from 'react'; -import { useNavigate } from 'react-router-dom'; +import { Link, useNavigate } from 'react-router-dom'; import { gsap } from 'gsap'; import { ScrollTrigger } from 'gsap/ScrollTrigger'; import image from '../../images/image7.png'; @@ -53,10 +53,10 @@ export const Header = () => { <span className='pt-1'>Campus Chatter</span> </div> <div className="hidden md:flex space-x-6"> - <a href="/" className="hover:text-purple-500">Home</a> - <a href="/" className="hover:text-purple-500">Post</a> - <a href="/" className="hover:text-purple-500">Room</a> - <a href="/" className="hover:text-purple-500">Contact</a> + <Link to="/homepage" className="hover:text-purple-500 ">Home</Link> + <Link to="/posts" className="hover:text-purple-500 ">Post</Link> + <Link to="/room" className="hover:text-purple-500">Room</Link> + <Link to="/" className="hover:text-purple-500">contact</Link> </div> <button className="bg-purple-500 text-white rounded-full px-4 py-2 font-bold hover:bg-purple-600" onClick={() => { navigate('/signup') }}> Sign up diff --git a/frontend/src/components/routes/mainroute.jsx b/frontend/src/components/routes/mainroute.jsx index b690f66..1d38e5d 100644 --- a/frontend/src/components/routes/mainroute.jsx +++ b/frontend/src/components/routes/mainroute.jsx @@ -67,7 +67,7 @@ const Mainrouter = createBrowserRouter([ { path: "/", - element: <Navbar />, + element: <Navbar btnName="Logout" navigateUrl="/logout" display={true}/>, children: [ {