bugfixes

components/pages/brain_dump/BrainDumpPage.tsx

@@ -1,12 +1,9 @@
-import { Dimensions, ScrollView } from "react-native";
+import {Dimensions, ScrollView, StyleSheet} from "react-native";
 import React, {useState} from "react";
-import { View, Text, Button } from "react-native-ui-lib";
+import {Button, Text, TextField, View} from "react-native-ui-lib";
 import DumpList from "./DumpList";
 import HeaderTemplate from "@/components/shared/HeaderTemplate";
-import { TextField } from "react-native-ui-lib";
-import { StyleSheet } from "react-native";
 import {Feather, MaterialIcons} from "@expo/vector-icons";
-import { TextInput } from "react-native-gesture-handler";
 import AddBrainDump from "./AddBrainDump";
 import LinearGradient from "react-native-linear-gradient";
 
@@ -61,23 +58,22 @@ const BrainDumpPage = () => {
                 </ScrollView>
             </View>
             <LinearGradient
-        colors={["#f2f2f2", "transparent"]}
+                colors={["#f9f8f700", "#f9f8f7"]}
-        start={{ x: 0.5, y: 1 }}
+                locations={[0,1]}
-        end={{ x: 0.5, y: 0 }}
                 style={{
                     position: "absolute",
                     bottom: 0,
-          height: 90,
+                    height: 120,
                     width: Dimensions.get("screen").width,
+                    justifyContent:'center',
+                    alignItems:"center"
                 }}
             >
                 <Button
                     style={{
                         height: 40,
                         position: "relative",
-            marginLeft: "auto",
+                        width: "90%",
-            width: 20,
-            right: 20,
                         bottom: -10,
                         borderRadius: 30,
                         backgroundColor: "#fd1775",

components/pages/calendar/CalendarHeader.tsx

@@ -1,12 +1,5 @@
 import React, {memo} from "react";
-import {
+import {Button, Picker, PickerModes, SegmentedControl, Text, View,} from "react-native-ui-lib";
-  Button,
-  Picker,
-  PickerModes,
-  SegmentedControl,
-  Text,
-  View,
-} from "react-native-ui-lib";
 import {MaterialIcons} from "@expo/vector-icons";
 import {modeMap, months} from "./constants";
 import {StyleSheet} from "react-native";
@@ -83,13 +76,13 @@ export const CalendarHeader = memo(() => {
                         size={"xSmall"}
                         marginR-0
                         avoidInnerPadding
-            padding-7
                         style={{
-              borderRadius: 5,
+                            borderRadius: 50,
                             backgroundColor: "white",
                             borderWidth: 0.7,
                             borderColor: "#dadce0",
                             height: 30,
+                            paddingHorizontal: 10
                         }}
                         labelStyle={{
                             fontSize: 12,
@@ -101,8 +94,6 @@ export const CalendarHeader = memo(() => {
                         })}
                         onPress={() => {
                             setSelectedDate(new Date());
-              setMode("day");
-              console.log(profileData?.timeZone)
                         }}
                     />
                 )}

components/pages/calendar/EventCalendar.tsx

@@ -103,10 +103,11 @@ export const EventCalendar: React.FC<EventCalendarProps> = React.memo(
         }, []);
 
         const dayHeaderColor = useMemo(() => {
-            return isSameDate(todaysDate, selectedDate) && mode === "day" ? "white" : "#4d4d4d";
+            return isSameDate(todaysDate, selectedDate) ? "white" : "#4d4d4d";
         }, [selectedDate, mode]);
 
         const dateStyle = useMemo(() => {
+            if (mode === "week") return undefined
             return isSameDate(todaysDate, selectedDate) && mode === "day"
                 ? styles.dayHeader
                 : styles.otherDayHeader;

components/pages/grocery/AddGroceryItem.tsx

@@ -1,30 +1,12 @@
 import {StyleSheet} from "react-native";
-import React, { useState } from "react";
+import React from "react";
-import {
+import {Button, View,} from "react-native-ui-lib";
-  Button,
-  Colors,
-  Dialog,
-  Drawer,
-  Text,
-  View,
-  PanningProvider,
-} from "react-native-ui-lib";
 import {useGroceryContext} from "@/contexts/GroceryContext";
 import {FontAwesome6} from "@expo/vector-icons";
-interface AddGroceryItemProps {
-  visible: boolean;
-  onClose: () => void;
-}
-const AddGroceryItem = () => {
-  const { isAddingGrocery, setIsAddingGrocery } = useGroceryContext();
-  const [visible, setVisible] = useState<boolean>(false);
 
-  const handleShowDialog = () => {
+const AddGroceryItem = () => {
-    setVisible(true);
+    const {setIsAddingGrocery} = useGroceryContext();
-  };
+
-  const handleHideDialog = () => {
-    setVisible(false);
-  };
     return (
         <View
             row

components/pages/grocery/EditGroceryItem.tsx

@@ -1,6 +1,5 @@
-import { Text, View } from "react-native-ui-lib";
+import {Text, TextField, TextFieldRef, View} from "react-native-ui-lib";
-import React, { useEffect, useRef, useState } from "react";
+import React, {useEffect, useRef} from "react";
-import { TextField, TextFieldRef } from "react-native-ui-lib";
 import {GroceryCategory, useGroceryContext} from "@/contexts/GroceryContext";
 import {Dropdown} from "react-native-element-dropdown";
 import CloseXIcon from "@/assets/svgs/CloseXIcon";
@@ -19,6 +18,7 @@ interface IEditGrocery {
     handleEditSubmit?: Function;
 }
 
+
 const EditGroceryItem = ({editGrocery}: { editGrocery: IEditGrocery }) => {
     const {fuzzyMatchGroceryCategory} = useGroceryContext();
     const inputRef = useRef<TextFieldRef>(null);
@@ -30,10 +30,29 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
         })
     );
 
+    const handleSubmit = () => {
+        inputRef?.current?.blur()
+        console.log("CALLLLLL")
+        if (editGrocery.setSubmit) {
+            editGrocery.setSubmit(true);
+        }
+        if (editGrocery.handleEditSubmit) {
+            editGrocery.handleEditSubmit({
+                id: editGrocery.id,
+                title: editGrocery.title,
+                category: editGrocery.category,
+            });
+        }
+        if (editGrocery.closeEdit) {
+            editGrocery.closeEdit();
+        }
+    }
+
     useEffect(() => {
         if (inputRef.current) {
-      inputRef.current.focus(); // Focus on the TextField
+            inputRef.current.focus();
         }
+
         console.log(editGrocery.category);
     }, []);
 
@@ -51,10 +70,12 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
             <View row spread centerV>
                 <TextField
                     text70T
-          style={{}}
                     ref={inputRef}
                     placeholder="Grocery"
                     value={editGrocery.title}
+                    onSubmitEditing={handleSubmit}
+                    numberOfLines={1}
+                    returnKeyType="done"
                     onChangeText={(value) => {
                         editGrocery.setTitle(value);
                         let groceryCategory = fuzzyMatchGroceryCategory(value);
@@ -72,21 +93,7 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
                             color: "green",
                             marginRight: 15,
                         }}
-                onPress={() => {
+                        onPress={handleSubmit}
-                    if (editGrocery.setSubmit) {
-                        editGrocery.setSubmit(true);
-                    }
-                    if (editGrocery.handleEditSubmit) {
-                        editGrocery.handleEditSubmit({
-                            id: editGrocery.id,
-                            title: editGrocery.title,
-                            category: editGrocery.category,
-                        });
-                    }
-                    if (editGrocery.closeEdit) {
-                        editGrocery.closeEdit();
-                    }
-                }}
                     />
                     <CloseXIcon
                         onPress={() => {
@@ -114,7 +121,8 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
                 itemContainerStyle={styles.itemStyle}
                 selectedTextStyle={styles.selectedText}
                 renderLeftIcon={() => (
-            <DropdownIcon style={{ marginRight: 8 }} color={editGrocery.category == GroceryCategory.None ? "#7b7b7b" : "#fd1775"} />
+                    <DropdownIcon style={{marginRight: 8}}
+                                  color={editGrocery.category == GroceryCategory.None ? "#7b7b7b" : "#fd1775"}/>
                 )}
                 renderItem={(item) => {
                     return (

components/pages/grocery/GroceryList.tsx

@@ -2,13 +2,9 @@ import { FlatList, StyleSheet } from "react-native";
 import React, {useEffect, useState} from "react";
 import {Text, TouchableOpacity, View} from "react-native-ui-lib";
 import GroceryItem from "./GroceryItem";
-import {
+import {GroceryCategory, GroceryFrequency, useGroceryContext,} from "@/contexts/GroceryContext";
-  GroceryCategory,
-  GroceryFrequency,
-  useGroceryContext,
-} from "@/contexts/GroceryContext";
 import HeaderTemplate from "@/components/shared/HeaderTemplate";
-import { AntDesign, MaterialIcons } from "@expo/vector-icons";
+import {AntDesign} from "@expo/vector-icons";
 import EditGroceryItem from "./EditGroceryItem";
 import {ProfileType, useAuthContext} from "@/contexts/AuthContext";
 import {IGrocery} from "@/hooks/firebase/types/groceryData";
@@ -24,10 +20,10 @@ const GroceryList = () => {
     } = useGroceryContext();
     const {profileData} = useAuthContext();
     const [approvedGroceries, setapprovedGroceries] = useState<IGrocery[]>(
-    groceries?.filter((item) => item.approved === true)
+        groceries?.filter((item) => item.approved)
     );
     const [pendingGroceries, setPendingGroceries] = useState<IGrocery[]>(
-    groceries?.filter((item) => item.approved !== true)
+        groceries?.filter((item) => !item.approved)
     );
     const [category, setCategory] = useState<GroceryCategory>(
         GroceryCategory.None
@@ -73,12 +69,8 @@ const GroceryList = () => {
     }, [submit]);
 
     useEffect(() => {
-    /**/
+        setapprovedGroceries(groceries?.filter((item) => item.approved));
-  }, [category]);
+        setPendingGroceries(groceries?.filter((item) => !item.approved));
-
-  useEffect(() => {
-    setapprovedGroceries(groceries?.filter((item) => item.approved === true));
-    setPendingGroceries(groceries?.filter((item) => item.approved !== true));
     }, [groceries]);
 
     return (

components/pages/grocery/GroceryWrapper.tsx

@@ -1,4 +1,4 @@
-import { Text, ScrollView } from "react-native";
+import {ScrollView} from "react-native";
 import {View} from "react-native-ui-lib";
 import React, {useEffect, useRef} from "react";
 import AddGroceryItem from "./AddGroceryItem";
@@ -22,7 +22,7 @@ const GroceryWrapper = () => {
         <View height={"100%"} paddingT-15 paddingH-15>
             <View height={"100%"}>
                 <ScrollView
-          ref={scrollViewRef} // Assign the ref to the ScrollView
+                    ref={scrollViewRef}
                     automaticallyAdjustKeyboardInsets={true}
                 >
                     <View marginB-70>

components/pages/todos/AddChoreDialog.tsx

@@ -1,23 +1,27 @@
-import { View, Text, Button, Switch, PickerModes } from "react-native-ui-lib";
+import {
-import React, { useRef, useState } from "react";
+    Button,
+    ButtonSize,
+    DateTimePicker,
+    Dialog,
+    Picker,
+    PickerModes,
+    Switch,
+    Text,
+    TextField,
+    TextFieldRef,
+    View
+} from "react-native-ui-lib";
+import React, {useEffect, useRef, useState} from "react";
 import PointsSlider from "@/components/shared/PointsSlider";
 import {repeatOptions, useToDosContext} from "@/contexts/ToDosContext";
-import { Feather, AntDesign, Ionicons } from "@expo/vector-icons";
+import {Ionicons} from "@expo/vector-icons";
-import {
-  Dialog,
-  TextField,
-  DateTimePicker,
-  Picker,
-  ButtonSize,
-} from "react-native-ui-lib";
 import {PanningDirectionsEnum} from "react-native-ui-lib/src/incubator/panView";
-import { Dimensions, StyleSheet } from "react-native";
+import {Dimensions, KeyboardAvoidingView, StyleSheet} from "react-native";
 import DropModalIcon from "@/assets/svgs/DropModalIcon";
 import {IToDo} from "@/hooks/firebase/types/todoData";
 import AssigneesDisplay from "@/components/shared/AssigneesDisplay";
 import {useGetFamilyMembers} from "@/hooks/firebase/useGetFamilyMembers";
 import CalendarIcon from "@/assets/svgs/CalendarIcon";
-import ClockIcon from "@/assets/svgs/ClockIcon";
 import ClockOIcon from "@/assets/svgs/ClockOIcon";
 import ProfileIcon from "@/assets/svgs/ProfileIcon";
 import RepeatFreq from "./RepeatFreq";
@@ -47,9 +51,11 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
     const [selectedAssignees, setSelectedAssignees] = useState<string[]>(
         addChoreDialogProps?.selectedTodo?.assignees ?? []
     );
-  const { width, height } = Dimensions.get("screen");
+    const {width} = Dimensions.get("screen");
     const [points, setPoints] = useState<number>(todo.points);
 
+    const titleRef = useRef<TextFieldRef>(null)
+
     const {data: members} = useGetFamilyMembers();
 
     const handleClose = () => {
@@ -87,6 +93,12 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
         }
     }
 
+    useEffect(() => {
+        setTimeout(() => {
+            titleRef?.current?.focus()
+        }, 500)
+    }, []);
+
     return (
         <Dialog
             bottom={true}
@@ -148,9 +160,9 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
                     }}
                 />
             </View>
+            <KeyboardAvoidingView>
                 <TextField
                     placeholder="Add a To Do"
-        autoFocus
                     value={todo?.title}
                     onChangeText={(text) => {
                         setTodo((oldValue: IToDo) => ({...oldValue, title: text}));
@@ -159,6 +171,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
                     text60R
                     marginT-15
                     marginL-30
+                    ref={titleRef}
                 />
                 <View style={styles.divider} marginT-8/>
                 <View marginL-30 centerV>
@@ -220,7 +233,8 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
                             ))}
                         </Picker>
                     </View>
-        {todo.repeatType == "Every week" && <RepeatFreq handleRepeatDaysChange={handleRepeatDaysChange} repeatDays={todo.repeatDays ?? []}/>}
+                    {todo.repeatType == "Every week" && <RepeatFreq handleRepeatDaysChange={handleRepeatDaysChange}
+                                                                    repeatDays={todo.repeatDays ?? []}/>}
                 </View>
                 <View style={styles.divider}/>
 
@@ -299,6 +313,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
                     setPoints={setPoints}
                     handleChange={handleChange}
                 />
+            </KeyboardAvoidingView>
         </Dialog>
     );
 };