Merge pull request #121 from Gather307/Schema-Updates

Gather307 · Jun 3, 2024 · 5b96b1e · 5b96b1e
2 parents 5fcc649 + 507b85c
commit 5b96b1e
Show file tree

Hide file tree

Showing 10 changed files with 50 additions and 43 deletions.
diff --git a/frontend/lib/edits.tsx b/frontend/lib/edits.tsx
@@ -3,6 +3,7 @@ import { IBasket } from "../../backend/models/basketSchema";
 import { IItem } from "../../backend/models/itemSchema";
 import { IUser } from "../../backend/models/userSchema";
 import { IGroup } from "../../backend/models/groupSchema";
+import { fetchBasket } from "./fetches";
 
 // const vite_backend_url = import.meta.env.VITE_BACKEND_URL as string;
 const vite_backend_url = "https://gather-app-307.azurewebsites.net";
@@ -95,10 +96,20 @@ export const moveItem = async (
   item: IItem,
 ) => {
   try {
-    console.log(userBaskets);
-    const itemBasket = userBaskets.find((b) => b._id === item.basket);
-    console.log(itemBasket);
-    const newBasketsItems = itemBasket?.items.filter((i) => i !== item._id);
+    if (newBasket._id === item.basket) {
+      console.log("Item already in basket");
+      return;
+    }
+    console.log(userBaskets, item, newBasket);
+    const res = await fetchBasket(String(item.basket));
+    if (!res.ok) {
+      console.error("Failed to fetch current basket");
+      return;
+    } else {
+    const currentBasket = await res.json() as IBasket;
+    console.log(currentBasket);
+    const newBasketsItems = currentBasket?.items.filter((i) => i !== item._id);
+    console.log(newBasketsItems);
     const removeItemFromBasket = await fetch(
       `${vite_backend_url}/baskets/${item.basket}`,
       {
@@ -146,6 +157,7 @@ export const moveItem = async (
     } else {
       console.error("Failed to update basket");
     }
+    }
   } catch (error) {
     console.error("Error moving item:", error);
   }

diff --git a/frontend/lib/fetches.tsx b/frontend/lib/fetches.tsx
@@ -204,6 +204,7 @@ export const fetchUserBaskets = async (userId: string) => {
     }
     return userBaskets;
   }
+  return [];
 };
 
 export const fetchGroups = async (userGroups: ObjectId[]) => {

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -18,18 +18,6 @@ const vite_backend_url = "https://gather-app-307.azurewebsites.net";
 
 console.log("Backend URL:", vite_backend_url);
 
-// The azure deployed backend url: gather-app-307.azurewebsites.net
-
-const getRandomColor = () => {
-  //prob have to change this later but made for demo
-  const letters = "0123456789ABCDEF";
-  let color = "#";
-  for (let i = 0; i < 6; i++) {
-    color += letters[Math.floor(Math.random() * 16)];
-  }
-  return color;
-};
-
 function App() {
   const [token, setToken] = useState(localStorage.getItem("token") ?? "");
   const [username, setUsername] = useState("");
@@ -72,7 +60,6 @@ function App() {
   }, [token]);
 
   const [user, setUser] = useState<IUser | null>(null);
-  const avatarColor = getRandomColor();
   const [loggedIn, setLoggedIn] = useState(false);
 
   return (
@@ -81,7 +68,7 @@ function App() {
         <Box width="100vw" height="100vh" display="flex" flexDirection="column">
           {loggedIn && username != "" ? (
             <NavbarSignedIn
-              stateVariable={{ username, token, avatarColor }}
+              stateVariable={{ username, token }}
               updateState={{ setUser, setToken }}
             />
           ) : (
@@ -107,7 +94,6 @@ function App() {
               element={
                 <ProfilePage
                   LoggedInUser={user ? user._id.toString() : ""}
-                  avatarColor={avatarColor}
                 />
               }
             />

diff --git a/frontend/src/components/ItemGroup.tsx b/frontend/src/components/ItemGroup.tsx
@@ -85,19 +85,26 @@ const ItemGroup: React.FC<Props> = ({
   }, [basket]);
 
   const removeItem = async (item: IItem) => {
-    removeItemFromBasketAndDelete(userBaskets, item).then(() => {
-      const newItems = items.filter((i) => i._id !== item._id);
-      setItems(newItems);
+    const newItems = items.filter((i) => i._id !== item._id);
+    setItems(newItems);
+    await removeItemFromBasketAndDelete(userBaskets, item).then(() => {
+      console.log("Item removed successfully");
+      setTimeout(() => {
+        window.location.reload();
+      }, 500);
     });
-    window.location.reload();
   };
 
   const handleMove = async (basket: IBasket, item: IItem) => {
     try {
       console.log(`Basket ID: ${basket._id} clicked`);
       console.log(`Item ID: ${item._id} clicked`);
-      await moveItem(userBaskets, basket, item);
-      window.location.reload();
+      await moveItem(userBaskets, basket, item).then(() => {
+        console.log("Item moved successfully");
+        setTimeout(() => {
+          window.location.reload();
+        }, 500);
+      });
     } catch (error) {
       console.error("Invalid user ID");
     }
@@ -144,6 +151,7 @@ const ItemGroup: React.FC<Props> = ({
           <Tbody>
             {!loading && items.length > 0 ? (
               items.map((item, index) => (
+                console.log(item),
                 <Tr key={index}>
                   <Td width="25%">{item.name}</Td>
                   <Td width="50%">{item.notes}</Td>

diff --git a/frontend/src/components/NavbarSignedIn.tsx b/frontend/src/components/NavbarSignedIn.tsx
@@ -98,12 +98,9 @@ const NavbarSignedIn = ({ stateVariable, updateState }: Props) => {
                 _focus={{ boxShadow: "0 0 0 3px #49A078" }}
               >
                 <Avatar
-                  size={"sm"}
-                  bg={stateVariable.avatarColor}
-                  color="white"
-                >
-                  {/* {`${stateVariable.user.firstName[0]}${stateVariable.user.lastName[0]}`.toUpperCase()} */}
-                </Avatar>
+                  name={stateVariable.username}
+                  src={`http://localhost:3001/${stateVariable._id}/avatar`}
+                />
               </MenuButton>
               <MenuList>
                 <MenuItem onClick={handleProfileClick}>Profile</MenuItem>

diff --git a/frontend/src/components/UserProfile.tsx b/frontend/src/components/UserProfile.tsx
@@ -20,10 +20,9 @@ import { editUser } from "../../lib/edits";
 
 interface UserProfileProps {
   userId: string;
-  avatarColor: string;
 }
 
-const UserProfile: React.FC<UserProfileProps> = ({ userId, avatarColor }) => {
+const UserProfile: React.FC<UserProfileProps> = ({ userId }) => {
   const [isEditing, setIsEditing] = useState(false);
   const [profileData, setProfileData] = useState({
     userId: "",
@@ -95,9 +94,11 @@ const UserProfile: React.FC<UserProfileProps> = ({ userId, avatarColor }) => {
   return (
     <Box bg="white" borderRadius="md" boxShadow="md" p={6} mb={4}>
       <Flex justifyContent="center" mb={4}>
-        <Avatar size={{ base: "xl", md: "2xl" }} bg={avatarColor} color="white">
-          {/* {initials} */} {/* it looked weird w initials in the avatar */}
-        </Avatar>
+        <Avatar
+          size="2xl"
+          name={profileData.username}
+          src={`http://localhost:3001/${userId}/avatar`}
+        />
       </Flex>
       <Heading size="md" mb={4} alignSelf={"center"} textAlign={"center"}>
         {profileData.firstName} {profileData.lastName}'s Profile

diff --git a/frontend/src/pages/IndividualGroupPage.tsx b/frontend/src/pages/IndividualGroupPage.tsx
@@ -113,7 +113,7 @@ const IndividualGroupPage: React.FC<Props> = ({
 
   useEffect(() => {
     console.log(`Loading: ${loading}`);
-    if (!LoggedInUser) {
+    if (!localStorage.getItem("token")) {
       navigate("/login");
     }
     if (groupId) {

diff --git a/frontend/src/pages/ItemsPage.tsx b/frontend/src/pages/ItemsPage.tsx
@@ -51,7 +51,9 @@ const ItemsPage: React.FC<Props> = ({
           console.log(`Terrible error occurred! ${err}`);
         });
     } else {
-      navigate("/login");
+      if (!stateVariable.token) {
+        navigate("/login");
+      }
     }
   }, [stateVariable.user]);
 

diff --git a/frontend/src/pages/MyGroupsPage.tsx b/frontend/src/pages/MyGroupsPage.tsx
@@ -70,7 +70,9 @@ const GroupPage: React.FC<Props> = ({
           console.log(`Terrible error occurred! ${err}`);
         });
     } else {
-      navigate("/login");
+      if (!stateVariable.token) {
+        navigate("/login");
+      }
     }
   }, [stateVariable.user]);
 

diff --git a/frontend/src/pages/ProfilePage.tsx b/frontend/src/pages/ProfilePage.tsx
@@ -6,16 +6,14 @@ import { useNavigate } from "react-router-dom";
 
 interface ProfilePageProps {
   LoggedInUser: string;
-  avatarColor: string;
 }
 
 const ProfilePage: React.FC<ProfilePageProps> = ({
   LoggedInUser,
-  avatarColor,
 }) => {
   const navigate = useNavigate();
   useEffect(() => {
-    if (!LoggedInUser) {
+    if (!localStorage.getItem("token")) {
       navigate("/login");
     }
   }
@@ -29,7 +27,7 @@ const ProfilePage: React.FC<ProfilePageProps> = ({
         justifyContent={"space-between"}
       >
         <GridItem p={4} height="auto" width={{ base: "90vw", md: "45vw" }}>
-          <UserProfile userId={LoggedInUser} avatarColor={avatarColor} />
+          <UserProfile userId={LoggedInUser}/>
         </GridItem>
         <GridItem p={4} width={{ base: "90vw", md: "52vw" }}>
           <Box
-Original file line number
+Diff line change
@@ Expand Up / @@ -204,6 +204,7 @@ export const fetchUserBaskets = async (userId: string) => { @@
         }
         return userBaskets;
       }
+      return [];
     };
     export const fetchGroups = async (userGroups: ObjectId[]) => {
@@ Expand Down @@