diff --git a/.idea/git_toolbox_blame.xml b/.idea/git_toolbox_blame.xml
new file mode 100644
index 0000000..7dc1249
--- /dev/null
+++ b/.idea/git_toolbox_blame.xml
@@ -0,0 +1,6 @@
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
new file mode 100644
index 0000000..55001da
--- /dev/null
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/.idea/jsLinters/eslint.xml b/.idea/jsLinters/eslint.xml
new file mode 100644
index 0000000..541945b
--- /dev/null
+++ b/.idea/jsLinters/eslint.xml
@@ -0,0 +1,6 @@
+
+
+
+
+
+
\ No newline at end of file
diff --git a/app.json b/app.json
index 928f636..476fa76 100644
--- a/app.json
+++ b/app.json
@@ -17,7 +17,10 @@
"bundleIdentifier": "com.cally.app",
"googleServicesFile": "./ios/GoogleService-Info.plist",
"buildNumber": "74",
- "usesAppleSignIn": true
+ "usesAppleSignIn": true,
+ "infoPlist": {
+ "ITSAppUsesNonExemptEncryption": false
+ }
},
"android": {
"adaptiveIcon": {
diff --git a/app/(auth)/_layout.tsx b/app/(auth)/_layout.tsx
index 394628a..7e31eff 100644
--- a/app/(auth)/_layout.tsx
+++ b/app/(auth)/_layout.tsx
@@ -1,15 +1,9 @@
-import React, { useEffect } from "react";
-import { Drawer } from "expo-router/drawer";
-import { useSignOut } from "@/hooks/firebase/useSignOut";
-import { DrawerContentScrollView } from "@react-navigation/drawer";
-import {
- Button,
- ButtonSize,
- Text,
- TouchableOpacity,
- View,
-} from "react-native-ui-lib";
-import { ImageBackground, StyleSheet } from "react-native";
+import React, {useMemo} from "react";
+import {Drawer} from "expo-router/drawer";
+import {useSignOut} from "@/hooks/firebase/useSignOut";
+import {DrawerContentScrollView, DrawerNavigationOptions, DrawerNavigationProp} from "@react-navigation/drawer";
+import {Button, ButtonSize, Text, TouchableOpacity, View,} from "react-native-ui-lib";
+import {ImageBackground, StyleSheet} from "react-native";
import DrawerButton from "@/components/shared/DrawerButton";
import NavGroceryIcon from "@/assets/svgs/NavGroceryIcon";
import NavToDosIcon from "@/assets/svgs/NavToDosIcon";
@@ -17,127 +11,169 @@ import NavBrainDumpIcon from "@/assets/svgs/NavBrainDumpIcon";
import NavCalendarIcon from "@/assets/svgs/NavCalendarIcon";
import NavSettingsIcon from "@/assets/svgs/NavSettingsIcon";
import ViewSwitch from "@/components/pages/(tablet_pages)/ViewSwitch";
-import { useSetAtom } from "jotai";
+import {useSetAtom} from "jotai";
import {
- isFamilyViewAtom,
- settingsPageIndex,
- toDosPageIndex,
- userSettingsView,
+ isFamilyViewAtom,
+ settingsPageIndex,
+ toDosPageIndex,
+ userSettingsView,
} from "@/components/pages/calendar/atoms";
import Ionicons from "@expo/vector-icons/Ionicons";
import * as Device from "expo-device";
-import { DeviceType } from "expo-device";
+import {DeviceType} from "expo-device";
import FeedbackNavIcon from "@/assets/svgs/FeedbackNavIcon";
import DrawerIcon from "@/assets/svgs/DrawerIcon";
+import {RouteProp} from "@react-navigation/core";
+type DrawerParamList = {
+ index: undefined;
+ calendar: undefined;
+ todos: undefined;
+};
+
+type NavigationProp = DrawerNavigationProp;
+
+interface ViewSwitchProps {
+ navigation: NavigationProp;
+}
+
+interface HeaderRightProps {
+ routeName: keyof DrawerParamList;
+ navigation: NavigationProp;
+}
+
+const MemoizedViewSwitch = React.memo(({navigation}) => (
+
+
+
+));
+
+const HeaderRight = React.memo(({routeName, navigation}) => {
+ const showViewSwitch = ["calendar", "todos", "index"].includes(routeName);
+
+ if (Device.deviceType !== DeviceType.TABLET || !showViewSwitch) {
+ return null;
+ }
+
+ return ;
+});
export default function TabLayout() {
- const { mutateAsync: signOut } = useSignOut();
- const setIsFamilyView = useSetAtom(isFamilyViewAtom);
- const setPageIndex = useSetAtom(settingsPageIndex);
- const setUserView = useSetAtom(userSettingsView);
- const setToDosIndex = useSetAtom(toDosPageIndex);
+ const {mutateAsync: signOut} = useSignOut();
+ const setIsFamilyView = useSetAtom(isFamilyViewAtom);
+ const setPageIndex = useSetAtom(settingsPageIndex);
+ const setUserView = useSetAtom(userSettingsView);
+ const setToDosIndex = useSetAtom(toDosPageIndex);
- return (
- ({
- headerShown: true,
- headerTitleAlign:
- Device.deviceType === DeviceType.TABLET ? "left" : "center",
- headerTitleStyle: {
- fontFamily: "Manrope_600SemiBold",
- fontSize: Device.deviceType === DeviceType.TABLET ? 22 : 17,
- },
- headerLeft: (props) => (
-
-
-
- ),
- headerRight: () => {
- // Only show ViewSwitch on calendar and todos pages
- const showViewSwitch = ["calendar", "todos", "index"].includes(
- route.name
- );
- return Device.deviceType === DeviceType.TABLET && showViewSwitch ? (
-
-
-
- ) : null;
- },
- drawerStyle: {
- width: Device.deviceType === DeviceType.TABLET ? "30%" : "90%",
- backgroundColor: "#f9f8f7",
- height: "100%",
- },
- })}
- drawerContent={(props) => {
- return (
-
-
-
- Welcome to Cally
-
-
-
- {
- props.navigation.navigate("calendar");
- setPageIndex(0);
- setToDosIndex(0);
- setUserView(true);
- setIsFamilyView(false);
- }}
- icon={}
- />
- {
- props.navigation.navigate("grocery");
- setPageIndex(0);
- setToDosIndex(0);
- setUserView(true);
- setIsFamilyView(false);
- }}
- icon={}
- />
- {
- props.navigation.navigate("feedback");
- setPageIndex(0);
- setToDosIndex(0);
- setUserView(true);
- setIsFamilyView(false);
- }}
- icon={}
- />
-
-
- {/*
+ ({
+ navigation,
+ route,
+ }: {
+ navigation: DrawerNavigationProp;
+ route: RouteProp;
+ }): DrawerNavigationOptions => ({
+ headerShown: true,
+ headerTitleAlign: Device.deviceType === DeviceType.TABLET ? "left" : "center",
+ headerTitleStyle: {
+ fontFamily: "Manrope_600SemiBold",
+ fontSize: Device.deviceType === DeviceType.TABLET ? 22 : 17,
+ },
+ headerLeft: () => (
+
+
+
+ ),
+ headerRight: () => {
+ const showViewSwitch = ["calendar", "todos", "index"].includes(route.name);
+
+ if (Device.deviceType !== DeviceType.TABLET || !showViewSwitch) {
+ return null;
+ }
+
+ return ;
+ },
+ drawerStyle: {
+ width: Device.deviceType === DeviceType.TABLET ? "30%" : "90%",
+ backgroundColor: "#f9f8f7",
+ height: "100%",
+ },
+ }),
+ []
+ );
+
+ return (
+ {
+ return (
+
+
+
+ Welcome to Cally
+
+
+
+ {
+ props.navigation.navigate("calendar");
+ setPageIndex(0);
+ setToDosIndex(0);
+ setUserView(true);
+ setIsFamilyView(false);
+ }}
+ icon={}
+ />
+ {
+ props.navigation.navigate("grocery");
+ setPageIndex(0);
+ setToDosIndex(0);
+ setUserView(true);
+ setIsFamilyView(false);
+ }}
+ icon={}
+ />
+ {
+ props.navigation.navigate("feedback");
+ setPageIndex(0);
+ setToDosIndex(0);
+ setUserView(true);
+ setIsFamilyView(false);
+ }}
+ icon={}
+ />
+
+
+ {/*
}
/>*/}
- {
- props.navigation.navigate("todos");
- setPageIndex(0);
- setToDosIndex(0);
- setUserView(true);
- setIsFamilyView(false);
- }}
- icon={}
- />
- {
- props.navigation.navigate("brain_dump");
- setPageIndex(0);
- setToDosIndex(0);
- setUserView(true);
- setIsFamilyView(false);
- }}
- icon={}
- />
- {
- props.navigation.navigate("notifications");
- setPageIndex(0);
- setToDosIndex(0);
- setUserView(true);
- setIsFamilyView(false);
- }}
- icon={
-
- }
- />
-
-
-
+
+
+ );
+ }}
+ >
+
-
- );
- }}
- >
-
-
-
-
-
-
-
-
-
-
- );
+
+
+
+
+
+
+
+
+
+ );
}
const styles = StyleSheet.create({
- signOut: { fontFamily: "Poppins_500Medium", fontSize: 15 },
- label: { fontFamily: "Poppins_400Medium", fontSize: 15 },
- title: {
- fontSize: 26.13,
- fontFamily: "Manrope_600SemiBold",
- color: "#262627",
- },
+ signOut: {fontFamily: "Poppins_500Medium", fontSize: 15},
+ label: {fontFamily: "Poppins_400Medium", fontSize: 15},
+ title: {
+ fontSize: 26.13,
+ fontFamily: "Manrope_600SemiBold",
+ color: "#262627",
+ },
});
diff --git a/app/(auth)/calendar/index.tsx b/app/(auth)/calendar/index.tsx
index 5a8d5c4..4ea0616 100644
--- a/app/(auth)/calendar/index.tsx
+++ b/app/(auth)/calendar/index.tsx
@@ -1,105 +1,54 @@
-import React, { useState } from "react";
-import { ScrollView, RefreshControl, View } from "react-native";
-import { useAtom } from "jotai";
+import React from "react";
+import {RefreshControl, ScrollView, View} from "react-native";
import CalendarPage from "@/components/pages/calendar/CalendarPage";
-import { refreshTriggerAtom } from "@/components/pages/calendar/atoms";
-import { colorMap } from "@/constants/colorMap";
+import {colorMap} from "@/constants/colorMap";
import TabletCalendarPage from "@/components/pages/(tablet_pages)/calendar/TabletCalendarPage";
-import { DeviceType } from "expo-device";
import * as Device from "expo-device";
-import { useCalSync } from "@/hooks/useCalSync";
-import Toast from "react-native-toast-message";
+import {DeviceType} from "expo-device";
+import {useCalSync} from "@/hooks/useCalSync";
export default function Screen() {
- const [refreshing, setRefreshing] = useState(false);
- const [shouldRefresh, setShouldRefresh] = useAtom(refreshTriggerAtom);
+ const isTablet = Device.deviceType === DeviceType.TABLET;
+ const {
+ resyncAllCalendars,
+ isSyncing,
+ } = useCalSync();
- const isTablet: boolean = Device.deviceType === DeviceType.TABLET;
+ const onRefresh = React.useCallback(async () => {
+ try {
+ await resyncAllCalendars();
+ } catch (error) {
+ console.error("Refresh failed:", error);
+ }
+ }, [resyncAllCalendars]);
- const {
- isConnectedToGoogle,
- isConnectedToMicrosoft,
- isConnectedToApple,
- resyncAllCalendars,
- isSyncing,
- } = useCalSync();
-
- const onRefresh = React.useCallback(async () => {
- setRefreshing(true);
-
- const minimumDelay = new Promise((resolve) => setTimeout(resolve, 1000));
-
- try {
- if (isConnectedToGoogle || isConnectedToMicrosoft || isConnectedToApple) {
- await Promise.all([resyncAllCalendars(), minimumDelay]);
- } else {
- await minimumDelay;
- }
- } catch (error) {
- console.error("Refresh failed:", error);
- } finally {
- setRefreshing(false);
- setShouldRefresh((prev) => !prev);
- }
- }, [
- resyncAllCalendars,
- isConnectedToGoogle,
- isConnectedToMicrosoft,
- isConnectedToApple,
- ]);
-
- return (
-
-
- {Device.deviceType === DeviceType.TABLET ? (
-
- ) : (
-
- )}
-
-
-
- }
- bounces={true}
- showsVerticalScrollIndicator={false}
- pointerEvents={refreshing || isSyncing ? "auto" : "none"}
- />
-
- );
-}
+ />
+ );
+
+ return (
+
+
+ {isTablet ? : }
+
+
+ );
+}
\ No newline at end of file
diff --git a/app/(auth)/todos/index.tsx b/app/(auth)/todos/index.tsx
index 33103a5..cda7d94 100644
--- a/app/(auth)/todos/index.tsx
+++ b/app/(auth)/todos/index.tsx
@@ -1,25 +1,16 @@
import TabletChoresPage from "@/components/pages/(tablet_pages)/chores/TabletChoresPage";
-import AddChore from "@/components/pages/todos/AddChore";
-import ProgressCard from "@/components/pages/todos/ProgressCard";
-import ToDoItem from "@/components/pages/todos/ToDoItem";
-import ToDosList from "@/components/pages/todos/ToDosList";
import ToDosPage from "@/components/pages/todos/ToDosPage";
-import HeaderTemplate from "@/components/shared/HeaderTemplate";
-import { useAuthContext } from "@/contexts/AuthContext";
-import { ToDosContextProvider, useToDosContext } from "@/contexts/ToDosContext";
-import { AntDesign } from "@expo/vector-icons";
-import { ScrollView } from "react-native-gesture-handler";
-import { Button, ButtonSize, View, Text, Constants } from "react-native-ui-lib";
+import {ToDosContextProvider} from "@/contexts/ToDosContext";
import * as Device from "expo-device";
export default function Screen() {
- return (
-
- {Device.deviceType === Device.DeviceType.TABLET ? (
-
- ) : (
-
- )}
-
- );
+ return (
+
+ {Device.deviceType === Device.DeviceType.TABLET ? (
+
+ ) : (
+
+ )}
+
+ );
}
diff --git a/components/pages/(tablet_pages)/ViewSwitch.tsx b/components/pages/(tablet_pages)/ViewSwitch.tsx
index b450364..0aef1e2 100644
--- a/components/pages/(tablet_pages)/ViewSwitch.tsx
+++ b/components/pages/(tablet_pages)/ViewSwitch.tsx
@@ -1,89 +1,68 @@
import { SegmentedControl, View } from "react-native-ui-lib";
-import React, { memo, useCallback, useEffect, useRef, useState } from "react";
+import React, { memo, useCallback } from "react";
import { StyleSheet } from "react-native";
import { NavigationProp, useNavigationState } from "@react-navigation/native";
-const ViewSwitch = memo(function ViewSwitch({
- navigation,
-}: {
- navigation: any;
-}) {
- const isNavigating = useRef(false);
- const navigationState = useNavigationState((state) => state);
- const [selectedIndex, setSelectedIndex] = useState(
- navigationState.index === 6 ? 1 : 0
- );
+interface ViewSwitchProps {
+ navigation: NavigationProp;
+}
- // Sync the selected index with navigation state
- useEffect(() => {
- const newIndex = navigationState.index === 6 ? 1 : 0;
- if (selectedIndex !== newIndex) {
- setSelectedIndex(newIndex);
- }
- isNavigating.current = false;
- }, [navigationState.index]);
+const ViewSwitch = memo(function ViewSwitch({ navigation }: ViewSwitchProps) {
+ const currentIndex = useNavigationState((state) => state.index === 6 ? 1 : 0);
- const handleSegmentChange = useCallback(
- (index: number) => {
- if (isNavigating.current) return;
- if (index === selectedIndex) return;
+ const handleSegmentChange = useCallback(
+ (index: number) => {
+ if (index === currentIndex) return;
+ navigation.navigate(index === 0 ? "calendar" : "todos");
+ },
+ [navigation, currentIndex]
+ );
- isNavigating.current = true;
- setSelectedIndex(index);
-
- // Delay navigation slightly to allow the segment control to update
- requestAnimationFrame(() => {
- navigation.navigate(index === 0 ? "calendar" : "todos");
- });
- console.log(selectedIndex)
- },
- [navigation, selectedIndex]
- );
-
- return (
-
-
-
- );
+ return (
+
+
+
+ );
});
-export default ViewSwitch;
const styles = StyleSheet.create({
- container: {
- borderRadius: 30,
- backgroundColor: "#ebebeb",
- shadowColor: "#000",
- shadowOffset: { width: 0, height: 0 },
- shadowOpacity: 0,
- shadowRadius: 0,
- elevation: 0,
- },
- segmentContainer: {
- height: 44,
- width: 220,
- },
- segment: {
- borderRadius: 50,
- borderWidth: 0,
- height: 44,
- },
- labelStyle: {
- fontSize: 16,
- fontFamily: "Manrope_600SemiBold",
- },
+ container: {
+ borderRadius: 30,
+ backgroundColor: "#ebebeb",
+ shadowColor: "#000",
+ shadowOffset: { width: 0, height: 0 },
+ shadowOpacity: 0,
+ shadowRadius: 0,
+ elevation: 0,
+ },
+ segmentContainer: {
+ height: 44,
+ width: 220,
+ },
+ segment: {
+ borderRadius: 50,
+ borderWidth: 0,
+ height: 44,
+ },
+ labelStyle: {
+ fontSize: 16,
+ fontFamily: "Manrope_600SemiBold",
+ },
});
+
+export default ViewSwitch;
\ No newline at end of file
diff --git a/components/pages/(tablet_pages)/chores/TabletChoresPage.tsx b/components/pages/(tablet_pages)/chores/TabletChoresPage.tsx
index 56beca6..9e94188 100644
--- a/components/pages/(tablet_pages)/chores/TabletChoresPage.tsx
+++ b/components/pages/(tablet_pages)/chores/TabletChoresPage.tsx
@@ -1,92 +1,89 @@
-import React, { useEffect } from "react";
-import { View, Text } from "react-native-ui-lib";
+import React, {useEffect} from "react";
+import {Text, View} from "react-native-ui-lib";
import * as ScreenOrientation from "expo-screen-orientation";
import TabletContainer from "../tablet_components/TabletContainer";
-import ToDosPage from "../../todos/ToDosPage";
-import ToDosList from "../../todos/ToDosList";
import SingleUserChoreList from "./SingleUserChoreList";
-import { useGetFamilyMembers } from "@/hooks/firebase/useGetFamilyMembers";
-import { ImageBackground, StyleSheet } from "react-native";
-import { colorMap } from "@/constants/colorMap";
-import { ScrollView } from "react-native-gesture-handler";
+import {useGetFamilyMembers} from "@/hooks/firebase/useGetFamilyMembers";
+import {ImageBackground, StyleSheet} from "react-native";
+import {ScrollView} from "react-native-gesture-handler";
const TabletChoresPage = () => {
- const { data: users } = useGetFamilyMembers();
- // Function to lock the screen orientation to landscape
- const lockScreenOrientation = async () => {
- await ScreenOrientation.lockAsync(
- ScreenOrientation.OrientationLock.LANDSCAPE_RIGHT
- );
- };
-
- useEffect(() => {
- lockScreenOrientation(); // Lock orientation when the component mounts
-
- return () => {
- // Optional: Unlock to default when the component unmounts
- ScreenOrientation.unlockAsync();
+ const {data: users} = useGetFamilyMembers();
+ // Function to lock the screen orientation to landscape
+ const lockScreenOrientation = async () => {
+ await ScreenOrientation.lockAsync(
+ ScreenOrientation.OrientationLock.LANDSCAPE_RIGHT
+ );
};
- }, []);
- return (
-
-
-
- {users?.map((user, index) => (
-
-
- {user.pfp ? (
-
- ) : (
-
-
- {user.firstName.at(0)}
- {user.lastName.at(0)}
-
-
- )}
-
- {user.firstName}
-
-
- ({user.userType})
-
-
-
-
- ))}
-
-
-
- );
+ useEffect(() => {
+ lockScreenOrientation(); // Lock orientation when the component mounts
+
+ return () => {
+ // Optional: Unlock to default when the component unmounts
+ ScreenOrientation.unlockAsync();
+ };
+ }, []);
+
+ return (
+
+
+
+ {users?.map((user, index) => (
+
+
+ {user.pfp ? (
+
+ ) : (
+
+
+ {user.firstName.at(0)}
+ {user.lastName.at(0)}
+
+
+ )}
+
+ {user.firstName}
+
+
+ ({user.userType})
+
+
+
+
+ ))}
+
+
+
+ );
};
const styles = StyleSheet.create({
- pfp: {
- width: 46.74,
- aspectRatio: 1,
- borderRadius: 13.33,
- },
- name: {
- fontFamily: "Manrope_600SemiBold",
- fontSize: 22.43,
- color: "#2c2c2c",
- },
+ pfp: {
+ width: 46.74,
+ aspectRatio: 1,
+ borderRadius: 13.33,
+ },
+ name: {
+ fontFamily: "Manrope_600SemiBold",
+ fontSize: 22.43,
+ color: "#2c2c2c",
+ },
});
export default TabletChoresPage;
diff --git a/components/pages/brain_dump/DumpList.tsx b/components/pages/brain_dump/DumpList.tsx
index d8b7611..6f2f435 100644
--- a/components/pages/brain_dump/DumpList.tsx
+++ b/components/pages/brain_dump/DumpList.tsx
@@ -3,7 +3,6 @@ import React from "react";
import { useBrainDumpContext } from "@/contexts/DumpContext";
import { FlatList } from "react-native";
import BrainDumpItem from "./DumpItem";
-import LinearGradient from "react-native-linear-gradient";
const DumpList = (props: { searchText: string }) => {
const { brainDumps } = useBrainDumpContext();
diff --git a/components/pages/calendar/CalendarHeader.tsx b/components/pages/calendar/CalendarHeader.tsx
index c77de27..5fc8b0b 100644
--- a/components/pages/calendar/CalendarHeader.tsx
+++ b/components/pages/calendar/CalendarHeader.tsx
@@ -1,131 +1,121 @@
-import React, { memo } from "react";
-import {
- 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";
-import { useAtom } from "jotai";
-import { modeAtom, selectedDateAtom } from "@/components/pages/calendar/atoms";
-import { format, isSameDay } from "date-fns";
-import { useAuthContext } from "@/contexts/AuthContext";
-import {useIsMutating} from "react-query";
+import React, {memo} from "react";
+import {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";
+import {useAtom} from "jotai";
+import {modeAtom, selectedDateAtom} from "@/components/pages/calendar/atoms";
+import {format, isSameDay} from "date-fns";
export const CalendarHeader = memo(() => {
- const [selectedDate, setSelectedDate] = useAtom(selectedDateAtom);
- const [mode, setMode] = useAtom(modeAtom);
- const { profileData } = useAuthContext();
+ const [selectedDate, setSelectedDate] = useAtom(selectedDateAtom);
+ const [mode, setMode] = useAtom(modeAtom);
- const handleSegmentChange = (index: number) => {
- const selectedMode = modeMap.get(index);
- if (selectedMode) {
- setTimeout(() => {
- setMode(selectedMode as "day" | "week" | "month");
- }, 150);
- }
- };
+ const handleSegmentChange = (index: number) => {
+ const selectedMode = modeMap.get(index);
+ if (selectedMode) {
+ setTimeout(() => {
+ setMode(selectedMode as "day" | "week" | "month");
+ }, 150);
+ }
+ };
- const handleMonthChange = (month: string) => {
- const currentDay = selectedDate.getDate();
- const currentYear = selectedDate.getFullYear();
- const newMonthIndex = months.indexOf(month);
+ const handleMonthChange = (month: string) => {
+ const currentDay = selectedDate.getDate();
+ const currentYear = selectedDate.getFullYear();
+ const newMonthIndex = months.indexOf(month);
- const updatedDate = new Date(currentYear, newMonthIndex, currentDay);
- setSelectedDate(updatedDate);
- };
+ const updatedDate = new Date(currentYear, newMonthIndex, currentDay);
+ setSelectedDate(updatedDate);
+ };
- const isSelectedDateToday = isSameDay(selectedDate, new Date());
+ const isSelectedDateToday = isSameDay(selectedDate, new Date());
- return (
-
-
-
- {selectedDate.getFullYear()}
-
- handleMonthChange(itemValue as string)}
- trailingAccessory={}
- topBarProps={{
- title: selectedDate.getFullYear().toString(),
- titleStyle: { fontFamily: "Manrope_500Medium", fontSize: 17 },
- }}
- >
- {months.map((month) => (
-
- ))}
-
-
-
-
- {!isSelectedDateToday && (
- {
- setSelectedDate(new Date());
- }}
- />
- )}
+ >
+
+
+ {selectedDate.getFullYear()}
+
+ handleMonthChange(itemValue as string)}
+ trailingAccessory={}
+ topBarProps={{
+ title: selectedDate.getFullYear().toString(),
+ titleStyle: {fontFamily: "Manrope_500Medium", fontSize: 17},
+ }}
+ >
+ {months.map((month) => (
+
+ ))}
+
+
-
-
+
+ {!isSelectedDateToday && (
+ {
+ setSelectedDate(new Date());
+ }}
+ />
+ )}
+
+
+
+
+
-
-
- );
+ );
});
const styles = StyleSheet.create({
- segmentslblStyle: {
- fontSize: 12,
- fontFamily: "Manrope_600SemiBold",
- },
+ segmentslblStyle: {
+ fontSize: 12,
+ fontFamily: "Manrope_600SemiBold",
+ },
});
diff --git a/components/pages/calendar/CalendarPage.tsx b/components/pages/calendar/CalendarPage.tsx
index 005dbbe..c09e337 100644
--- a/components/pages/calendar/CalendarPage.tsx
+++ b/components/pages/calendar/CalendarPage.tsx
@@ -1,6 +1,5 @@
import React from "react";
import { View } from "react-native-ui-lib";
-import HeaderTemplate from "@/components/shared/HeaderTemplate";
import { InnerCalendar } from "@/components/pages/calendar/InnerCalendar";
export default function CalendarPage() {
diff --git a/components/pages/calendar/EventCalendar.tsx b/components/pages/calendar/EventCalendar.tsx
index a2bb06f..e917742 100644
--- a/components/pages/calendar/EventCalendar.tsx
+++ b/components/pages/calendar/EventCalendar.tsx
@@ -1,61 +1,60 @@
-import React, { useCallback, useEffect, useMemo, useState } from "react";
-import { Calendar } from "react-native-big-calendar";
-import { ActivityIndicator, ScrollView, StyleSheet, View, ViewStyle } from "react-native";
-import { useGetEvents } from "@/hooks/firebase/useGetEvents";
-import { useAtom, useAtomValue, useSetAtom } from "jotai";
+import React, {useCallback, useEffect, useMemo, useState} from "react";
+import {Calendar} from "react-native-big-calendar";
+import {ActivityIndicator, StyleSheet, View, ViewStyle} from "react-native";
+import {useGetEvents} from "@/hooks/firebase/useGetEvents";
+import {useAtom, useSetAtom} from "jotai";
import {
editVisibleAtom,
eventForEditAtom,
- isAllDayAtom, isFamilyViewAtom,
+ isAllDayAtom,
+ isFamilyViewAtom,
modeAtom,
- refreshTriggerAtom,
selectedDateAtom,
selectedNewEventDateAtom,
} from "@/components/pages/calendar/atoms";
-import { useAuthContext } from "@/contexts/AuthContext";
-import { CalendarEvent } from "@/components/pages/calendar/interfaces";
-import { Text } from "react-native-ui-lib";
-import { addDays, compareAsc, isWithinInterval, subDays } from "date-fns";
+import {useAuthContext} from "@/contexts/AuthContext";
+import {CalendarEvent} from "@/components/pages/calendar/interfaces";
+import {Text} from "react-native-ui-lib";
+import {addDays, compareAsc, isWithinInterval, subDays} from "date-fns";
import {useCalSync} from "@/hooks/useCalSync";
import {useSyncEvents} from "@/hooks/useSyncOnScroll";
import {colorMap} from "@/constants/colorMap";
interface EventCalendarProps {
- calendarHeight: number;
- // WAS USED FOR SCROLLABLE CALENDARS, PERFORMANCE WAS NOT OPTIMAL
- calendarWidth: number;
+ calendarHeight: number;
+ // WAS USED FOR SCROLLABLE CALENDARS, PERFORMANCE WAS NOT OPTIMAL
+ calendarWidth: number;
}
const getTotalMinutes = () => {
- const date = new Date();
- return Math.abs(date.getUTCHours() * 60 + date.getUTCMinutes() - 200);
+ const date = new Date();
+ return Math.abs(date.getUTCHours() * 60 + date.getUTCMinutes() - 200);
};
export const EventCalendar: React.FC = React.memo(
- ({ calendarHeight }) => {
- const { data: events, isLoading, refetch } = useGetEvents();
- const { profileData, user } = useAuthContext();
- const [selectedDate, setSelectedDate] = useAtom(selectedDateAtom);
- const [mode, setMode] = useAtom(modeAtom);
- const [isFamilyView] = useAtom(isFamilyViewAtom);
+ ({calendarHeight}) => {
+ const {data: events, isLoading, refetch} = useGetEvents();
+ const {profileData, user} = useAuthContext();
+ const [selectedDate, setSelectedDate] = useAtom(selectedDateAtom);
+ const [mode, setMode] = useAtom(modeAtom);
+ const [isFamilyView] = useAtom(isFamilyViewAtom);
- const setEditVisible = useSetAtom(editVisibleAtom);
- const [isAllDay, setIsAllDay] = useAtom(isAllDayAtom);
- const setEventForEdit = useSetAtom(eventForEditAtom);
- const shouldRefresh = useAtomValue(refreshTriggerAtom);
- const setSelectedNewEndDate = useSetAtom(selectedNewEventDateAtom);
+ const setEditVisible = useSetAtom(editVisibleAtom);
+ const [isAllDay, setIsAllDay] = useAtom(isAllDayAtom);
+ const setEventForEdit = useSetAtom(eventForEditAtom);
+ const setSelectedNewEndDate = useSetAtom(selectedNewEventDateAtom);
- const {isSyncing} = useSyncEvents()
- const [offsetMinutes, setOffsetMinutes] = useState(getTotalMinutes());
- useCalSync()
+ const {isSyncing} = useSyncEvents()
+ const [offsetMinutes, setOffsetMinutes] = useState(getTotalMinutes());
+ useCalSync()
- const todaysDate = new Date();
+ const todaysDate = new Date();
- const handlePressEvent = useCallback(
- (event: CalendarEvent) => {
- if (mode === "day" || mode === "week") {
- setEditVisible(true);
- // console.log({event});
+ const handlePressEvent = useCallback(
+ (event: CalendarEvent) => {
+ if (mode === "day" || mode === "week") {
+ setEditVisible(true);
+ // console.log({event});
setEventForEdit(event);
} else {
setMode("day");
@@ -65,209 +64,195 @@ export const EventCalendar: React.FC = React.memo(
[setEditVisible, setEventForEdit, mode]
);
- const handlePressCell = useCallback(
- (date: Date) => {
- if (mode === "day" || mode === "week") {
- setSelectedNewEndDate(date);
- } else {
- setMode("day");
- setSelectedDate(date);
- }
- },
- [mode, setSelectedNewEndDate, setSelectedDate]
- );
+ const handlePressCell = useCallback(
+ (date: Date) => {
+ if (mode === "day" || mode === "week") {
+ setSelectedNewEndDate(date);
+ } else {
+ setMode("day");
+ setSelectedDate(date);
+ }
+ },
+ [mode, setSelectedNewEndDate, setSelectedDate]
+ );
- const handlePressDayHeader = useCallback(
- (date: Date) => {
- if (mode === "day") {
- setIsAllDay(true);
- setSelectedNewEndDate(date);
- setEditVisible(true);
- }
- if (mode === 'week')
- {
- setSelectedDate(date)
+ const handlePressDayHeader = useCallback(
+ (date: Date) => {
+ if (mode === "day") {
+ setIsAllDay(true);
+ setSelectedNewEndDate(date);
+ setEditVisible(true);
+ }
+ if (mode === 'week') {
+ setSelectedDate(date)
- setMode("day")
- }
- },
- [mode, setSelectedNewEndDate]
- );
+ setMode("day")
+ }
+ },
+ [mode, setSelectedNewEndDate]
+ );
- const handleSwipeEnd = useCallback(
- (date: Date) => {
- setSelectedDate(date);
- },
- [setSelectedDate]
- );
+ const handleSwipeEnd = useCallback(
+ (date: Date) => {
+ setSelectedDate(date);
+ },
+ [setSelectedDate]
+ );
- const memoizedEventCellStyle = useCallback(
- (event: CalendarEvent) => {
- let eventColor = event.eventColor;
- if (!isFamilyView && event.attendees?.includes(user?.uid)) {
- eventColor = profileData?.eventColor ?? colorMap.teal;
- }
+ const memoizedEventCellStyle = useCallback(
+ (event: CalendarEvent) => {
+ let eventColor = event.eventColor;
+ if (!isFamilyView && event.attendees?.includes(user?.uid)) {
+ eventColor = profileData?.eventColor ?? colorMap.teal;
+ }
- return { backgroundColor: eventColor , fontSize: 14}
- },
- []
- );
+ return {backgroundColor: eventColor, fontSize: 14}
+ },
+ []
+ );
- const memoizedWeekStartsOn = useMemo(
- () => (profileData?.firstDayOfWeek === "Mondays" ? 1 : 0),
- [profileData]
- );
+ const memoizedWeekStartsOn = useMemo(
+ () => (profileData?.firstDayOfWeek === "Mondays" ? 1 : 0),
+ [profileData]
+ );
- // console.log({memoizedWeekStartsOn, profileData: profileData?.firstDayOfWeek,
+ const isSameDate = useCallback((date1: Date, date2: Date) => {
+ return (
+ date1.getDate() === date2.getDate() &&
+ date1.getMonth() === date2.getMonth() &&
+ date1.getFullYear() === date2.getFullYear()
+ );
+ }, []);
- const isSameDate = useCallback((date1: Date, date2: Date) => {
- return (
- date1.getDate() === date2.getDate() &&
- date1.getMonth() === date2.getMonth() &&
- date1.getFullYear() === date2.getFullYear()
- );
- }, []);
+ const dayHeaderColor = useMemo(() => {
+ return isSameDate(todaysDate, selectedDate) ? "white" : "#4d4d4d";
+ }, [selectedDate, mode]);
- const dayHeaderColor = useMemo(() => {
- 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;
+ }, [selectedDate, mode]);
- const dateStyle = useMemo(() => {
- if (mode === "week") return undefined;
- return isSameDate(todaysDate, selectedDate) && mode === "day"
- ? styles.dayHeader
- : styles.otherDayHeader;
- }, [selectedDate, mode]);
+ const memoizedHeaderContentStyle = useMemo(() => {
+ if (mode === "day") {
+ return styles.dayModeHeader;
+ } else if (mode === "week") {
+ return styles.weekModeHeader;
+ } else if (mode === "month") {
+ return styles.monthModeHeader;
+ } else {
+ return {};
+ }
+ }, [mode]);
- const memoizedHeaderContentStyle = useMemo(() => {
- if (mode === "day") {
- return styles.dayModeHeader;
- } else if (mode === "week") {
- return styles.weekModeHeader;
- } else if (mode === "month") {
- return styles.monthModeHeader;
- } else {
- return {};
- }
- }, [mode]);
+ const {enrichedEvents, filteredEvents} = useMemo(() => {
+ const startTime = Date.now(); // Start timer
- const { enrichedEvents, filteredEvents } = useMemo(() => {
- const startTime = Date.now(); // Start timer
+ const startOffset = mode === "month" ? 40 : mode === "week" ? 10 : 1;
+ const endOffset = mode === "month" ? 40 : mode === "week" ? 10 : 1;
- const startOffset = mode === "month" ? 40 : mode === "week" ? 10 : 1;
- const endOffset = mode === "month" ? 40 : mode === "week" ? 10 : 1;
+ const filteredEvents =
+ events?.filter(
+ (event) =>
+ event.start &&
+ event.end &&
+ isWithinInterval(event.start, {
+ start: subDays(selectedDate, startOffset),
+ end: addDays(selectedDate, endOffset),
+ }) &&
+ isWithinInterval(event.end, {
+ start: subDays(selectedDate, startOffset),
+ end: addDays(selectedDate, endOffset),
+ })
+ ) ?? [];
- const filteredEvents =
- events?.filter(
- (event) =>
- event.start &&
- event.end &&
- isWithinInterval(event.start, {
- start: subDays(selectedDate, startOffset),
- end: addDays(selectedDate, endOffset),
- }) &&
- isWithinInterval(event.end, {
- start: subDays(selectedDate, startOffset),
- end: addDays(selectedDate, endOffset),
- })
- ) ?? [];
+ const enrichedEvents = filteredEvents.reduce((acc, event) => {
+ const dateKey = event.start.toISOString().split("T")[0];
+ acc[dateKey] = acc[dateKey] || [];
+ acc[dateKey].push({
+ ...event,
+ overlapPosition: false,
+ overlapCount: 0,
+ });
- const enrichedEvents = filteredEvents.reduce((acc, event) => {
- const dateKey = event.start.toISOString().split("T")[0];
- acc[dateKey] = acc[dateKey] || [];
- acc[dateKey].push({
- ...event,
- overlapPosition: false,
- overlapCount: 0,
- });
+ acc[dateKey].sort((a, b) => compareAsc(a.start, b.start));
- acc[dateKey].sort((a, b) => compareAsc(a.start, b.start));
+ return acc;
+ }, {} as Record);
- return acc;
- }, {} as Record);
+ const endTime = Date.now();
+ // console.log("memoizedEvents computation time:", endTime - startTime, "ms");
- const endTime = Date.now();
- // console.log("memoizedEvents computation time:", endTime - startTime, "ms");
+ return {enrichedEvents, filteredEvents};
+ }, [events, selectedDate, mode]);
- return { enrichedEvents, filteredEvents };
- }, [events, selectedDate, mode]);
+ const renderCustomDateForMonth = (date: Date) => {
+ const circleStyle = useMemo(
+ () => ({
+ width: 30,
+ height: 30,
+ justifyContent: "center",
+ alignItems: "center",
+ borderRadius: 15,
+ }),
+ []
+ );
- const renderCustomDateForMonth = (date: Date) => {
- const circleStyle = useMemo(
- () => ({
- width: 30,
- height: 30,
- justifyContent: "center",
- alignItems: "center",
- borderRadius: 15,
- }),
- []
- );
+ const defaultStyle = useMemo(
+ () => ({
+ ...circleStyle,
+ }),
+ [circleStyle]
+ );
- const defaultStyle = useMemo(
- () => ({
- ...circleStyle,
- }),
- [circleStyle]
- );
+ const currentDateStyle = useMemo(
+ () => ({
+ ...circleStyle,
+ backgroundColor: "#4184f2",
+ }),
+ [circleStyle]
+ );
- const currentDateStyle = useMemo(
- () => ({
- ...circleStyle,
- backgroundColor: "#4184f2",
- }),
- [circleStyle]
- );
+ const renderDate = useCallback(
+ (date: Date) => {
+ const isCurrentDate = isSameDate(todaysDate, date);
+ const appliedStyle = isCurrentDate ? currentDateStyle : defaultStyle;
- const renderDate = useCallback(
- (date: Date) => {
- const isCurrentDate = isSameDate(todaysDate, date);
- const appliedStyle = isCurrentDate ? currentDateStyle : defaultStyle;
+ return (
+
+
+
+ {date.getDate()}
+
+
+
+ );
+ },
+ [todaysDate, currentDateStyle, defaultStyle] // dependencies
+ );
- return (
-
-
-
- {date.getDate()}
-
-
-
- );
- },
- [todaysDate, currentDateStyle, defaultStyle] // dependencies
- );
+ return renderDate(date);
+ };
- return renderDate(date);
- };
+ useEffect(() => {
+ setOffsetMinutes(getTotalMinutes());
+ }, [events, mode]);
- useEffect(() => {
- setOffsetMinutes(getTotalMinutes());
- }, [events, mode]);
-
- useEffect(() => {
- refetch()
- .then(() => {
- console.log('✅ Events refreshed successfully');
- })
- .catch((error) => {
- console.error('❌ Events refresh failed:', error);
- });
- }, [shouldRefresh, refetch])
-
-
- if (isLoading) {
- return (
-
- {isSyncing && Syncing...}
+ if (isLoading) {
+ return (
+
+ {isSyncing && Syncing...}
);
}
- // console.log(enrichedEvents, filteredEvents)
+ // console.log(enrichedEvents, filteredEvents)
- return (
- <>
+ return (
+ <>
{isSyncing && (
{isSyncing && Syncing...}
@@ -317,14 +302,14 @@ export const EventCalendar: React.FC = React.memo(
dayHeaderHighlightColor={"white"}
showAdjacentMonths
headerContainerStyle={mode !== "month" ? {
- overflow:"hidden",
+ overflow: "hidden",
} : {}}
hourStyle={styles.hourStyle}
- onPressDateHeader={handlePressDayHeader}
+ onPressDateHeader={handlePressDayHeader}
ampm
// renderCustomDateForMonth={renderCustomDateForMonth}
/>
-
+
>
);
diff --git a/components/pages/feedback/AddFeedback.tsx b/components/pages/feedback/AddFeedback.tsx
index 9b2c816..6544e73 100644
--- a/components/pages/feedback/AddFeedback.tsx
+++ b/components/pages/feedback/AddFeedback.tsx
@@ -11,7 +11,6 @@ import { PanningDirectionsEnum } from "react-native-ui-lib/src/incubator/panView
import { Dimensions, Platform, StyleSheet } from "react-native";
import DropModalIcon from "@/assets/svgs/DropModalIcon";
-import { useBrainDumpContext } from "@/contexts/DumpContext";
import KeyboardManager from "react-native-keyboard-manager";
import { useFeedbackContext } from "@/contexts/FeedbackContext";
diff --git a/components/pages/feedback/EditFeedback.tsx b/components/pages/feedback/EditFeedback.tsx
index 385f659..005196c 100644
--- a/components/pages/feedback/EditFeedback.tsx
+++ b/components/pages/feedback/EditFeedback.tsx
@@ -14,9 +14,6 @@ import PenIcon from "@/assets/svgs/PenIcon";
import BinIcon from "@/assets/svgs/BinIcon";
import DropModalIcon from "@/assets/svgs/DropModalIcon";
import CloseXIcon from "@/assets/svgs/CloseXIcon";
-import NavCalendarIcon from "@/assets/svgs/NavCalendarIcon";
-import NavToDosIcon from "@/assets/svgs/NavToDosIcon";
-import RemindersIcon from "@/assets/svgs/RemindersIcon";
import MenuIcon from "@/assets/svgs/MenuIcon";
import { IFeedback, useFeedbackContext } from "@/contexts/FeedbackContext";
import FeedbackDialog from "./FeedbackDialog";
diff --git a/components/pages/grocery/AddGroceryItem.tsx b/components/pages/grocery/AddGroceryItem.tsx
index c177d2c..dcbba22 100644
--- a/components/pages/grocery/AddGroceryItem.tsx
+++ b/components/pages/grocery/AddGroceryItem.tsx
@@ -2,7 +2,6 @@ import {Dimensions, StyleSheet} from "react-native";
import React from "react";
import {Button, View,} from "react-native-ui-lib";
import {useGroceryContext} from "@/contexts/GroceryContext";
-import {FontAwesome6} from "@expo/vector-icons";
import PlusIcon from "@/assets/svgs/PlusIcon";
const { width } = Dimensions.get("screen");
diff --git a/components/pages/notifications/NotificationsPage.tsx b/components/pages/notifications/NotificationsPage.tsx
index ea0d43e..a17d779 100644
--- a/components/pages/notifications/NotificationsPage.tsx
+++ b/components/pages/notifications/NotificationsPage.tsx
@@ -1,14 +1,25 @@
import {FlatList, StyleSheet} from "react-native";
-import React from "react";
+import React, {useCallback} from "react";
import {Card, Text, View} from "react-native-ui-lib";
import HeaderTemplate from "@/components/shared/HeaderTemplate";
-import {useGetNotifications} from "@/hooks/firebase/useGetNotifications";
+import {Notification, useGetNotifications} from "@/hooks/firebase/useGetNotifications";
import {formatDistanceToNow} from "date-fns";
+import {useRouter} from "expo-router";
+import {useSetAtom} from "jotai";
+import {modeAtom, selectedDateAtom} from "@/components/pages/calendar/atoms";
const NotificationsPage = () => {
- const {data: notifications} = useGetNotifications()
-
- console.log(notifications?.[0])
+ const setSelectedDate = useSetAtom(selectedDateAtom);
+ const setMode = useSetAtom(modeAtom);
+ const {data: notifications} = useGetNotifications();
+ const {push} = useRouter();
+ const goToEventDay = useCallback((notification: Notification) => () => {
+ if (notification?.date) {
+ setSelectedDate(notification.date);
+ setMode("day")
+ }
+ push({pathname: "/calendar"});
+ }, [push, setSelectedDate]);
return (
@@ -18,32 +29,56 @@ const NotificationsPage = () => {
- See your notifications here.
-
- }
- />
+ >
+
+ See your notifications here.
+
+
-
- {item.content}
-
- {formatDistanceToNow(new Date(item.timestamp), {addSuffix: true})}
- {item.timestamp.toLocaleDateString()}
-
- }/>
-
+ (
+
+ {item.content}
+
+
+ {formatDistanceToNow(new Date(item.timestamp), {addSuffix: true})}
+
+
+ {item.timestamp.toLocaleDateString()}
+
+
+
+ )}
+ />
+
);
};
const styles = StyleSheet.create({
+ listContainer: {
+ paddingBottom: 10,
+ paddingHorizontal: 25,
+ },
+ card: {
+ width: '100%',
+ backgroundColor: 'white',
+ },
+ subtitle: {
+ fontFamily: "Manrope_400Regular",
+ fontSize: 14,
+ },
searchField: {
borderWidth: 0.7,
borderColor: "#9b9b9b",
@@ -54,4 +89,4 @@ const styles = StyleSheet.create({
},
});
-export default NotificationsPage;
+export default NotificationsPage;
\ No newline at end of file
diff --git a/components/pages/onboarding/OnboardingFlow.tsx b/components/pages/onboarding/OnboardingFlow.tsx
index 69b01d2..103a055 100644
--- a/components/pages/onboarding/OnboardingFlow.tsx
+++ b/components/pages/onboarding/OnboardingFlow.tsx
@@ -1,91 +1,88 @@
-import { Image } from "react-native";
-import React, { useRef } from "react";
-import { View, Text, Button, TextField } from "react-native-ui-lib";
+import {Image, StyleSheet} from "react-native";
+import React, {useRef} from "react";
+import {Button, Text, TextField, View} from "react-native-ui-lib";
import Onboarding from "react-native-onboarding-swiper";
-import { StyleSheet } from "react-native";
-import { useAuthContext } from "@/contexts/AuthContext";
-import { useSignUp } from "@/hooks/firebase/useSignUp";
-const OnboardingFlow = () => {
- const onboardingRef = useRef(null);
- const { mutateAsync: signUp } = useSignUp();
- return (
-
- ),
- title: Welcome to Cally,
- subtitle: (
-
- Lightening Mental Loads, One Family at a Time
- onboardingRef?.current?.goToPage(1, true)}
- />
-
- ),
- },
- {
- backgroundColor: "#f9f8f7",
- title: Get started with Cally,
- image: (
-
- ),
- subtitle: (
-
-
- {/**/}
- {/**/}
-
-
- {
- console.log("Onboarding Done");
- }}
- />
-
-
- ),
- },
- ]}
- />
- );
+const OnboardingFlow = () => {
+ const onboardingRef = useRef(null);
+
+ return (
+
+ ),
+ title: Welcome to Cally,
+ subtitle: (
+
+ Lightening Mental Loads, One Family at a Time
+ onboardingRef?.current?.goToPage(1, true)}
+ />
+
+ ),
+ },
+ {
+ backgroundColor: "#f9f8f7",
+ title: Get started with Cally,
+ image: (
+
+ ),
+ subtitle: (
+
+
+ {/**/}
+ {/**/}
+
+
+ {
+ console.log("Onboarding Done");
+ }}
+ />
+
+
+ ),
+ },
+ ]}
+ />
+ );
};
export default OnboardingFlow;
const styles = StyleSheet.create({
- textfield: {
- backgroundColor: "white",
- marginVertical: 10,
- padding: 30,
- height: 45,
- borderRadius: 50,
- },
+ textfield: {
+ backgroundColor: "white",
+ marginVertical: 10,
+ padding: 30,
+ height: 45,
+ borderRadius: 50,
+ },
});
diff --git a/components/pages/settings/user_components/DeleteProfileDialogs.tsx b/components/pages/settings/user_components/DeleteProfileDialogs.tsx
index e6acb52..63f5c41 100644
--- a/components/pages/settings/user_components/DeleteProfileDialogs.tsx
+++ b/components/pages/settings/user_components/DeleteProfileDialogs.tsx
@@ -2,7 +2,6 @@ import React, { useState } from "react";
import { Dialog, Button, Text, View } from "react-native-ui-lib";
import { StyleSheet } from "react-native";
import { Feather } from "@expo/vector-icons";
-import {useDeleteUser} from "@/hooks/firebase/useDeleteUser";
interface ConfirmationDialogProps {
visible: boolean;
diff --git a/components/pages/settings/user_settings_views/MyGroup.tsx b/components/pages/settings/user_settings_views/MyGroup.tsx
index 77856e3..1cf8822 100644
--- a/components/pages/settings/user_settings_views/MyGroup.tsx
+++ b/components/pages/settings/user_settings_views/MyGroup.tsx
@@ -33,8 +33,6 @@ import KeyboardManager, {
} from "react-native-keyboard-manager";
import { ScrollView } from "react-native-gesture-handler";
import { useUploadProfilePicture } from "@/hooks/useUploadProfilePicture";
-import { ImagePickerAsset } from "expo-image-picker";
-import MenuDotsIcon from "@/assets/svgs/MenuDotsIcon";
import UserOptions from "./UserOptions";
type MyGroupProps = {
diff --git a/components/pages/settings/user_settings_views/UserMenu.tsx b/components/pages/settings/user_settings_views/UserMenu.tsx
index 4ef81ed..6de8310 100644
--- a/components/pages/settings/user_settings_views/UserMenu.tsx
+++ b/components/pages/settings/user_settings_views/UserMenu.tsx
@@ -9,7 +9,6 @@ import {
import QRCode from "react-native-qrcode-svg";
import { PanningDirectionsEnum } from "react-native-ui-lib/src/components/panningViews/panningProvider";
import Ionicons from "@expo/vector-icons/Ionicons";
-import { useGetFamilyMembers } from "@/hooks/firebase/useGetFamilyMembers";
import { UserProfile } from "@/hooks/firebase/types/profileTypes";
import { StyleSheet } from "react-native";
import { ProfileType } from "@/contexts/AuthContext";
diff --git a/components/pages/todos/AddChore.tsx b/components/pages/todos/AddChore.tsx
index 2237240..2030be4 100644
--- a/components/pages/todos/AddChore.tsx
+++ b/components/pages/todos/AddChore.tsx
@@ -1,68 +1,66 @@
-import { Dimensions, StyleSheet } from "react-native";
-import React, { useState } from "react";
-import { Button, ButtonSize, Text, View } from "react-native-ui-lib";
-import { AntDesign } from "@expo/vector-icons";
-import LinearGradient from "react-native-linear-gradient";
+import {StyleSheet} from "react-native";
+import React, {useState} from "react";
+import {Button, ButtonSize, Text, View} from "react-native-ui-lib";
import AddChoreDialog from "./AddChoreDialog";
import PlusIcon from "@/assets/svgs/PlusIcon";
const AddChore = () => {
- const [isVisible, setIsVisible] = useState(false);
+ const [isVisible, setIsVisible] = useState(false);
- return (
-
-
- setIsVisible(!isVisible)}
+ return (
+
-
-
- Create new to do
-
-
-
- {isVisible && (
-
- )}
-
- );
+
+ setIsVisible(!isVisible)}
+ >
+
+
+ Create new to do
+
+
+
+ {isVisible && (
+
+ )}
+
+ );
};
export default AddChore;
const styles = StyleSheet.create({
- gradient: {
- height: 150,
- position: "absolute",
- bottom: 0,
- width: "100%",
- justifyContent: "center",
- alignItems: "center",
- },
- buttonContainer: {
- width: "100%",
- alignItems: "center",
- },
- button: {
- backgroundColor: "rgb(253, 23, 117)",
- height: 53.26,
- borderRadius: 30,
- width: 335,
- },
+ gradient: {
+ height: 150,
+ position: "absolute",
+ bottom: 0,
+ width: "100%",
+ justifyContent: "center",
+ alignItems: "center",
+ },
+ buttonContainer: {
+ width: "100%",
+ alignItems: "center",
+ },
+ button: {
+ backgroundColor: "rgb(253, 23, 117)",
+ height: 53.26,
+ borderRadius: 30,
+ width: 335,
+ },
});
diff --git a/components/pages/todos/ProgressCard.tsx b/components/pages/todos/ProgressCard.tsx
index c82d1aa..d73d8c9 100644
--- a/components/pages/todos/ProgressCard.tsx
+++ b/components/pages/todos/ProgressCard.tsx
@@ -1,44 +1,43 @@
-import { View, Text, Button } from "react-native-ui-lib";
+import {Text, View} from "react-native-ui-lib";
import React from "react";
-import { Fontisto } from "@expo/vector-icons";
-import { ProgressBar } from "react-native-ui-lib/src/components/progressBar";
-import { useToDosContext } from "@/contexts/ToDosContext";
+import {ProgressBar} from "react-native-ui-lib/src/components/progressBar";
+import {useToDosContext} from "@/contexts/ToDosContext";
import FireworksOrangeIcon from "@/assets/svgs/FireworksOrangeIcon";
-const ProgressCard = ({children}: {children?: React.ReactNode}) => {
- const { maxPoints } = useToDosContext();
- return (
-
-
-
-
- You have earned XX points this week!{" "}
-
-
-
-
- 0
- {maxPoints}
-
-
- {children}
-
-
- );
+const ProgressCard = ({children}: { children?: React.ReactNode }) => {
+ const {maxPoints} = useToDosContext();
+ return (
+
+
+
+
+ You have earned XX points this week!{" "}
+
+
+
+
+ 0
+ {maxPoints}
+
+
+ {children}
+
+
+ );
};
export default ProgressCard;
diff --git a/components/pages/todos/family-chores/FamilyChart.tsx b/components/pages/todos/family-chores/FamilyChart.tsx
index 7737adc..87add82 100644
--- a/components/pages/todos/family-chores/FamilyChart.tsx
+++ b/components/pages/todos/family-chores/FamilyChart.tsx
@@ -1,5 +1,4 @@
import React from "react";
-import { View } from "react-native";
import { BarChart } from "react-native-gifted-charts";
const FamilyChart = () => {
diff --git a/components/pages/todos/user-chores/UserChart.tsx b/components/pages/todos/user-chores/UserChart.tsx
index 5ef602b..eeed824 100644
--- a/components/pages/todos/user-chores/UserChart.tsx
+++ b/components/pages/todos/user-chores/UserChart.tsx
@@ -1,5 +1,4 @@
import React from "react";
-import { View } from "react-native";
import { BarChart } from "react-native-gifted-charts";
const UserChart = () => {
diff --git a/components/pages/todos/user-chores/UserChoresProgress.tsx b/components/pages/todos/user-chores/UserChoresProgress.tsx
index f4cec19..8cc04f3 100644
--- a/components/pages/todos/user-chores/UserChoresProgress.tsx
+++ b/components/pages/todos/user-chores/UserChoresProgress.tsx
@@ -1,191 +1,181 @@
-import {
- View,
- Text,
- ProgressBar,
- Button,
- ButtonSize,
- Modal,
- Dialog,
- TouchableOpacity,
-} from "react-native-ui-lib";
-import React, { useState } from "react";
-import { StyleSheet } from "react-native";
+import {Button, ButtonSize, Dialog, ProgressBar, Text, TouchableOpacity, View,} from "react-native-ui-lib";
+import React, {useState} from "react";
+import {StyleSheet} from "react-native";
import UserChart from "./UserChart";
import ProgressCard from "../ProgressCard";
-import { AntDesign, Feather, Ionicons } from "@expo/vector-icons";
-import { ScrollView } from "react-native-gesture-handler";
-import { PanViewDirectionsEnum } from "react-native-ui-lib/src/incubator/panView";
+import {AntDesign, Ionicons} from "@expo/vector-icons";
+import {ScrollView} from "react-native-gesture-handler";
import FireworksOrangeIcon from "@/assets/svgs/FireworksOrangeIcon";
const UserChoresProgress = ({
- setPageIndex,
-}: {
- setPageIndex: (value: number) => void;
+ setPageIndex,
+ }: {
+ setPageIndex: (value: number) => void;
}) => {
- const [modalVisible, setModalVisible] = useState(false);
- return (
-
-
- setPageIndex(0)}>
-
-
-
- Return to To Do's
-
-
-
-
-
- Your To Do's Progress Report
-
-
-
-
- Daily Goal
-
-
-
-
-
- Points Earned This Week
-
-
-
-
-
-
-
- Total Reward Points
-
- setModalVisible(true)}
- labelStyle={{
- fontSize: 13,
- fontFamily: "Manrope_400Regular",
- }}
- iconSource={() => (
-
- )}
- />
-
-
-
-
- (false);
+ return (
+
+
- You have 1200 points saved!
-
-
-
-
- 0
- 5000
-
+ setPageIndex(0)}>
+
+
+
+ Return to To Do's
+
+
+
+
+
+ Your To Do's Progress Report
+
+
+
+
+ Daily Goal
+
+
+
+
+
+ Points Earned This Week
+
+
+
+
+
+
+
+ Total Reward Points
+
+ setModalVisible(true)}
+ labelStyle={{
+ fontSize: 13,
+ fontFamily: "Manrope_400Regular",
+ }}
+ iconSource={() => (
+
+ )}
+ />
+
+
+
+
+
+ You have 1200 points saved!
+
+
+
+
+ 0
+ 5000
+
+
+
+
-
-