diff --git a/components/pages/grocery/EditGroceryFrequency.tsx b/components/pages/grocery/EditGroceryFrequency.tsx index 83a542b..59003fb 100644 --- a/components/pages/grocery/EditGroceryFrequency.tsx +++ b/components/pages/grocery/EditGroceryFrequency.tsx @@ -1,5 +1,5 @@ import { StyleSheet } from "react-native"; -import React, { useState } from "react"; +import React from "react"; import { Dialog, Text, @@ -11,9 +11,9 @@ import { } from "react-native-ui-lib"; import { GroceryFrequency, - IGrocery, useGroceryContext, } from "@/contexts/GroceryContext"; +import { IGrocery } from "@/hooks/firebase/types/groceryData"; interface EditGroceryFrequencyProps { visible: boolean; onClose: () => void; @@ -42,7 +42,7 @@ const EditGroceryFrequency = (props: EditGroceryFrequencyProps) => { - updateGroceryItem(props.item.id, { recurring: value }) + updateGroceryItem({id: props.item.id, recurring: value}) } onColor={"lime"} /> @@ -56,8 +56,9 @@ const EditGroceryFrequency = (props: EditGroceryFrequencyProps) => { const selectedFrequency = GroceryFrequency[item as keyof typeof GroceryFrequency]; if (selectedFrequency) { - updateGroceryItem(props.item.id, { - frequency: selectedFrequency, + updateGroceryItem({ + id: props.item.id, + frequency: selectedFrequency, }); } else { console.error("Invalid frequency selected"); diff --git a/components/pages/grocery/GroceryItem.tsx b/components/pages/grocery/GroceryItem.tsx index 97e5ade..138ad0e 100644 --- a/components/pages/grocery/GroceryItem.tsx +++ b/components/pages/grocery/GroceryItem.tsx @@ -1,34 +1,21 @@ -import { - View, - Text, - Button, - TouchableOpacity, - Checkbox, - ButtonSize, -} from "react-native-ui-lib"; -import React, { useEffect, useState } from "react"; -import { ProfileType, useAuthContext } from "@/contexts/AuthContext"; -import { MaterialCommunityIcons, AntDesign } from "@expo/vector-icons"; -import { ListItem } from "react-native-ui-lib"; -import { - GroceryCategory, - IGrocery, - useGroceryContext, -} from "@/contexts/GroceryContext"; +import {Checkbox, Text, TouchableOpacity, View,} from "react-native-ui-lib"; +import React, {useEffect, useState} from "react"; +import {AntDesign} from "@expo/vector-icons"; +import {GroceryCategory, useGroceryContext,} from "@/contexts/GroceryContext"; import EditGroceryFrequency from "./EditGroceryFrequency"; import EditGroceryItem from "./EditGroceryItem"; -import { StyleSheet } from "react-native"; +import {StyleSheet} from "react-native"; +import {IGrocery} from "@/hooks/firebase/types/groceryData"; const GroceryItem = ({ item, handleItemApproved, }: { item: IGrocery; - handleItemApproved: (id: number, changes: Partial) => void; + handleItemApproved: (id: string, changes: Partial) => void; }) => { - const { updateGroceryItem, groceries } = useGroceryContext(); + const { updateGroceryItem } = useGroceryContext(); - const { profileType } = useAuthContext(); const [openFreqEdit, setOpenFreqEdit] = useState(false); const [isEditingTitle, setIsEditingTitle] = useState(false); const [newTitle, setNewTitle] = useState(""); @@ -37,11 +24,11 @@ const GroceryItem = ({ ); const handleTitleChange = (newTitle: string) => { - updateGroceryItem(item.id, { title: newTitle }); + updateGroceryItem({id: item?.id, title: newTitle}); }; const handleCategoryChange = (newCategory: GroceryCategory) => { - updateGroceryItem(item.id, { category: newCategory }); + updateGroceryItem({id: item?.id, category: newCategory}); }; useEffect(() => { @@ -114,7 +101,7 @@ const GroceryItem = ({ containerStyle={styles.checkbox} hitSlop={20} onValueChange={() => - updateGroceryItem(item.id, { bought: !item.bought }) + updateGroceryItem({ id: item.id, bought: !item.bought }) } /> )} diff --git a/components/pages/grocery/GroceryList.tsx b/components/pages/grocery/GroceryList.tsx index 3d69679..6c53c72 100644 --- a/components/pages/grocery/GroceryList.tsx +++ b/components/pages/grocery/GroceryList.tsx @@ -1,18 +1,13 @@ -import { FlatList, StyleSheet } from "react-native"; -import React, { RefObject, useEffect, useState } from "react"; -import { View, Text, ListItem, Button, TextField, TextFieldRef } from "react-native-ui-lib"; +import {FlatList, StyleSheet} from "react-native"; +import React, {useEffect, useState} from "react"; +import {Button, Text, View} from "react-native-ui-lib"; import GroceryItem from "./GroceryItem"; -import { - IGrocery, - GroceryCategory, - GroceryFrequency, - useGroceryContext, -} from "@/contexts/GroceryContext"; +import {GroceryCategory, GroceryFrequency, useGroceryContext,} from "@/contexts/GroceryContext"; import HeaderTemplate from "@/components/shared/HeaderTemplate"; -import CategoryDropdown from "./CategoryDropdown"; -import { AntDesign, MaterialIcons } from "@expo/vector-icons"; +import {AntDesign, MaterialIcons} from "@expo/vector-icons"; import EditGroceryItem from "./EditGroceryItem"; -import { ProfileType, useAuthContext } from "@/contexts/AuthContext"; +import {ProfileType, useAuthContext} from "@/contexts/AuthContext"; +import {IGrocery} from "@/hooks/firebase/types/groceryData"; const GroceryList = () => { const { @@ -24,10 +19,10 @@ const GroceryList = () => { } = useGroceryContext(); const { profileData } = useAuthContext(); const [approvedGroceries, setapprovedGroceries] = useState( - groceries.filter((item) => item.approved === true) + groceries?.filter((item) => item.approved === true) ); const [pendingGroceries, setPendingGroceries] = useState( - groceries.filter((item) => item.approved !== true) + groceries?.filter((item) => item.approved !== true) ); const [category, setCategory] = useState( GroceryCategory.Bakery @@ -39,7 +34,7 @@ const GroceryList = () => { const [approvedVisible, setApprovedVisible] = useState(true); // Group approved groceries by category - const approvedGroceriesByCategory = approvedGroceries.reduce( + const approvedGroceriesByCategory = approvedGroceries?.reduce( (groups: any, item: IGrocery) => { const category = item.category || "Uncategorized"; if (!groups[category]) { @@ -76,8 +71,8 @@ const GroceryList = () => { }, [category]); useEffect(() => { - setapprovedGroceries(groceries.filter((item) => item.approved === true)); - setPendingGroceries(groceries.filter((item) => item.approved !== true)); + setapprovedGroceries(groceries?.filter((item) => item.approved === true)); + setPendingGroceries(groceries?.filter((item) => item.approved !== true)); }, [groceries]); return ( @@ -93,8 +88,8 @@ const GroceryList = () => { style={{ borderRadius: 50 }} > - {approvedGroceries.length} list{" "} - {approvedGroceries.length === 1 ? ( + {approvedGroceries?.length} list{" "} + {approvedGroceries?.length === 1 ? ( item @@ -111,7 +106,7 @@ const GroceryList = () => { style={{ borderRadius: 50 }} > - {pendingGroceries.length} pending + {pendingGroceries?.length} pending