diff --git a/backend/src/controllers/userControllers.ts b/backend/src/controllers/userControllers.ts
index 4208765..a050050 100644
--- a/backend/src/controllers/userControllers.ts
+++ b/backend/src/controllers/userControllers.ts
@@ -55,7 +55,8 @@ const googleSignInOrSignUp = asyncHandler(
       sameSite: "lax",
     });
     const username = user.username;
-    res.status(200).json({ isCollegeEmail, username });
+    const userId = user.user_id;
+    res.status(200).json({ isCollegeEmail, username, userId });
   }
 );
 
@@ -318,6 +319,7 @@ const getCurrentUserDetails = asyncHandler(
         user_id: true,
         email: true,
         username: true,
+        pic: true,
         userCourses: {
           select: {
             Course: {
diff --git a/frontend/src/components/AddUsername.jsx b/frontend/src/components/AddUsername.jsx
index b5f427f..414c8d4 100644
--- a/frontend/src/components/AddUsername.jsx
+++ b/frontend/src/components/AddUsername.jsx
@@ -71,7 +71,7 @@ const AddUsername = () => {
       setLoading(false);
       toast({
         title: "Error",
-        description: "Error adding username.",
+        description: err.response?.data.message || "An error occurred",
         status: "error",
         duration: 3000,
         isClosable: true,
diff --git a/frontend/src/components/EditDetails.jsx b/frontend/src/components/EditDetails.jsx
index 76bba6c..c44be20 100644
--- a/frontend/src/components/EditDetails.jsx
+++ b/frontend/src/components/EditDetails.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import {
   Box,
   FormControl,
@@ -8,6 +8,8 @@ import {
   VStack,
   useToast,
   Flex,
+  Avatar,
+  Text,
 } from "@chakra-ui/react";
 import { z } from "zod";
 import axios from "axios";
@@ -41,24 +43,31 @@ const EditDetails = () => {
     setFormData({ ...formData, pic: e.target.files[0] });
   };
 
-  if (loadingUser) {
-    return (
-      <Flex minH="100vh" align="center" justify="center" bg="black">
-        <InfinitySpin color="#3182CE" size={80} />
-      </Flex>
-    );
-  }
-  if (!userDetails) {
-    toast({
-      title: "Error",
-      description: "You need to be logged in to access this page.",
-      status: "error",
-      duration: 3000,
-      isClosable: true,
-    });
-    navigate("/login");
-    return;
-  }
+  useEffect(() => {
+    if (loadingUser) return;
+
+    if (!userDetails) {
+      toast({
+        title: "Error",
+        description: "You need to be logged in to access this page.",
+        status: "error",
+        duration: 3000,
+        isClosable: true,
+      });
+      navigate("/login");
+    } else if (userDetails.username === null) {
+      navigate(`/addusername/${userDetails.user_id}`);
+    }
+  }, [userDetails, loadingUser, navigate, toast]);
+
+  useEffect(() => {
+    if (userDetails) {
+      setFormData({
+        username: userDetails.username || "",
+        pic: "",
+      });
+    }
+  }, [userDetails]);
 
   const handleSubmit = async (e) => {
     e.preventDefault();
@@ -92,13 +101,6 @@ const EditDetails = () => {
         pic: picUrl,
       };
 
-      const user = await axios.get("/api/user/me", {
-        withCredentials: true,
-      });
-      if (!updatedFormData.username) {
-        updatedFormData.username = user.data.username;
-      }
-
       EditDetailsSchema.parse(updatedFormData);
       setError({});
 
@@ -130,8 +132,20 @@ const EditDetails = () => {
     }
   };
 
+  if (loadingUser) {
+    return (
+      <Flex minH="100vh" align="center" justify="center" bg="black">
+        <InfinitySpin color="#3182CE" size={80} />
+      </Flex>
+    );
+  }
+
   return (
     <Box w="100%" maxW="500px" mx="auto" mt="5">
+      <Box textAlign="center" mb={6}>
+        <Avatar size="xl" src={userDetails.pic} mb={2} />
+        <Text fontSize="lg">{userDetails?.username || "Your Username"}</Text>
+      </Box>
       <form onSubmit={handleSubmit}>
         <VStack spacing={4}>
           <FormControl id="username">
diff --git a/frontend/src/components/Posts.jsx b/frontend/src/components/Posts.jsx
index 6a4c471..cf03096 100644
--- a/frontend/src/components/Posts.jsx
+++ b/frontend/src/components/Posts.jsx
@@ -108,7 +108,6 @@ const Posts = () => {
           withCredentials: true,
         });
         setAllCommunities(response.data.college);
-        console.log(response.data.college);
         setLoading(false);
       } catch (err) {
         setLoading(false);
@@ -167,6 +166,9 @@ const Posts = () => {
   if (!userDetails) {
     return <Navigate to="/login" />;
   }
+  if (userDetails.username === null) {
+    return <Navigate to={`/addusername/${userDetails.user_id}`} />;
+  }
   return (
     <Container centerContent>
       <SearchBar />
diff --git a/frontend/src/components/SinglePost.jsx b/frontend/src/components/SinglePost.jsx
index 8095203..e6bd809 100644
--- a/frontend/src/components/SinglePost.jsx
+++ b/frontend/src/components/SinglePost.jsx
@@ -15,12 +15,15 @@ import {
 } from "@chakra-ui/react";
 import axios from "axios";
 import CreateComment from "./CreateComment"; // Import the CreateComment component
+import { useUser } from "../hook/useUser";
+import { InfinitySpin } from "react-loader-spinner";
 
 const SinglePost = () => {
   const { id } = useParams();
   const [post, setPost] = useState(null);
   const [loading, setLoading] = useState(true);
   const [postLiked, setPostLiked] = useState(false);
+  const { userDetails, loadingUser } = useUser();
 
   useEffect(() => {
     const fetchPost = async () => {
@@ -55,6 +58,21 @@ const SinglePost = () => {
     checkIfLiked();
   }, [id]);
 
+  if (loadingUser) {
+    return (
+      <Center h="100vh">
+        <InfinitySpin />
+      </Center>
+    );
+  }
+
+  if (!userDetails) {
+    return <Navigate to="/login" />;
+  }
+  if (userDetails.username === null) {
+    return <Navigate to={`/addusername/${userDetails.userId}`} />;
+  }
+
   const handleLike = async (postId) => {
     if (postLiked) {
       try {
diff --git a/frontend/src/components/chatroomui/joinRoom1.jsx b/frontend/src/components/chatroomui/joinRoom1.jsx
index f123682..59d7965 100644
--- a/frontend/src/components/chatroomui/joinRoom1.jsx
+++ b/frontend/src/components/chatroomui/joinRoom1.jsx
@@ -40,6 +40,10 @@ const JoinRoom1 = () => {
     );
   }
 
+  if (userDetails.username == null) {
+    navigate(`/addusername/${userDetails.user_id}`);
+  }
+
   function handleClick(roomId) {
     localStorage.removeItem("roomId");
     localStorage.removeItem("userId");