- Grocery list changes

- Removed the Add item button from the bottom and added an empty grocery box

components/pages/grocery/GroceryList.tsx

@@ -98,6 +98,12 @@ const GroceryList = ({onInputFocus}: {onInputFocus: (y: number) => void}) => {
         setPendingGroceries(groceries?.filter((item) => !item.approved));
     }, [groceries]);
 
+    const handleCancelAddGrocery = () => {
+        setIsAddingGrocery(false);
+        setTitle("");
+        setCategory(GroceryCategory.None)
+    }
+
     return (
         <View marginH-20 marginB-45>
             <HeaderTemplate
@@ -244,21 +250,19 @@ const GroceryList = ({onInputFocus}: {onInputFocus: (y: number) => void}) => {
                     </Text>
                 </View>
             </View>
-            {isAddingGrocery && (
-                <View style={{marginTop: 8}}>
-                    <EditGroceryItem
-                        editGrocery={{
-                            title: title,
-                            setCategory: setCategory,
-                            category: category,
-                            setTitle: setTitle,
-                            setSubmit: setSubmitted,
-                            closeEdit: () => setIsAddingGrocery(false)
-                        }}
-                        onInputFocus={onInputFocus}
-                    />
-                </View>
-            )}
+            <View style={{marginTop: 8}}>
+                <EditGroceryItem
+                    editGrocery={{
+                        title: title,
+                        setCategory: setCategory,
+                        category: category,
+                        setTitle: setTitle,
+                        setSubmit: setSubmitted,
+                        closeEdit: handleCancelAddGrocery
+                    }}
+                    onInputFocus={onInputFocus}
+                />
+            </View>
 
             {/* Render Approved Groceries Grouped by Category */}
             {approvedGroceries?.length > 0