New

campuscommune/components/AvatarPopoverContent.tsx

@@ -84,7 +84,6 @@ const AvatarPopoverContent: React.FC<AvatarPopoverContentProps> = ({
     user_name,
     user_email,
 }) => {
-
     const router = useRouter();
 
     return (

campuscommune/hooks/useGetCurrentUser.tsx

@@ -3,40 +3,24 @@ import { useAuthState } from "react-firebase-hooks/auth";
 import { auth, db } from "@/firebase/config";
 import { currentUserType } from "@/types";
 import { collection, getDocs, query, where } from "firebase/firestore";
-import { useRouter } from "next/navigation";
 import { onAuthStateChanged } from "firebase/auth";
 
-// This hook is used to get the current user's data from the database
+
 const useGetCurrentUser = () => {
     const [user] = useAuthState(auth);
     const [currentUser, setCurrentUser] = React.useState<currentUserType>({} as currentUserType);
     const usersCollectionRef = collection(db, "user");
-    const router = useRouter();
-
 
     useEffect(() => {
         const getCurrentUser = async () => {
+            if (!user) return;
             const userRef = query(usersCollectionRef, where("email", "==", user?.email || ""));
             const querySnapshot = await getDocs(userRef);
             setCurrentUser(querySnapshot.docs.map((doc) => doc.data())[0] as currentUserType);
         };
 
         getCurrentUser();
     }, [user]);
-
-
-    useEffect(() => {
-        // listen for auth state changes
-        const unsubscribe = onAuthStateChanged(auth, (user) => {
-            if (!user) {
-                router.push("/auth/signin");
-            }
-        });
-
-        return () => {
-            unsubscribe();
-        }
-    }, []);
 
     return { currentUser };
 }

campuscommune/modals/buttons/PostModeBtns.tsx

@@ -41,7 +41,6 @@ const PostModeBtns: React.FC<PostModeBtnsProps> = ({
     reader.onload = async (event: any) => {
       const image = await resizeFile(file) as string;
       setImage(image as string);
-      console.log(`Post: ${event.target.result}`);
     };
 
     reader.readAsDataURL(file);

campuscommune/modals/questionModal/AskModal.tsx

@@ -10,6 +10,7 @@ import BottomActions from "../buttons/BottomActions";
 import CreateMode from "./CreateMode";
 import { ModalFooter } from "@nextui-org/react";
 import { Answer, QuestionType } from "@/types";
+import { useFeed } from "@/services/useFeed";
 
 
 
@@ -27,6 +28,7 @@ const AskModal = () => {
   const { setPostLoading } = usePostLoadingStore();
   const { currentUser } = useGetCurrentUser();
   const [categories, setCategories] = useState<string[]>([]);
+  const { mutate } = useFeed();
 
 
   const handleAddQuestion = useCallback(async () => {
@@ -46,7 +48,7 @@ const AskModal = () => {
         answers: [] as Answer[],
       } as unknown as QuestionType;
 
-      await addDoc(questionsCollectionRef, Question);
+      Object.keys(currentUser).length > 0 && await addDoc(questionsCollectionRef, Question);
       setOpen(false);
       setStep(1);
       setText("");
@@ -56,6 +58,7 @@ const AskModal = () => {
       }, 2000);
 
       toast.success("Question added successfully!");
+      mutate();
     } catch (error) {
       console.log(error);
       toast.error("Error adding question");
@@ -64,16 +67,15 @@ const AskModal = () => {
   }, [text]);
 
   const handleAddPost = useCallback(async () => {
-    if (title.split("").length < 1 && description.split("").length < 1) return;
+    if (title.split("").length === 0 && description.split("").length === 0) return;
     try {
       setPostLoading(true);
-
       const Post = {
         title: title,
         body: description,
         author_email: currentUser.email,
         author_major: currentUser.major,
-        author_name: currentUser.username,
+        author_name: currentUser.full_name,
         created_at: new Date(),
         type: "post",
         image: image as string,
@@ -93,7 +95,7 @@ const AskModal = () => {
       console.log(error);
       toast.error("Error adding post");
     }
-    
+
   }, []);
 
   const handleChangeStep = useCallback(() => {
@@ -106,39 +108,39 @@ const AskModal = () => {
 
 
   return (
-      <div
-        className={`flex flex-col gap-2 overflow-y-scroll `}
-      >
-        <CreateMode
+    <div
+      className={`flex flex-col gap-2 overflow-y-scroll `}
+    >
+      <CreateMode
+        mode={mode}
+        setMode={setMode}
+        step={step}
+        text={text}
+        setText={setText}
+        image={image}
+        setImage={setImage}
+        title={title}
+        setTitle={setTitle}
+        description={description}
+        setDescription={setDescription}
+        setCategories={setCategories}
+      />
+      <ModalFooter
+        style={{ borderTopWidth: "0.5px" }}
+        className="w-full py-3 px-3 border-t-neutral-700 flex items-end justify-end gap-3">
+        <BottomActions
           mode={mode}
-          setMode={setMode}
           step={step}
-          text={text}
+          handleChangeStep={handleChangeStep}
+          handleAddQuestion={handleAddQuestion}
+          setStep={setStep}
           setText={setText}
           image={image}
           setImage={setImage}
-          title={title}
-          setTitle={setTitle}
-          description={description}
-          setDescription={setDescription}
-          setCategories={setCategories}
+          handleAddPost={handleAddPost}
         />
-        <ModalFooter 
-        style={{ borderTopWidth: "0.5px" }}
-        className="w-full py-3 px-3 border-t-neutral-700 flex items-end justify-end gap-3">
-            <BottomActions
-              mode={mode}
-              step={step}
-              handleChangeStep={handleChangeStep}
-              handleAddQuestion={handleAddQuestion}
-              setStep={setStep}
-              setText={setText}
-              image={image}
-              setImage={setImage}
-              handleAddPost={handleAddPost}
-            />
-        </ModalFooter>
-      </div>
+      </ModalFooter>
+    </div>
   );
 };
 

campuscommune/mypages/layout/Header.tsx

@@ -24,26 +24,17 @@ const Header = () => {
   const { toggleSidebar, isSidebarOpen } = useSidebarStore();
   const [user] = useAuthState(auth);
   const [ notificationsCount, setNotificationsCount ] = useState<number>(0);
-  const usersCollectionRef = collection(db, "user");
   const notificationsCollectionRef = collection(db, "notifications");
-  // const [currentUser, setCurrentUser] = useState<currentUserType>({} as currentUserType);
   const { currentUser } = useGetCurrentUser();
 
   useEffect(() => {
-    const getCurrentUser = async () => {
-      // const userRef = query(usersCollectionRef, where("email", "==", user?.email || ""));
-      // const querySnapshot = await getDocs(userRef);
-      // setCurrentUser(querySnapshot.docs.map((doc) => doc.data())[0] as currentUserType);
-    };
-
     // listen for queried notifications for currentUser and update notificationsCount
     const notificationsRef = query(notificationsCollectionRef, where("recipient_email", "==", user?.email || ""));
     const unsubscribe = onSnapshot(notificationsRef, (snapshot) => {
       setNotificationsCount(snapshot.docs.length);
     });
 
     return () => {
-      getCurrentUser();
       unsubscribe();
     }
   }, [user]);

campuscommune/mypages/profile/Hero.tsx

@@ -8,6 +8,8 @@ import ProfileAbout from "./ProfileAbout";
 import ProfileBtns from "./ProfileBtns";
 import { Popover, PopoverTrigger, PopoverContent } from "@nextui-org/react";
 import { FaTwitter } from "react-icons/fa";
+import { SlPencil } from "react-icons/sl";
+import { useRef, useState } from "react";
 
 
 const Hero: React.FC<currentUserType> = ({
@@ -23,6 +25,8 @@ const Hero: React.FC<currentUserType> = ({
     level,
     about_me,
 }) => {
+    const [showEditProfile, setShowEditProfile] = useState<boolean>(false);
+    const profileRef = useRef<HTMLSpanElement | null>(null);
 
     const levels = {
         1: "Freshman",
@@ -36,11 +40,20 @@ const Hero: React.FC<currentUserType> = ({
         <div className="flex flex-col gap-4 w-full ">
             <div className="flex flex-row gap-2 items-start w-full">
                 <div className="pr-2">
+                    {showEditProfile && profileRef.current &&
+                        <div className={`p-2 bg-blue-500 rounded-full absolute z-30 top-[${profileRef.current.getBoundingClientRect().top + 100}rem] left-[${profileRef.current.getBoundingClientRect().left}rem]`}>
+                            <SlPencil size={18} className="text-[#fff] cursor-pointer" />
+                        </div>
+                    }
                     <Avatar
+                        onMouseEnter={() => setShowEditProfile(true)}
+                        onMouseLeave={() => setShowEditProfile(false)}
+                        onClick={() => {}}
+                        ref={profileRef}
                         src={profile_pic || "https://collegelifemadeeasy.com/wp-content/uploads/2023/01/black-women-scholarships.jpg"} 
                         size="lg"
                         alt="Profile"
-                        style={{width: "120px", height: "120px"}}
+                        style={{width: "120px", height: "120px", cursor: "pointer"}}
                     />
                 </div>
                 <div className="flex flex-col gap-2">

campuscommune/mypages/profile/ProfileFeed.tsx

@@ -32,7 +32,7 @@ const ProfileFeed = ({
 
     if (feed.length <= 0) return (
         <div className="w-full h-full flex justify-center items-center">
-            <h1 className="text-2xl font-semibold text-center">No posts yet</h1>
+            <h1 className="text-2xl font-semibold text-center tra">No posts yet</h1>
         </div>
     );