From 5c4ed84dc72e8a7c6a37beab575657e7792891b2 Mon Sep 17 00:00:00 2001
From: Aamil13 <aamil.shafi13@gmail.com>
Date: Thu, 12 Dec 2024 12:13:56 +0530
Subject: [PATCH] sort, api fail on reload, zustand store remove on logout,
 logout hook

---
 .../[communityId]/[groupId]/page.tsx          |  2 +-
 .../communityGroup/[group_id]/page.tsx        |  5 --
 src/app/(withLayout)/messages/old_page.tsx    | 49 --------------
 src/app/(withLayout)/profile/[...id]/page.tsx |  7 +-
 src/app/(withLayout)/profile/page.tsx         | 64 -------------------
 src/app/post/[id]/page.tsx                    |  6 +-
 src/components/Navbar/Navbar.tsx              |  3 +-
 .../Timeline/Modals/EditProfileModal.tsx      |  6 +-
 src/components/Timeline/ProfileCard.tsx       |  6 +-
 src/components/atoms/LogoNavbar/index.tsx     | 14 ++--
 .../communityUniversity/GroupInfo.tsx         | 12 ++--
 .../communityUniversity/HeroSec.tsx           | 12 ++--
 src/components/messages/MessageSideBar.tsx    | 24 +++----
 .../messages/UserMessageContainer.tsx         |  6 +-
 .../molecules/CommunityGroupBanner/index.tsx  | 12 ++--
 .../molecules/CommunityGroupFilter/index.tsx  |  5 +-
 .../molecules/MessageNotification/index.tsx   |  4 +-
 .../molecules/NavbarUniversityItem/index.tsx  | 44 +++++++++++--
 .../molecules/NewPostComment/index.tsx        |  4 +-
 src/components/molecules/PostCard/index.tsx   |  4 +-
 .../molecules/PostCommentBox/index.tsx        |  2 +-
 .../molecules/UniversityCard/index.tsx        |  2 +-
 .../molecules/UserMessages/index.tsx          |  4 +-
 .../CommunityGroupPostContainer/index.tsx     | 22 ++++++-
 src/components/organisms/LeftNavbar/index.tsx | 12 ++--
 .../organisms/MessageContainer/index.tsx      | 20 +++---
 .../SettingTabs/SettingAccount.tsx            | 19 +++++-
 src/components/organisms/UserChats/index.tsx  | 22 +++----
 src/hooks/useLogOut.ts                        | 21 ++++++
 src/middleware.ts                             |  2 +-
 src/services/edit-profile.ts                  |  2 +-
 src/services/university-community.ts          |  2 +-
 src/store/store.ts                            | 26 ++++++--
 src/store/storeType.ts                        |  7 +-
 .../userProfileSlice/userProfileSlice.ts      |  7 +-
 src/store/userSlice/userSlice.ts              |  6 +-
 src/types/CommuityGroup/index.ts              |  2 +
 src/utils/ZustandSocketProvider.tsx           | 15 +++--
 38 files changed, 235 insertions(+), 247 deletions(-)
 delete mode 100644 src/app/(withLayout)/communityGroup/[group_id]/page.tsx
 delete mode 100644 src/app/(withLayout)/messages/old_page.tsx
 delete mode 100644 src/app/(withLayout)/profile/page.tsx
 create mode 100644 src/hooks/useLogOut.ts

diff --git a/src/app/(withLayout)/community/[communityId]/[groupId]/page.tsx b/src/app/(withLayout)/community/[communityId]/[groupId]/page.tsx
index 663d9065..620a9bd1 100644
--- a/src/app/(withLayout)/community/[communityId]/[groupId]/page.tsx
+++ b/src/app/(withLayout)/community/[communityId]/[groupId]/page.tsx
@@ -18,7 +18,7 @@ export default function Page({ params }: { params: { communityId: string; groupI
         isGroupAdmin={isGroupAdmin}
         setIsGroupAdmin={setIsGroupAdmin}
       />
-      {isGroupAdmin && <UserPostContainer communityID={communityId} communityGroupID={communityGroupID} type={PostInputType.Community} />}
+      <UserPostContainer communityID={communityId} communityGroupID={communityGroupID} type={PostInputType.Community} />
       <CommunityGroupPostContainer containerRef={containerRef} />
     </div>
   )
diff --git a/src/app/(withLayout)/communityGroup/[group_id]/page.tsx b/src/app/(withLayout)/communityGroup/[group_id]/page.tsx
deleted file mode 100644
index 36ef33be..00000000
--- a/src/app/(withLayout)/communityGroup/[group_id]/page.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import React from 'react'
-
-export default function CommunityGroup() {
-  return <div>CommunityGroup</div>
-}
diff --git a/src/app/(withLayout)/messages/old_page.tsx b/src/app/(withLayout)/messages/old_page.tsx
deleted file mode 100644
index d496749d..00000000
--- a/src/app/(withLayout)/messages/old_page.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-'use client'
-import MessageSideBar from '@/components/messages/MessageSideBar'
-import UserMessageContainer from '@/components/messages/UserMessageContainer'
-import { useUpdateMessageIsSeen } from '@/services/Messages'
-import { useUniStore } from '@/store/store'
-import { Chat } from '@/types/constants'
-import React, { useEffect, useState } from 'react'
-
-const ChatScreen = () => {
-  const [selectedChat, setSelectedChat] = useState<Chat | undefined>(undefined)
-
-  const { userData } = useUniStore()
-  const userName = selectedChat?.users?.find((item) => item?.userId._id !== userData.id)
-
-  const { mutate: updateIsSeen } = useUpdateMessageIsSeen()
-  const [isRequest, setIsRequest] = useState(true)
-
-  const updateMessageSeen = () => {
-    const isRead = selectedChat?.latestMessage?.readByUsers?.includes(userData.id || '')
-
-    if (!isRead && isRead !== undefined && selectedChat) {
-      updateIsSeen({ chatId: selectedChat?._id, messageId: selectedChat?.latestMessage?._id, data: { readByUserId: userData.id } })
-    }
-  }
-
-  useEffect(() => {
-    updateMessageSeen()
-  }, [selectedChat])
-
-  return (
-    <div className="p-8 flex  justify-center  h-[84.5vh]">
-      <div className="border-2 border-slate-500 w-4/5 rounded-lg flex">
-        <MessageSideBar setSelectedChat={setSelectedChat} selectedChat={selectedChat} isRequest={isRequest} setIsRequest={setIsRequest} />
-        {selectedChat?._id && (
-          <UserMessageContainer
-            chatId={selectedChat._id}
-            name={selectedChat.isGroupChat ? selectedChat.chatName : userName?.userId.firstName ?? 'Unknown'}
-            users={selectedChat?.users}
-            profileCover={selectedChat?.groupLogoImage ?? ''}
-            isRequest={isRequest}
-            isGroupChat={selectedChat?.isGroupChat}
-          />
-        )}
-      </div>
-    </div>
-  )
-}
-
-export default ChatScreen
diff --git a/src/app/(withLayout)/profile/[...id]/page.tsx b/src/app/(withLayout)/profile/[...id]/page.tsx
index 66316f2e..da121d77 100644
--- a/src/app/(withLayout)/profile/[...id]/page.tsx
+++ b/src/app/(withLayout)/profile/[...id]/page.tsx
@@ -1,19 +1,14 @@
 'use client'
-import Spinner from '@/components/atoms/spinner'
 import { openModal } from '@/components/molecules/Modal/ModalManager'
 import ProfilePostContainer from '@/components/organisms/PostsContainer'
-import PostContainer from '@/components/organisms/PostsContainer'
 import { UserProfileCard } from '@/components/organisms/ProfileCard'
-import Modal from '@/components/Timeline/Modal'
 import ConnectionsModal from '@/components/Timeline/Modals/ConnectionsModal'
 import EditProfileModal from '@/components/Timeline/Modals/EditProfileModal'
-import ProfileCard from '@/components/Timeline/ProfileCard'
 import { Skeleton } from '@/components/ui/Skeleton'
 import { useCheckSelfProfile } from '@/lib/utils'
 import { useGetUserData } from '@/services/user'
-import { PostType } from '@/types/constants'
 import { ModalContentType } from '@/types/global'
-import React, { useEffect, useRef, useState } from 'react'
+import React, { useRef, useState } from 'react'
 
 export default function Profile({ params }: { params: { id: string } }) {
   const userId = params.id[0]
diff --git a/src/app/(withLayout)/profile/page.tsx b/src/app/(withLayout)/profile/page.tsx
deleted file mode 100644
index 7ef575fc..00000000
--- a/src/app/(withLayout)/profile/page.tsx
+++ /dev/null
@@ -1,64 +0,0 @@
-'use client'
-
-import PostContainer from '@/components/organisms/PostsContainer'
-import { UserProfileCard } from '@/components/organisms/ProfileCard'
-import TimelinePostContainer from '@/components/organisms/TimelinePostContainer'
-import Modal from '@/components/Timeline/Modal'
-import ConnectionsModal from '@/components/Timeline/Modals/ConnectionsModal'
-import EditProfileModal from '@/components/Timeline/Modals/EditProfileModal'
-import ProfileCard from '@/components/Timeline/ProfileCard'
-import { useUniStore } from '@/store/store'
-import { PostType } from '@/types/constants'
-import { ModalContentType } from '@/types/global'
-import React, { useState } from 'react'
-
-export default function Profile() {
-  const [isModalOpen, setIsModalOpen] = useState(false)
-  const [modalContentType, setModalContentType] = useState<ModalContentType>()
-  const { userData, userProfileData } = useUniStore()
-  const modalContent = (modalContentType: string) => {
-    switch (modalContentType) {
-      case 'EditProfileModal':
-        return <EditProfileModal />
-      case 'ConnectionsModal':
-        return <ConnectionsModal />
-      default:
-        return null
-    }
-  }
-  const { bio, university_name, university_id, followers, following, study_year, major, phone_number, dob, degree, country } = userProfileData
-  const { firstName, lastName, email } = userData
-  return (
-    <div className="h-with-navbar py-4">
-      {/* <Modal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)}>
-        {modalContentType && modalContent(modalContentType)}
-      </Modal> */}
-      {/* <ModalWrapper setModal={setIsModalOpen} isShown={isModalOpen} smallHeight={true}>
-        {modalContentType && modalContent(modalContentType)}
-      </ModalWrapper> */}
-      {/* <UserProfileCard
-        name={`${firstName} ${lastName}`}
-        isPremium={true}
-        description={bio || ''}
-        university={university_name || 'Lorem University'}
-        isVerified={true}
-        following={followers?.length || 0}
-        followers={following?.length || 0}
-        year={study_year || ''}
-        degree={degree || ''}
-        major={major || ''}
-        email={email || ''}
-        phone={phone_number || '0000'}
-        location={'Bangalore'}
-        birthday={dob || ''}
-        avatarUrl={userProfileData?.profile_dp?.imageUrl || ''}
-        isVerifiedUniversity={true}
-        country={country || ''}
-        setModalContentType={setModalContentType}
-        setIsModalOpen={setIsModalOpen}
-        universityLogo={(university_id as any)?.logos?.[0] || ''}
-      /> */}
-      <TimelinePostContainer />
-    </div>
-  )
-}
diff --git a/src/app/post/[id]/page.tsx b/src/app/post/[id]/page.tsx
index b07d3b8a..b855584c 100644
--- a/src/app/post/[id]/page.tsx
+++ b/src/app/post/[id]/page.tsx
@@ -27,9 +27,9 @@ const SinglePost = () => {
     currImageIndex: null,
   })
 
-  if (Object.keys(data).length === 0) {
-    return <div className="h-screen flex justify-center items-center">Not Allowed</div>
-  }
+  // if (!data || Object.keys(data).length === 0) {
+  //   return <div className="h-screen flex justify-center items-center">Not Allowed</div>
+  // }
 
   if (isError) {
     return <div className="h-screen flex justify-center items-center">Not Allowed</div>
diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx
index de6b1bf2..21a327a3 100644
--- a/src/components/Navbar/Navbar.tsx
+++ b/src/components/Navbar/Navbar.tsx
@@ -43,7 +43,7 @@ const Navbar: React.FC = () => {
   const [hover, setHover] = useState<boolean>(false)
   const [activeItem, setActiveItem] = useState('')
   const [, , deleteCookie] = useCookie('uni_user_token')
-  const { userProfileData, userData, resetUserData, resetUserProfileData } = useUniStore()
+  const { userProfileData, userData, resetUserData } = useUniStore()
   const router = useRouter()
   const { refetch: refetchNotification } = useGetNotification(3, false)
   const { data: notificationData } = useGetNotification(3, false)
@@ -67,7 +67,6 @@ const Navbar: React.FC = () => {
   const handleLogout = () => {
     deleteCookie()
     resetUserData()
-    resetUserProfileData()
     setIsLogin(false)
     router.push('/login')
   }
diff --git a/src/components/Timeline/Modals/EditProfileModal.tsx b/src/components/Timeline/Modals/EditProfileModal.tsx
index 4ca66bcc..02970c23 100644
--- a/src/components/Timeline/Modals/EditProfileModal.tsx
+++ b/src/components/Timeline/Modals/EditProfileModal.tsx
@@ -51,11 +51,11 @@ const EditProfileModal = () => {
     formState: { errors },
   } = useForm<editProfileInputs>({
     defaultValues: {
-      first_name: userData.firstName,
-      last_name: userData.lastName,
+      first_name: userData?.firstName,
+      last_name: userData?.lastName,
       bio: userProfileData?.bio,
       phone_number: userProfileData?.phone_number,
-      gender: userData.gender,
+      gender: userData?.gender,
       dob: userProfileData?.dob ? new Date(userProfileData?.dob).toISOString().split('T')[0] : '',
       country: userProfileData?.country,
       city: userProfileData?.city,
diff --git a/src/components/Timeline/ProfileCard.tsx b/src/components/Timeline/ProfileCard.tsx
index 844e2ebb..c8c4d935 100644
--- a/src/components/Timeline/ProfileCard.tsx
+++ b/src/components/Timeline/ProfileCard.tsx
@@ -142,7 +142,7 @@ const ProfileCard: React.FC<ProfileProps> = ({
           <div className="flex">
             <div className="group relative">
               <img
-                src={`${userProfileData?.profile_dp?.imageUrl ? userProfileData.profile_dp.imageUrl : '/icons/avatar.svg'} `}
+                src={`${userProfileData?.profile_dp?.imageUrl ? userProfileData?.profile_dp.imageUrl : '/icons/avatar.svg'} `}
                 alt="Profile"
                 className="h-24 w-24 rounded-full border-4 border-white"
                 width={24}
@@ -169,7 +169,7 @@ const ProfileCard: React.FC<ProfileProps> = ({
         </div>
       </div>
       <div className="px-8 mt-8 py-5">
-        <h2 className="text-lg font-semibold">{userData.firstName}</h2>
+        <h2 className="text-lg font-semibold">{userData?.firstName}</h2>
         <p className="text-gray-dark text-xs py-1">{userProfileData?.bio}</p>
         {!isUserProfile && <button className="w-full bg-primary text-white py-2 mt-2 rounded-lg text-xs font-medium">Create Avatar</button>}
         <div className="mt-5 flex flex-col gap-4 sm:grid sm:grid-cols-2 sm:gap-x-6 lg:flex">
@@ -180,7 +180,7 @@ const ProfileCard: React.FC<ProfileProps> = ({
           />
           <ProfileItem iconName={HiLibrary} text={'Department of ' + userProfileData?.major} field="Department" />
           <ProfileItem iconName={FaLocationDot} text={userProfileData?.city + ' ' + userProfileData?.country} field="Location" />
-          <ProfileItem iconName={MdEmail} text={userData.email} textClassName="break-all" field="Email" />
+          <ProfileItem iconName={MdEmail} text={userData?.email} textClassName="break-all" field="Email" />
           <ProfileItem iconName={MdPhone} text={userProfileData?.phone_number} field="Contact" />
           <ProfileItem
             iconName={FaBirthdayCake}
diff --git a/src/components/atoms/LogoNavbar/index.tsx b/src/components/atoms/LogoNavbar/index.tsx
index 1d4180f8..14c9af03 100644
--- a/src/components/atoms/LogoNavbar/index.tsx
+++ b/src/components/atoms/LogoNavbar/index.tsx
@@ -23,6 +23,7 @@ import NotificationBox from '@/components/molecules/Notification'
 import MessageNotification from '@/components/molecules/MessageNotification'
 import { useGetMessageNotification, useGetNotification } from '@/services/notification'
 import useCookie from '@/hooks/useCookie'
+import { useLogout } from '@/hooks/useLogOut'
 
 interface Props {
   showOnlyLogo?: boolean
@@ -34,23 +35,18 @@ export default function LogoNavbar({ showOnlyLogo = false }: Props) {
   const pathname = usePathname()
   const router = useRouter()
   const shouldPadding = nonPaddingUrls.some((path) => pathname.includes(path)) || pathname === '/'
-  const { userProfileData, resetUserProfileData } = useUniStore()
-  const [, , deleteCookie] = useCookie('uni_user_token')
+  const { userProfileData, userData } = useUniStore()
+
+  const { handleLogout } = useLogout()
   const [isLogin, setIsLogin] = useState<boolean | undefined>(undefined)
   const { data: notificationData } = useGetNotification(3, true)
   const { data: messageNotificationData } = useGetMessageNotification(3, true)
   const notifications = notificationData?.pages.flatMap((page) => page.notifications) || []
   const messageNotifications = messageNotificationData?.pages.flatMap((page) => page.message) || []
   const isUserLoggedIn = useCallback(() => {
-    setIsLogin(!!userProfileData.users_id)
+    setIsLogin(!!userProfileData?.users_id)
   }, [userProfileData])
 
-  const handleLogout = () => {
-    deleteCookie()
-    resetUserProfileData()
-    router.push('/login')
-  }
-
   useEffect(() => {
     isUserLoggedIn()
   }, [userProfileData, isUserLoggedIn])
diff --git a/src/components/communityUniversity/GroupInfo.tsx b/src/components/communityUniversity/GroupInfo.tsx
index 9595f3d5..bde3e9d8 100644
--- a/src/components/communityUniversity/GroupInfo.tsx
+++ b/src/components/communityUniversity/GroupInfo.tsx
@@ -93,7 +93,7 @@ const GroupInfo = ({ data, isJoinedinCommunity, setIsJoinedInGroup, isJoinedInGr
             <>
               <img className="absolute bottom-8 -z-10 object-cover w-full" src={coverImage} alt="bg" />
               <div className="absolute bottom-8 z-0 w-full h-full  group">
-                <div className={`${data?.adminUserId._id == userData.id ? 'block ' : 'hidden'} w-full  text-end  mt-10 pr-4 `}>
+                <div className={`${data?.adminUserId._id == userData?.id ? 'block ' : 'hidden'} w-full  text-end  mt-10 pr-4 `}>
                   <input style={{ display: 'none' }} type="file" id="file" onChange={(e) => handleCoverImageUpload(e)} />
                   <label htmlFor="file">Change cover image</label>
                 </div>
@@ -102,7 +102,7 @@ const GroupInfo = ({ data, isJoinedinCommunity, setIsJoinedInGroup, isJoinedInGr
           ) : (
             <>
               <div className="absolute bottom-8 -z-10 w-full h-full bg-gray group" />
-              <div className={`${data?.adminUserId._id == userData.id ? 'block absolute ' : 'hidden'} w-full z-30 top-0 left-2/3 `}>
+              <div className={`${data?.adminUserId._id == userData?.id ? 'block absolute ' : 'hidden'} w-full z-30 top-0 left-2/3 `}>
                 <input style={{ display: 'none' }} type="file" id="file" onChange={(e) => handleCoverImageUpload(e)} />
                 <label htmlFor="file">Change cover image</label>
               </div>
@@ -111,7 +111,7 @@ const GroupInfo = ({ data, isJoinedinCommunity, setIsJoinedInGroup, isJoinedInGr
           {logoImage ? (
             <div className="group relative">
               <img className="w-20 h-20 object-cover rounded-full ms-10 max-md:hidden " src={logoImage} alt="dp" />
-              <div className={`${data?.adminUserId._id == userData.id ? 'block absolute ' : 'hidden'} absolute top-3 right-1/4`}>
+              <div className={`${data?.adminUserId._id == userData?.id ? 'block absolute ' : 'hidden'} absolute top-3 right-1/4`}>
                 <input style={{ display: 'none' }} type="file" id="file2" onChange={(e) => handleLogoImageUpload(e)} />
                 <label htmlFor="file2">
                   <p className="">
@@ -122,7 +122,7 @@ const GroupInfo = ({ data, isJoinedinCommunity, setIsJoinedInGroup, isJoinedInGr
             </div>
           ) : (
             <div className="w-20 h-20 object-cover rounded-full ms-10 max-md:hidden bg-orange relative group ">
-              <div className={`${data?.adminUserId._id == userData.id ? 'group-hover:block' : 'hidden'} absolute top-1/3 right-1/3`}>
+              <div className={`${data?.adminUserId._id == userData?.id ? 'group-hover:block' : 'hidden'} absolute top-1/3 right-1/3`}>
                 <input style={{ display: 'none' }} type="file" id="file2" onChange={(e) => handleLogoImageUpload(e)} />
                 <label htmlFor="file2">
                   <p className="">
@@ -146,7 +146,7 @@ const GroupInfo = ({ data, isJoinedinCommunity, setIsJoinedInGroup, isJoinedInGr
             <p className="text-sm font-semibold text-neutral-500 mt-2 max-lg:hidden">{data?.memberCount} Members </p>
             <div className="lg:hidden flex justify-between items-center">
               <p className="text-sm font-semibold text-neutral-500 mt-4">{data?.memberCount} Members </p>
-              {data?.adminUserId?._id == userData.id ? (
+              {data?.adminUserId?._id == userData?.id ? (
                 <button onClick={() => setAssignUsers(true)} className=" bg-[#6647FF] py-3 px-3 text-white rounded-full min-w-fit">
                   <IoMdSettings />
                 </button>
@@ -157,7 +157,7 @@ const GroupInfo = ({ data, isJoinedinCommunity, setIsJoinedInGroup, isJoinedInGr
               )}
             </div>
           </div>
-          {data?.adminUserId?._id == userData.id ? (
+          {data?.adminUserId?._id == userData?.id ? (
             <button onClick={() => setAssignUsers(true)} className="max-lg:hidden bg-[#6647FF] py-3 px-3 text-white rounded-full min-w-fit">
               <IoMdSettings />
             </button>
diff --git a/src/components/communityUniversity/HeroSec.tsx b/src/components/communityUniversity/HeroSec.tsx
index ac29c54f..4fd8c52b 100644
--- a/src/components/communityUniversity/HeroSec.tsx
+++ b/src/components/communityUniversity/HeroSec.tsx
@@ -73,7 +73,7 @@ const HeroSec = ({ data, setIsJoined, isJoined }: any) => {
             />
             <div
               className={`${
-                data?.community?.adminId == userData.id ? 'block  ' : 'hidden'
+                data?.community?.adminId == userData?.id ? 'block  ' : 'hidden'
               } absolute w-full z-30 top-[5%] left-[84%] max-lg:left-3/4 max-md:left-2/3 max-sm:left-1/3`}
             >
               <input style={{ display: 'none' }} type="file" id="CommunityCoverImagefile" onChange={(e) => handleCoverImageUpload(e)} />
@@ -82,7 +82,7 @@ const HeroSec = ({ data, setIsJoined, isJoined }: any) => {
           </>
         ) : (
           <div className="absolute bottom-20 z-0 object-cover w-full h-full max-md:bottom-52 bg-gray">
-            <div className={`${data?.community?.adminId == userData.id ? 'block  ' : 'hidden'} absolute w-full z-30 top-1/4 left-[84%] `}>
+            <div className={`${data?.community?.adminId == userData?.id ? 'block  ' : 'hidden'} absolute w-full z-30 top-1/4 left-[84%] `}>
               <input style={{ display: 'none' }} type="file" id="CommunityCoverImagefile" onChange={(e) => handleCoverImageUpload(e)} />
               <label htmlFor="CommunityCoverImagefile">Change cover image</label>
             </div>
@@ -111,7 +111,7 @@ const HeroSec = ({ data, setIsJoined, isJoined }: any) => {
                 src={data?.community?.communityLogoUrl.imageUrl}
                 alt="dp"
               />
-              <div className={`${data?.community?.adminId == userData.id ? 'block  ' : 'hidden'} absolute top-1/4`}>
+              <div className={`${data?.community?.adminId == userData?.id ? 'block  ' : 'hidden'} absolute top-1/4`}>
                 <input style={{ display: 'none' }} type="file" id="communitylogoImagefile" onChange={(e) => handleLogoImageUpload(e)} />
                 <label htmlFor="communitylogoImagefile">
                   <p className="">
@@ -122,7 +122,7 @@ const HeroSec = ({ data, setIsJoined, isJoined }: any) => {
             </>
           ) : (
             <div className="w-28 h-28 object-contain border-4 border-neutral-300 rounded-full bg-white flex items-center justify-center z-10">
-              <div className={`${data?.community?.adminId == userData.id ? 'block  ' : 'hidden'}  `}>
+              <div className={`${data?.community?.adminId == userData?.id ? 'block  ' : 'hidden'}  `}>
                 <input style={{ display: 'none' }} type="file" id="communitylogoImagefile" onChange={(e) => handleLogoImageUpload(e)} />
                 <label htmlFor="communitylogoImagefile">
                   <p className="">
@@ -140,14 +140,14 @@ const HeroSec = ({ data, setIsJoined, isJoined }: any) => {
             <img className="object-contain" src={chatboticon.src} alt="chatboticon" />
             <label className="text-neutral-500 font-medium max-lg:text-sm">Chatbot Support</label>
           </div>
-          {!isJoined && data?.community?.adminId != userData.id ? (
+          {!isJoined && data?.community?.adminId != userData?.id ? (
             <button
               onClick={() => JoinCommunity(data?.community?._id)}
               className="text-[#6647FF]  font-medium bg-[#F3F2FF] px-2 py-1 max-md:py-3 rounded-xl mr-10 max-xl:mr-5 max-lg:text-sm max-md:mr-0"
             >
               Join Community
             </button>
-          ) : data?.community?.adminId == userData.id ? (
+          ) : data?.community?.adminId == userData?.id ? (
             <button className="text-[#6647FF]  font-medium bg-[#F3F2FF] px-2 py-2 w-max h-max  rounded-full mr-10 max-xl:mr-5 max-lg:text-sm max-md:mr-0">
               <IoMdSettings />
             </button>
diff --git a/src/components/messages/MessageSideBar.tsx b/src/components/messages/MessageSideBar.tsx
index d6f66091..81ec6abf 100644
--- a/src/components/messages/MessageSideBar.tsx
+++ b/src/components/messages/MessageSideBar.tsx
@@ -42,9 +42,9 @@ const MessageSideBar = ({ setSelectedChat, selectedChat, setIsRequest, isRequest
 
   const userChatsId = useMemo(() => {
     return chatsData?.flatMap((chat) =>
-      chat.users.map((user) => (user.userId._id !== userData.id ? user.userId._id : null)).filter((id) => id !== null)
+      chat.users.map((user) => (user.userId._id !== userData?.id ? user.userId._id : null)).filter((id) => id !== null)
     )
-  }, [chatsData, userData.id])
+  }, [chatsData, userData?.id])
 
   const uniqUserChatID = useMemo(() => new Set(userChatsId), [userChatsId])
 
@@ -135,10 +135,10 @@ const MessageSideBar = ({ setSelectedChat, selectedChat, setIsRequest, isRequest
       )
       queryClient.setQueryData(['userChats'], updatedChats)
 
-      const isRead = newMessage?.readByUsers?.includes(userData.id || '')
+      const isRead = newMessage?.readByUsers?.includes(userData?.id || '')
 
       if (!isRead) {
-        updateIsSeen({ chatId: selectedChat?._id, messageId: chatMessageId, data: { readByUserId: userData.id } })
+        updateIsSeen({ chatId: selectedChat?._id, messageId: chatMessageId, data: { readByUserId: userData?.id } })
       }
     } else if (!chatData.some((chat) => chat._id == messageChatId)) {
       queryClient.invalidateQueries({ queryKey: ['userChats'] })
@@ -179,9 +179,9 @@ const MessageSideBar = ({ setSelectedChat, selectedChat, setIsRequest, isRequest
       return chats
         ?.filter(
           (item: Chat) =>
-            item.users.find((user) => user.userId._id.toString() === userData.id && user.isRequestAccepted) ||
+            item.users.find((user) => user.userId._id.toString() === userData?.id && user.isRequestAccepted) ||
             item.isRequestAccepted ||
-            item.groupAdmin.toString() === userData.id
+            item.groupAdmin.toString() === userData?.id
         )
         .map((item: Chat) => (
           <div
@@ -194,10 +194,10 @@ const MessageSideBar = ({ setSelectedChat, selectedChat, setIsRequest, isRequest
               groupName={item?.chatName}
               isGroupChat={item?.isGroupChat}
               users={[item?.users]}
-              isSeen={item?.latestMessage?.readByUsers?.includes(userData.id ?? '')}
+              isSeen={item?.latestMessage?.readByUsers?.includes(userData?.id ?? '')}
               lastMessage={item?.latestMessage?.content}
               date={item?.latestMessage?.createdAt && dayjs(new Date(item?.latestMessage?.createdAt).toString()).fromNow()}
-              YourID={userData.id}
+              YourID={userData?.id}
               unRead={item?.unreadMessagesCount}
             />
           </div>
@@ -206,8 +206,8 @@ const MessageSideBar = ({ setSelectedChat, selectedChat, setIsRequest, isRequest
       return chats
         ?.filter((item: Chat) =>
           item.isGroupChat
-            ? item.users.some((user) => user.userId._id.toString() === userData.id && !user.isRequestAccepted)
-            : !item.isRequestAccepted && item.groupAdmin.toString() !== userData.id
+            ? item.users.some((user) => user.userId._id.toString() === userData?.id && !user.isRequestAccepted)
+            : !item.isRequestAccepted && item.groupAdmin.toString() !== userData?.id
         )
         .map((item: Chat) => (
           <div
@@ -220,10 +220,10 @@ const MessageSideBar = ({ setSelectedChat, selectedChat, setIsRequest, isRequest
               groupName={item?.chatName}
               isGroupChat={item?.isGroupChat}
               users={[item?.users]}
-              isSeen={item?.latestMessage?.readByUsers?.includes(userData.id || ' ')}
+              isSeen={item?.latestMessage?.readByUsers?.includes(userData?.id || ' ')}
               lastMessage={item?.latestMessage?.content}
               date={item?.latestMessage?.createdAt && dayjs(new Date(item?.latestMessage?.createdAt).toString()).fromNow()}
-              YourID={userData.id}
+              YourID={userData?.id}
               unRead={item?.unreadMessagesCount}
             />
           </div>
diff --git a/src/components/messages/UserMessageContainer.tsx b/src/components/messages/UserMessageContainer.tsx
index 26effc2d..a1efee5f 100644
--- a/src/components/messages/UserMessageContainer.tsx
+++ b/src/components/messages/UserMessageContainer.tsx
@@ -39,7 +39,7 @@ const UserMessageContainer = ({ name, profileCover, chatId, users, isRequest, is
   const { mutate: acceptRequest } = useAcceptRequest()
   const { mutate: acceptGroupRequest } = useAcceptGroupRequest()
 
-  const user = users?.find((me) => me.userId._id !== userData.id)
+  const user = users?.find((me) => me.userId._id !== userData?.id)
   let previousDate: any = ''
 
   const { socket } = useUniStore()
@@ -130,7 +130,7 @@ const UserMessageContainer = ({ name, profileCover, chatId, users, isRequest, is
                 profilePic={item?.senderProfile?.profile_dp?.imageUrl}
                 name={item?.sender?.firstName}
                 content={item?.content}
-                myMessage={item?.sender.id === userData.id}
+                myMessage={item?.sender.id === userData?.id}
                 date={item.createdAt}
                 id={item?._id}
                 reactions={item?.reactions}
@@ -143,7 +143,7 @@ const UserMessageContainer = ({ name, profileCover, chatId, users, isRequest, is
       </div>
       {/* // input box  */}
       {isRequest ? (
-        <MessageInputBox chatId={chatId} userProfileId={userProfileData._id || ''} />
+        <MessageInputBox chatId={chatId} userProfileId={userProfileData?._id || ''} />
       ) : (
         <div>
           <p>Accept request to message</p>
diff --git a/src/components/molecules/CommunityGroupBanner/index.tsx b/src/components/molecules/CommunityGroupBanner/index.tsx
index 86dbb62e..a814211c 100644
--- a/src/components/molecules/CommunityGroupBanner/index.tsx
+++ b/src/components/molecules/CommunityGroupBanner/index.tsx
@@ -46,7 +46,7 @@ export default function CommunityGroupBanner({ communityID, communityGroupID, is
 
   useEffect(() => {
     if (communityGroups && userData) {
-      setIsUserJoinedCommunityGroup(communityGroups?.users?.some((user) => user.userId.toString() === userData.id))
+      setIsUserJoinedCommunityGroup(communityGroups?.users?.some((user) => user.userId.toString() === userData?.id))
     }
   }, [communityGroups])
 
@@ -162,7 +162,7 @@ export default function CommunityGroupBanner({ communityID, communityGroupID, is
           {!communityGroupID ? (
             <div
               className={`${
-                dataToDisplay?.adminId == userData.id ? 'absolute  ' : 'hidden'
+                dataToDisplay?.adminId == userData?.id ? 'absolute  ' : 'hidden'
               }  w-8 h-8 rounded-full bg-white shadow-2xl z-0 top-5 right-[5%] flex items-center justify-center `}
             >
               <input style={{ display: 'none' }} type="file" id="CommunityCoverImagefile" onChange={(e) => handleCoverImageUpload(e)} />
@@ -173,7 +173,7 @@ export default function CommunityGroupBanner({ communityID, communityGroupID, is
           ) : (
             <div
               className={`${
-                dataToDisplay?.adminId == userData.id ? 'absolute  ' : 'hidden'
+                dataToDisplay?.adminId == userData?.id ? 'absolute  ' : 'hidden'
               }  w-8 h-8 rounded-full bg-white shadow-2xl z-0 top-5 right-[5%] flex items-center justify-center `}
             >
               <input
@@ -198,7 +198,7 @@ export default function CommunityGroupBanner({ communityID, communityGroupID, is
                 {!communityGroupID ? (
                   <div
                     className={`${
-                      dataToDisplay?.adminId == userData.id ? 'absolute  ' : 'hidden'
+                      dataToDisplay?.adminId == userData?.id ? 'absolute  ' : 'hidden'
                     }  w-8 h-8 rounded-full bg-white shadow-2xl z-[2] top-1 right-1 flex items-center justify-center `}
                   >
                     <input style={{ display: 'none' }} type="file" id="communitylogoImagefile" onChange={(e) => handleLogoImageUpload(e)} />
@@ -209,7 +209,7 @@ export default function CommunityGroupBanner({ communityID, communityGroupID, is
                 ) : (
                   <div
                     className={`${
-                      dataToDisplay?.adminId == userData.id ? 'absolute  ' : 'hidden'
+                      dataToDisplay?.adminId == userData?.id ? 'absolute  ' : 'hidden'
                     }  w-8 h-8 rounded-full bg-white shadow-2xl z-[2] top-1 right-1 flex items-center justify-center `}
                   >
                     <input
@@ -238,7 +238,7 @@ export default function CommunityGroupBanner({ communityID, communityGroupID, is
             </div>
             <div
               className={`${
-                dataToDisplay?.adminId != userData.id ? 'flex-col justify-center items-center text-center gap-2' : 'gap-4'
+                dataToDisplay?.adminId != userData?.id ? 'flex-col justify-center items-center text-center gap-2' : 'gap-4'
               } flex  items-center`}
             >
               {isGroupAdmin ? (
diff --git a/src/components/molecules/CommunityGroupFilter/index.tsx b/src/components/molecules/CommunityGroupFilter/index.tsx
index a22109de..c379c79a 100644
--- a/src/components/molecules/CommunityGroupFilter/index.tsx
+++ b/src/components/molecules/CommunityGroupFilter/index.tsx
@@ -9,6 +9,7 @@ const GroupCategories = ['Private', 'Public', 'Official', 'Casual']
 
 type Props = {
   communityId: string
+  sort: string
   selectedFiltersMain: Record<string, string[]>
   setSelectedFiltersMain: React.Dispatch<React.SetStateAction<Record<string, string[]>>>
   selectedTypeMain: string[]
@@ -21,6 +22,7 @@ const CommunityGroupFilterComponent: React.FC<Props> = ({
   selectedFiltersMain,
   setSelectedTypeMain,
   selectedTypeMain,
+  sort,
 }) => {
   const [selectedFilters, setSelectedFilters] = useState<Record<string, string[]>>({})
   const [selectedType, setSelectedType] = useState<string[]>([])
@@ -58,9 +60,10 @@ const CommunityGroupFilterComponent: React.FC<Props> = ({
   }
 
   const handleClick = () => {
-    const data = { selectedType, selectedFilters }
+    const data = { selectedType, selectedFilters, sort }
     setSelectedFiltersMain(selectedFilters)
     setSelectedTypeMain(selectedType)
+
     mutate(data)
   }
 
diff --git a/src/components/molecules/MessageNotification/index.tsx b/src/components/molecules/MessageNotification/index.tsx
index ff1530ec..745983c8 100644
--- a/src/components/molecules/MessageNotification/index.tsx
+++ b/src/components/molecules/MessageNotification/index.tsx
@@ -86,8 +86,8 @@ const MessageNotification = ({ message }: MessageNotificationsProps) => {
               <p>
                 {item?.isGroupChat
                   ? item?.chatName
-                  : `${item?.users?.find((user) => user?.userId._id.toString() !== userData.id)?.userId.firstName || ''} ${
-                      item?.users?.find((user) => user?.userId._id.toString() !== userData.id)?.userId.lastName || ''
+                  : `${item?.users?.find((user) => user?.userId._id.toString() !== userData?.id)?.userId.firstName || ''} ${
+                      item?.users?.find((user) => user?.userId._id.toString() !== userData?.id)?.userId.lastName || ''
                     }`}
               </p>
 
diff --git a/src/components/molecules/NavbarUniversityItem/index.tsx b/src/components/molecules/NavbarUniversityItem/index.tsx
index b2cda0a2..b0ee3dce 100644
--- a/src/components/molecules/NavbarUniversityItem/index.tsx
+++ b/src/components/molecules/NavbarUniversityItem/index.tsx
@@ -1,7 +1,7 @@
 'use client'
 import GroupSearchBox from '@/components/atoms/GroupSearchBox'
 import UserListItemSkeleton from '@/components/Connections/UserListItemSkeleton'
-import { useGetSubscribedCommunties } from '@/services/university-community'
+import { useGetFilteredSubscribedCommunities, useGetSubscribedCommunties } from '@/services/university-community'
 import Image from 'next/image'
 import { useParams, useRouter } from 'next/navigation'
 import React, { useEffect, useMemo, useState } from 'react'
@@ -16,9 +16,13 @@ import { Community } from '@/types/Community'
 import { openModal } from '../Modal/ModalManager'
 import CommunityGroupFilterComponent from '../CommunityGroupFilter'
 import Buttons from '@/components/atoms/Buttons'
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/Popover'
+import { sortBy } from '@/types/CommuityGroup'
+import useCookie from '@/hooks/useCookie'
 
 export default function NavbarUniversityItem({ setActiveMenu }: any) {
   const { userData, userProfileData } = useUniStore()
+  const [cookieValue] = useCookie('uni_user_token')
   const router = useRouter()
   const { communityId, groupId: communityGroupId }: { communityId: string; groupId: string } = useParams()
   const [currSelectedGroup, setCurrSelectedGroup] = useState<Community>()
@@ -26,11 +30,15 @@ export default function NavbarUniversityItem({ setActiveMenu }: any) {
   const [showNewGroup, setShowNewGroup] = useState<boolean>(false)
   const [selectedFiltersMain, setSelectedFiltersMain] = useState<Record<string, string[]>>({})
   const [selectedTypeMain, setSelectedTypeMain] = useState<string[]>([])
+  const [sort, setSort] = useState<string>('')
   const [assignUsers, setAssignUsers] = useState(false)
   const [showGroupTill, setShowGroupTill] = useState(5)
   const [community, setCommunity] = useState<Community>()
   const [selectCommunityId, selectedCommuntyGroupdId] = [communityId || community?._id, communityGroupId]
   const { data: subscribedCommunities, isFetching, isLoading } = useGetSubscribedCommunties()
+  // console.log('comm', communityId, 'iii', community?._id)
+
+  const { mutate: mutateFilterCommunityGroups } = useGetFilteredSubscribedCommunities(community?._id)
 
   const handleCommunityClick = (index: number) => {
     handleUniversityClick(index)
@@ -52,6 +60,7 @@ export default function NavbarUniversityItem({ setActiveMenu }: any) {
         selectedFiltersMain={selectedFiltersMain}
         setSelectedTypeMain={setSelectedTypeMain}
         selectedTypeMain={selectedTypeMain}
+        sort={sort}
       />
     )
   }
@@ -77,8 +86,8 @@ export default function NavbarUniversityItem({ setActiveMenu }: any) {
     () =>
       subscribedCommunities
         ?.find((community) => community._id === (communityId || subscribedCommunities?.[0]._id))
-        ?.communityGroups.filter((communityGroup) => communityGroup.adminUserId === userData.id),
-    [subscribedCommunities, communityId, userData.id, community]
+        ?.communityGroups.filter((communityGroup) => communityGroup.adminUserId === userData?.id),
+    [subscribedCommunities, communityId, userData?.id, community]
   )
 
   useEffect(() => {
@@ -89,6 +98,14 @@ export default function NavbarUniversityItem({ setActiveMenu }: any) {
     }
   }, [subscribedCommunities, communityId])
 
+  //sort
+  useEffect(() => {
+    const data = { selectedType: selectedTypeMain, selectedFilters: selectedFiltersMain, sort }
+    if (cookieValue && community?._id && (selectedFiltersMain?.length || selectedTypeMain?.length || sort.length)) {
+      mutateFilterCommunityGroups(data)
+    }
+  }, [sort, cookieValue, community?._id])
+
   const tabData = [
     {
       label: 'All',
@@ -165,7 +182,7 @@ export default function NavbarUniversityItem({ setActiveMenu }: any) {
   return (
     <>
       <NavbarSubscribedUniversity
-        userData={userData}
+        userData={userData || {}}
         communityId={communityId}
         subscribedCommunities={subscribedCommunities as Community[]}
         handleCommunityClick={handleCommunityClick}
@@ -177,9 +194,22 @@ export default function NavbarUniversityItem({ setActiveMenu }: any) {
           <Buttons onClick={() => handleCommunityGroupFilter()} size="extra_small" variant="border_primary">
             Filter
           </Buttons>
-          <Buttons size="extra_small" variant="border_primary">
-            Sort
-          </Buttons>
+          <Popover>
+            <PopoverTrigger>
+              <div className="border border-primary text-primary text-2xs py-1 px-2 rounded-md active:scale-95 transition-transform duration-150">
+                Sort
+              </div>
+            </PopoverTrigger>
+            <PopoverContent className="w-auto px-2 border-none bg-white shadow-lg shadow-gray-light">
+              <div className="">
+                {sortBy.map((item) => (
+                  <p onClick={() => setSort(item)} key={item} className="capitalize cursor-pointer">
+                    {item}
+                  </p>
+                ))}
+              </div>
+            </PopoverContent>
+          </Popover>
         </div>
         <div className="flex items-center px-4 py-2 w-full">
           <div className="flex items-center justify-start bg-white rounded-full gap-3 w-full">
diff --git a/src/components/molecules/NewPostComment/index.tsx b/src/components/molecules/NewPostComment/index.tsx
index bdb582fd..f53c6270 100644
--- a/src/components/molecules/NewPostComment/index.tsx
+++ b/src/components/molecules/NewPostComment/index.tsx
@@ -45,7 +45,7 @@ const NewPostComment = ({ setNewPost, data, postId, isReply, isNested }: Props)
         </div>
         <div className="flex  p-2 gap-4">
           <Image
-            src={userProfileData.profile_dp?.imageUrl || avatar}
+            src={userProfileData?.profile_dp?.imageUrl || avatar}
             width={56}
             height={56}
             objectFit="cover"
@@ -56,7 +56,7 @@ const NewPostComment = ({ setNewPost, data, postId, isReply, isNested }: Props)
             <PostCommentInput
               adminID={data.adminId}
               postID={postId}
-              commenterProfileId={userProfileData._id || ''}
+              commenterProfileId={userProfileData?._id || ''}
               commentId={data.commentId}
               type={data.type}
               isReply={isReply}
diff --git a/src/components/molecules/PostCard/index.tsx b/src/components/molecules/PostCard/index.tsx
index c8cf6557..449358bf 100644
--- a/src/components/molecules/PostCard/index.tsx
+++ b/src/components/molecules/PostCard/index.tsx
@@ -170,7 +170,7 @@ const PostCard = ({
         </div>
 
         <div className=" text-primary-500 text-md bg-surface-primary-50 rounded-full flex p-1">
-          <PostCartOption isSelfPost={adminId === userData.id} postID={postID} isType={type} />
+          <PostCartOption isSelfPost={adminId === userData?.id} postID={postID} isType={type} />
         </div>
       </div>
 
@@ -213,7 +213,7 @@ const PostCard = ({
           </Popover>
         </div>
       </div>
-      <PostCommentBox showCommentSec={showCommentSection} postID={postID} type={type} adminId={userData.id || ''} data={PostData} />
+      <PostCommentBox showCommentSec={showCommentSection} postID={postID} type={type} adminId={userData?.id || ''} data={PostData} />
     </div>
   )
 }
diff --git a/src/components/molecules/PostCommentBox/index.tsx b/src/components/molecules/PostCommentBox/index.tsx
index 7a19d423..c8fcdb34 100644
--- a/src/components/molecules/PostCommentBox/index.tsx
+++ b/src/components/molecules/PostCommentBox/index.tsx
@@ -395,7 +395,7 @@ const PostCommentBox = ({ showCommentSec, postID, type, data }: Props) => {
     <div className={`${showCommentSec !== postID ? 'h-0 overflow-y-hidden' : ''}  flex flex-col gap-2 w-full`}>
       <div className="rounded-full pt-4 pb-2 flex gap-2 items-center">
         <Image
-          src={userProfileData.cover_dp?.imageUrl || avatar}
+          src={userProfileData?.cover_dp?.imageUrl || avatar}
           alt={`${userData?.firstName}'s avatar`}
           width={44}
           height={44}
diff --git a/src/components/molecules/UniversityCard/index.tsx b/src/components/molecules/UniversityCard/index.tsx
index 7e33231b..a1de86be 100644
--- a/src/components/molecules/UniversityCard/index.tsx
+++ b/src/components/molecules/UniversityCard/index.tsx
@@ -34,7 +34,7 @@ export default function UniversityCard({ communityID, isGroupAdmin, setIsGroupAd
 
   useEffect(() => {
     if (communityData && userData) {
-      setIsUserJoinedCommunity(communityData.users.some((user) => user?.id?.toString() === userData.id))
+      setIsUserJoinedCommunity(communityData.users.some((user) => user?.id?.toString() === userData?.id))
     }
   }, [communityData, userData])
 
diff --git a/src/components/molecules/UserMessages/index.tsx b/src/components/molecules/UserMessages/index.tsx
index 738904ee..f088682a 100644
--- a/src/components/molecules/UserMessages/index.tsx
+++ b/src/components/molecules/UserMessages/index.tsx
@@ -211,7 +211,7 @@ const UserMessages = ({ name, profileCover, chatId, users, isRequest, isGroupCha
                 profilePic={item?.senderProfile?.profile_dp?.imageUrl}
                 name={item?.sender?.firstName}
                 content={item?.content}
-                myMessage={item?.sender.id === userData.id}
+                myMessage={item?.sender.id === userData?.id}
                 date={item.createdAt}
                 id={item?._id}
                 reactions={item?.reactions}
@@ -226,7 +226,7 @@ const UserMessages = ({ name, profileCover, chatId, users, isRequest, isGroupCha
         })}
       </div>
       <div className="fixed w-full bottom-0">
-        <UserMessageInput chatId={chatId} userProfileId={userProfileData._id || ''} isRequestNotAccepted={isRequestNotAccepted} />
+        <UserMessageInput chatId={chatId} userProfileId={userProfileData?._id || ''} isRequestNotAccepted={isRequestNotAccepted} />
       </div>
     </div>
   )
diff --git a/src/components/organisms/CommunityGroupPostContainer/index.tsx b/src/components/organisms/CommunityGroupPostContainer/index.tsx
index 9c6426eb..0ddee196 100644
--- a/src/components/organisms/CommunityGroupPostContainer/index.tsx
+++ b/src/components/organisms/CommunityGroupPostContainer/index.tsx
@@ -4,11 +4,13 @@ import { Skeleton } from '@/components/ui/Skeleton'
 import { useGetCommunityGroupPost } from '@/services/community-university'
 import { communityPostType } from '@/types/Community'
 import { PostType } from '@/types/constants'
+import { useQueryClient } from '@tanstack/react-query'
 import { useParams } from 'next/navigation'
 import React, { useEffect, useRef, useState } from 'react'
 
 function CommunityGroupPostContainer({ containerRef }: { containerRef: any }) {
   const { communityId, groupId: communityGroupId }: { communityId: string; groupId: string } = useParams()
+  const queryClient = useQueryClient()
   const [imageCarasol, setImageCarasol] = useState<{
     isShow: boolean
     images: any
@@ -27,8 +29,11 @@ function CommunityGroupPostContainer({ containerRef }: { containerRef: any }) {
     hasNextPage: communityPostHasNextPage,
     isLoading,
     error,
+    isFetching,
+    dataUpdatedAt,
   } = useGetCommunityGroupPost(communityId, communityGroupId, true, 2)
-  const communityGroupPostData = communityGroupPost?.pages.flatMap((page) => page?.finalPost) || []
+  const [communityGroupPostDatas, setCommunityGroupPostDatas] = useState([])
+  // const communityGroupPostData = communityGroupPost?.pages.flatMap((page) => page?.finalPost) || []
 
   useEffect(() => {
     const handleScroll = () => {
@@ -49,16 +54,27 @@ function CommunityGroupPostContainer({ containerRef }: { containerRef: any }) {
     }
   }, [communityPostHasNextPage, communityPostIsFetchingNextPage, communityPostNextpage])
 
+  useEffect(() => {
+    if (isFetching) {
+      setCommunityGroupPostDatas([])
+    }
+  }, [isFetching, queryClient])
+
+  useEffect(() => {
+    const communityDatas: any = communityGroupPost?.pages.flatMap((page) => page?.finalPost)
+    setCommunityGroupPostDatas(communityDatas)
+  }, [communityGroupPost, dataUpdatedAt])
+
   if (isLoading) return <Skeleton className="w-full h-60 bg-slate-300 my-8" />
 
   if (error) {
     return <div className="text-center my-4 bg-white rounded-xl p-4">{(error as any)?.response?.data?.message || 'Something went wrong'}</div>
   }
-  if (communityGroupPostData.length === 0) return <div className="text-center my-4 bg-white rounded-xl p-4">No posts found</div>
+  if (communityGroupPostDatas.length === 0) return <div className="text-center my-4 bg-white rounded-xl p-4">No posts found</div>
 
   return (
     <div className="py-8 flex flex-col gap-6">
-      {communityGroupPostData?.map((post: communityPostType, idx: number) => (
+      {communityGroupPostDatas?.map((post: communityPostType, idx: number) => (
         <PostCard
           key={post?._id}
           user={post?.user?.firstName + ' ' + post?.user?.lastName}
diff --git a/src/components/organisms/LeftNavbar/index.tsx b/src/components/organisms/LeftNavbar/index.tsx
index db43f9d9..ff9b0fbc 100644
--- a/src/components/organisms/LeftNavbar/index.tsx
+++ b/src/components/organisms/LeftNavbar/index.tsx
@@ -35,12 +35,12 @@ export default function LeftNavbar() {
   }
 
   const handleProfileClicked = () => {
-    router.push(`/profile/${userData.id}`)
+    router.push(`/profile/${userData?.id}`)
     setActiveMenu('')
   }
 
   const renderProfile = () => {
-    if (Object?.keys(userProfileData)?.length === 0) {
+    if (userProfileData && Object?.keys(userProfileData)?.length === 0) {
       return <UserListItemSkeleton />
     }
     return (
@@ -49,7 +49,7 @@ export default function LeftNavbar() {
         height={50}
         objectFit="cover"
         className="w-[50px] h-[50px] rounded-full"
-        src={userProfileData.profile_dp?.imageUrl || avatar}
+        src={userProfileData?.profile_dp?.imageUrl || avatar}
         alt="profile.png"
       />
     )
@@ -61,10 +61,10 @@ export default function LeftNavbar() {
         {renderProfile()}
         <div>
           <p className="text-sm text-neutral-700">
-            {userData.firstName} {userData.lastName}
+            {userData?.firstName} {userData?.lastName}
           </p>
-          <SubText>{userProfileData.university_name}</SubText>
-          <SubText>{userProfileData.major}</SubText>
+          <SubText>{userProfileData?.university_name}</SubText>
+          <SubText>{userProfileData?.major}</SubText>
         </div>
       </div>
       <div className="px-4 pt-9">
diff --git a/src/components/organisms/MessageContainer/index.tsx b/src/components/organisms/MessageContainer/index.tsx
index ac924e60..9124d8f7 100644
--- a/src/components/organisms/MessageContainer/index.tsx
+++ b/src/components/organisms/MessageContainer/index.tsx
@@ -24,7 +24,7 @@ const MessageContainer = () => {
   const [selectedChat, setSelectedChat] = useState<Chat | undefined>(undefined)
 
   const { userData, socket } = useUniStore()
-  const userName = selectedChat?.users?.find((item) => item?.userId._id !== userData.id)
+  const userName = selectedChat?.users?.find((item) => item?.userId._id !== userData?.id)
   const queryClient = useQueryClient()
   const { mutate: updateIsSeen } = useUpdateMessageIsSeen()
   const [isRequest, setIsRequest] = useState(true)
@@ -45,7 +45,7 @@ const MessageContainer = () => {
 
   const unreadChatsCount = chats.filter((item) => {
     if (item.isGroupChat) {
-      return item.unreadMessagesCount > 0 && item.users.some((user) => user.userId._id == userData.id && user.isRequestAccepted)
+      return item.unreadMessagesCount > 0 && item.users.some((user) => user.userId._id == userData?.id && user.isRequestAccepted)
     } else {
       return item.unreadMessagesCount > 0 && item.isRequestAccepted
     }
@@ -59,10 +59,10 @@ const MessageContainer = () => {
   }).length
 
   const updateMessageSeen = () => {
-    const isRead = selectedChat?.latestMessage?.readByUsers?.includes(userData.id || '')
+    const isRead = selectedChat?.latestMessage?.readByUsers?.includes(userData?.id || '')
 
     if (!isRead && isRead !== undefined && selectedChat) {
-      updateIsSeen({ chatId: selectedChat?._id, messageId: selectedChat?.latestMessage?._id, data: { readByUserId: userData.id } })
+      updateIsSeen({ chatId: selectedChat?._id, messageId: selectedChat?.latestMessage?._id, data: { readByUserId: userData?.id } })
     }
   }
 
@@ -107,10 +107,10 @@ const MessageContainer = () => {
       )
       queryClient.setQueryData(['userChats'], updatedChats)
 
-      const isRead = newMessage?.readByUsers?.includes(userData.id || '')
+      const isRead = newMessage?.readByUsers?.includes(userData?.id || '')
 
       if (!isRead && selectedChat?._id) {
-        updateIsSeen({ chatId: selectedChat?._id, messageId: chatMessageId, data: { readByUserId: userData.id } })
+        updateIsSeen({ chatId: selectedChat?._id, messageId: chatMessageId, data: { readByUserId: userData?.id } })
       }
     } else if (!chatData.some((chat) => chat._id == messageChatId)) {
       queryClient.invalidateQueries({ queryKey: ['userChats'] })
@@ -120,9 +120,9 @@ const MessageContainer = () => {
 
   const userChatsId = useMemo(() => {
     return chatsData?.flatMap((chat) =>
-      chat.users.map((user) => (user.userId._id !== userData.id ? user.userId._id : null)).filter((id) => id !== null)
+      chat.users.map((user) => (user.userId._id !== userData?.id ? user.userId._id : null)).filter((id) => id !== null)
     )
-  }, [chatsData, userData.id])
+  }, [chatsData, userData?.id])
 
   const uniqUserChatID = useMemo(() => new Set(userChatsId), [userChatsId])
 
@@ -266,7 +266,7 @@ const MessageContainer = () => {
             degree={userName?.userId.degree ?? 'Unknown'}
             universitry={userName?.userId.universityName ?? 'Unknown'}
             users={selectedChat?.users}
-            yourID={userData.id || ''}
+            yourID={userData?.id || ''}
             isGroupChat={selectedChat?.isGroupChat}
             isRequestNotAccepted={currTab == 'Message Requests'}
             chatId={selectedChat?._id}
@@ -282,7 +282,7 @@ const MessageContainer = () => {
             profileCover={selectedChat?.groupLogoImage ?? ''}
             isRequest={isRequest}
             isGroupChat={selectedChat?.isGroupChat}
-            yourID={userData.id || ''}
+            yourID={userData?.id || ''}
             setImageCarasol={setImageCarasol}
             isRequestNotAccepted={currTab == 'Message Requests'}
           />
diff --git a/src/components/organisms/SettingsSection/SettingTabs/SettingAccount.tsx b/src/components/organisms/SettingsSection/SettingTabs/SettingAccount.tsx
index e7d83eec..4578bebd 100644
--- a/src/components/organisms/SettingsSection/SettingTabs/SettingAccount.tsx
+++ b/src/components/organisms/SettingsSection/SettingTabs/SettingAccount.tsx
@@ -11,13 +11,26 @@ import Button from '@/components/atoms/Buttons'
 import InputBox from '@/components/atoms/Input/InputBox'
 
 import { useUniStore } from '@/store/store'
+import { userProfileType } from '@/store/userProfileSlice/userProfileType'
+import { userType } from '@/store/userSlice/userType'
+
+interface emailType {
+  UniversityName: string
+  UniversityEmail: string
+  communityId: string
+}
 type props = {
   setModal: (value: string) => void
 }
 
 const SettingAccount = ({ setModal }: props) => {
-  const { email } = useUniStore((state) => state.userProfileData)
-  const { userName, email: userEmail } = useUniStore((state) => state.userData)
+  const userProfileData = useUniStore((state) => state.userProfileData) || { email: [] }
+
+  const email: emailType[] = userProfileData.email || []
+
+  const userData = useUniStore((state) => state.userData) || {}
+  const userName = userData.userName || ''
+  const userEmail = userData.email || ''
 
   return (
     <div className="flex flex-col  py-4 px-0  max-md:px-4 gap-10">
@@ -31,7 +44,7 @@ const SettingAccount = ({ setModal }: props) => {
           )}
         </div>
         {email?.length ? (
-          email?.map((item, idx) => (
+          email?.map((item: emailType, idx) => (
             <div key={idx}>
               <div className="flex flex-col gap-6">
                 <div className="relative w-full flex flex-col gap-2">
diff --git a/src/components/organisms/UserChats/index.tsx b/src/components/organisms/UserChats/index.tsx
index 0dc9201b..9b0d3ac1 100644
--- a/src/components/organisms/UserChats/index.tsx
+++ b/src/components/organisms/UserChats/index.tsx
@@ -22,9 +22,9 @@ const UserChats = ({ setSelectedChat, selectedChat, setIsRequest, currTabb, chat
     if (currTabb === 'Inbox') {
       const filteredChats = chats?.filter(
         (item: Chat) =>
-          item.users.find((user) => user?.userId._id.toString() === userData.id && user?.isRequestAccepted) ||
+          item.users.find((user) => user?.userId._id.toString() === userData?.id && user?.isRequestAccepted) ||
           item.isRequestAccepted ||
-          item.groupAdmin.toString() === userData.id
+          item.groupAdmin.toString() === userData?.id
       )
 
       if (isChatLoading) {
@@ -41,10 +41,10 @@ const UserChats = ({ setSelectedChat, selectedChat, setIsRequest, currTabb, chat
             groupName={item?.chatName}
             isGroupChat={item?.isGroupChat}
             users={[item?.users]}
-            isSeen={item?.latestMessage?.readByUsers?.includes(userData.id || ' ')}
+            isSeen={item?.latestMessage?.readByUsers?.includes(userData?.id || ' ')}
             lastMessage={item?.latestMessage?.content}
             date={item?.latestMessage?.createdAt && dayjs(new Date(item?.latestMessage?.createdAt).toString()).fromNow()}
-            YourID={userData.id}
+            YourID={userData?.id}
             unRead={item?.unreadMessagesCount}
           />
         </div>
@@ -52,8 +52,8 @@ const UserChats = ({ setSelectedChat, selectedChat, setIsRequest, currTabb, chat
     } else if (currTabb === 'Message Requests') {
       const filteredChats = chats?.filter((item: Chat) =>
         item.isGroupChat
-          ? item.users.some((user) => user.userId._id.toString() === userData.id && !user.isRequestAccepted)
-          : !item.isRequestAccepted && item.groupAdmin.toString() !== userData.id
+          ? item.users.some((user) => user.userId._id.toString() === userData?.id && !user.isRequestAccepted)
+          : !item.isRequestAccepted && item.groupAdmin.toString() !== userData?.id
       )
 
       if (filteredChats.length === 0) {
@@ -67,16 +67,16 @@ const UserChats = ({ setSelectedChat, selectedChat, setIsRequest, currTabb, chat
             groupName={item?.chatName}
             isGroupChat={item?.isGroupChat}
             users={[item?.users]}
-            isSeen={item?.latestMessage?.readByUsers?.includes(userData.id || ' ')}
+            isSeen={item?.latestMessage?.readByUsers?.includes(userData?.id || ' ')}
             lastMessage={item?.latestMessage?.content}
             date={item?.latestMessage?.createdAt && dayjs(new Date(item?.latestMessage?.createdAt).toString()).fromNow()}
-            YourID={userData.id}
+            YourID={userData?.id}
             unRead={item?.unreadMessagesCount}
           />
         </div>
       ))
     } else {
-      const filteredChats = chats?.filter((item: Chat) => item.users.find((user) => user?.userId._id.toString() === userData.id && user?.isStarred))
+      const filteredChats = chats?.filter((item: Chat) => item.users.find((user) => user?.userId._id.toString() === userData?.id && user?.isStarred))
 
       if (filteredChats.length === 0) {
         return <p className="text-neutral-500 text-center">You have no starred chats.</p>
@@ -89,10 +89,10 @@ const UserChats = ({ setSelectedChat, selectedChat, setIsRequest, currTabb, chat
             groupName={item?.chatName}
             isGroupChat={item?.isGroupChat}
             users={[item?.users]}
-            isSeen={item?.latestMessage?.readByUsers?.includes(userData.id || ' ')}
+            isSeen={item?.latestMessage?.readByUsers?.includes(userData?.id || ' ')}
             lastMessage={item?.latestMessage?.content}
             date={item?.latestMessage?.createdAt && dayjs(new Date(item?.latestMessage?.createdAt).toString()).fromNow()}
-            YourID={userData.id}
+            YourID={userData?.id}
             unRead={item?.unreadMessagesCount}
           />
         </div>
diff --git a/src/hooks/useLogOut.ts b/src/hooks/useLogOut.ts
new file mode 100644
index 00000000..b5c5b5d9
--- /dev/null
+++ b/src/hooks/useLogOut.ts
@@ -0,0 +1,21 @@
+import { useRouter } from 'next/navigation'
+import { useUniStore } from '@/store/store'
+import useCookie from './useCookie'
+
+export const useLogout = () => {
+  const router = useRouter()
+  const [, , deleteCookie] = useCookie('uni_user_token')
+  const [, , deleteRefreshCookie] = useCookie('uni_user_refresh_token')
+
+  const handleLogout = () => {
+    deleteCookie()
+    deleteRefreshCookie()
+    useUniStore.getState().reset()
+
+    localStorage.removeItem('store')
+
+    router.push('/login')
+  }
+
+  return { handleLogout }
+}
diff --git a/src/middleware.ts b/src/middleware.ts
index a1439d65..aa52c49e 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -1,7 +1,7 @@
 import { NextRequest, NextResponse } from 'next/server'
 import { isAuthenticated } from './utils/Authentication'
 
-const protectedRoutes = ['/community', '/timeline', '/:id']
+const protectedRoutes = ['/community', '/timeline', '/profile', '/:id', '/messages', '/notifications', '/ai-assistant', '/setting', '/connections']
 export default function middleware(req: NextRequest) {
   const pathName = req.nextUrl.pathname
 
diff --git a/src/services/edit-profile.ts b/src/services/edit-profile.ts
index 6a6f9b52..0a862680 100644
--- a/src/services/edit-profile.ts
+++ b/src/services/edit-profile.ts
@@ -16,7 +16,7 @@ export const useEditProfile = () => {
   const setUserProfileData = useUniStore((state) => state.setUserProfileData)
   const { userProfileData } = useUniStore()
   return useMutation({
-    mutationFn: (data: any) => editProfile(data, userProfileData._id || ''),
+    mutationFn: (data: any) => editProfile(data, userProfileData?._id || ''),
     onSuccess: (response: any) => {
       setUserProfileData(response.updatedUserProfile)
     },
diff --git a/src/services/university-community.ts b/src/services/university-community.ts
index 989e1a3e..69282f41 100644
--- a/src/services/university-community.ts
+++ b/src/services/university-community.ts
@@ -20,7 +20,7 @@ export function useGetSubscribedCommunties() {
     enabled: !!cookieValue,
   }) as UseQueryResult<Community[]>
 }
-export function useGetFilteredSubscribedCommunities(communityId: string) {
+export function useGetFilteredSubscribedCommunities(communityId: string = '') {
   const [cookieValue] = useCookie('uni_user_token')
   const queryClient = useQueryClient()
   return useMutation({
diff --git a/src/store/store.ts b/src/store/store.ts
index 167a8f63..83f8c05f 100644
--- a/src/store/store.ts
+++ b/src/store/store.ts
@@ -5,13 +5,30 @@ import { createUserProfileSlice } from './userProfileSlice/userProfileSlice'
 import { createSocketSlice } from './socketSlice/socketSlice'
 import { storeType } from './storeType'
 
+let finalCookie: any = null
+
+if (typeof document !== 'undefined') {
+  const cookieValue = document.cookie.split('; ').find((row) => row.startsWith('uni_user_token='))
+  finalCookie = cookieValue ? cookieValue.split('=')[1] : null
+}
+
 export const useUniStore = create<storeType>()(
   devtools(
+    // persist(
+    //   (...a) => ({
+    //     ...createUserSlice(...a),
+    //     ...createUserProfileSlice(...a),
+    //     ...createSocketSlice(...a),
+    //   }),
     persist(
-      (...a) => ({
-        ...createUserSlice(...a),
-        ...createUserProfileSlice(...a),
-        ...createSocketSlice(...a),
+      (set, get, api) => ({
+        ...createUserSlice(set, get, api),
+        ...createUserProfileSlice(set, get, api),
+        ...createSocketSlice(set, get, api),
+        reset: () => {
+          set({}, true)
+          api.persist.clearStorage()
+        },
       }),
       {
         name: 'store',
@@ -19,6 +36,7 @@ export const useUniStore = create<storeType>()(
           ...state,
           socket: undefined, // Exclude socket from persisted state
         }),
+        skipHydration: !finalCookie,
         // partialize: (state) => ({ products: state.products,userName:state.userName }),
         // skipHydration: true
       }
diff --git a/src/store/storeType.ts b/src/store/storeType.ts
index 0baa2b8a..1c8ce197 100644
--- a/src/store/storeType.ts
+++ b/src/store/storeType.ts
@@ -3,4 +3,9 @@ import { userProfileSlice } from './userProfileSlice/userProfileSlice'
 
 import { SocketSlice } from './socketSlice/socketSlice'
 
-export type storeType = userSlice & userProfileSlice & SocketSlice
+// export type storeType = userSlice & userProfileSlice & SocketSlice
+export type storeType = userSlice &
+  userProfileSlice &
+  SocketSlice & {
+    reset: () => void
+  }
diff --git a/src/store/userProfileSlice/userProfileSlice.ts b/src/store/userProfileSlice/userProfileSlice.ts
index f55b549e..ab3d348f 100644
--- a/src/store/userProfileSlice/userProfileSlice.ts
+++ b/src/store/userProfileSlice/userProfileSlice.ts
@@ -2,18 +2,18 @@ import { StateCreator } from 'zustand'
 import { userProfileType } from './userProfileType'
 
 type userProfileState = {
-  userProfileData: Partial<userProfileType>
+  userProfileData: Partial<userProfileType> | null
 }
 
 type userProfileAction = {
   setUserProfileData: (userProfileData: userProfileType) => void
   setUserFollowers: (communities: userProfileType['followers']) => void
   setUserfollowing: (communities: userProfileType['following']) => void
-  resetUserProfileData: () => void
 }
 
 const initialState: userProfileState = {
-  userProfileData: {},
+  userProfileData: null,
+  // userProfileData: {},
 }
 
 export type userProfileSlice = userProfileState & userProfileAction
@@ -35,5 +35,4 @@ export const createUserProfileSlice: StateCreator<userProfileSlice> = (set) => (
         following: followings,
       },
     })),
-  resetUserProfileData: () => set(initialState),
 })
diff --git a/src/store/userSlice/userSlice.ts b/src/store/userSlice/userSlice.ts
index 290599c1..87f20d74 100644
--- a/src/store/userSlice/userSlice.ts
+++ b/src/store/userSlice/userSlice.ts
@@ -2,7 +2,8 @@ import { StateCreator } from 'zustand'
 import { userType } from './userType'
 
 type userState = {
-  userData: Partial<userType>
+  // userData: Partial<userType>
+  userData: Partial<userType> | null
 }
 
 type userAction = {
@@ -13,7 +14,8 @@ type userAction = {
 }
 
 const initialState: userState = {
-  userData: {},
+  // userData: {},
+  userData: null,
 }
 
 export type userSlice = userState & userAction
diff --git a/src/types/CommuityGroup/index.ts b/src/types/CommuityGroup/index.ts
index eb2da281..4c4b7af3 100644
--- a/src/types/CommuityGroup/index.ts
+++ b/src/types/CommuityGroup/index.ts
@@ -143,3 +143,5 @@ export const subCategories: Record<Category, string[]> = {
   ],
   Others: [],
 }
+
+export const sortBy = ['name', 'latest', 'users', 'oldest']
diff --git a/src/utils/ZustandSocketProvider.tsx b/src/utils/ZustandSocketProvider.tsx
index 00e7ed85..1afeba56 100644
--- a/src/utils/ZustandSocketProvider.tsx
+++ b/src/utils/ZustandSocketProvider.tsx
@@ -29,16 +29,23 @@ const ZustandSocketProvider: React.FC<ZustandSocketProviderProps> = ({ children
   } = useGetUserProfileData(type)
 
   useEffect(() => {
-    if (userData.id) {
+    if (userData?.id) {
       const routeSegment = param.split('/')[1]
       const isRouteMessage = routeSegment !== 'messages'
-      initializeSocket(userData.id, refetchUserData, refetchNotification, refetchUserProfileData, refetchMessageNotification, isRouteMessage)
+      initializeSocket(userData?.id, refetchUserData, refetchNotification, refetchUserProfileData, refetchMessageNotification, isRouteMessage)
     }
 
+    // return () => {
+    //   disconnectSocket()
+    // }
     return () => {
-      disconnectSocket()
+      if (typeof disconnectSocket === 'function') {
+        disconnectSocket()
+      } else {
+        console.warn('disconnectSocket is not defined or not a function')
+      }
     }
-  }, [userData.id, initializeSocket, disconnectSocket, refetchNotification, param])
+  }, [userData?.id, initializeSocket, disconnectSocket, refetchNotification, param])
 
   useEffect(() => {
     if ((refectUserDataIsSuccess && !isFetching) || (refectUserProfileDataIsSuccess && !userProfileRefething)) {