Shopping List backend implementation

- Added creatorId to the grocery item in db and showed the name of the user that requested to add the new grocery

components/pages/grocery/GroceryItem.tsx

@@ -6,6 +6,8 @@ import EditGroceryFrequency from "./EditGroceryFrequency";
 import EditGroceryItem from "./EditGroceryItem";
 import {StyleSheet} from "react-native";
 import {IGrocery} from "@/hooks/firebase/types/groceryData";
+import firestore from "@react-native-firebase/firestore";
+import {UserProfile} from "@/hooks/firebase/types/profileTypes";
 
 const GroceryItem = ({
   item,
@@ -22,6 +24,7 @@ const GroceryItem = ({
   const [category, setCategory] = useState<GroceryCategory>(
     GroceryCategory.None
   );
+  const [itemCreator, setItemCreator] = useState<UserProfile>(null);
 
   const handleTitleChange = (newTitle: string) => {
     updateGroceryItem({id: item?.id, title: newTitle});
@@ -33,8 +36,23 @@ const GroceryItem = ({
 
   useEffect(() => {
     setNewTitle(item.title);
+
+    getItemCreator(item?.creatorId);
   }, []);
 
+  const getItemCreator = async (uid: string | undefined) => {
+    if (uid) {
+      const documentSnapshot = await firestore()
+          .collection("Profiles")
+          .doc(uid)
+          .get();
+
+      if (documentSnapshot.exists) {
+        setItemCreator(documentSnapshot.data() as UserProfile)
+      }
+    }
+  }
+
   return (
     <View
       key={item.id}
@@ -122,7 +140,7 @@ const GroceryItem = ({
               }}
             ></View>
             <Text color="#858585" text70>
-              Requested by Austin
+              Requested by {itemCreator?.firstName}
             </Text>
           </View>
         </View>