diff --git a/app/_layout.tsx b/app/_layout.tsx index 6700eb8..bc499f5 100644 --- a/app/_layout.tsx +++ b/app/_layout.tsx @@ -1,4 +1,5 @@ import UpdateBudgetBottomSheet from '@/components/expenses/UpdateBudgetBottomSheet'; +import { colors } from '@/constants/Colors'; import DefaultTheme from '@/constants/Theme'; import { useBackgroundFetch } from '@/hooks/useBackgroundFetch'; import { useCustomFonts } from '@/hooks/useCustomFonts'; @@ -8,6 +9,7 @@ import { ThemeProvider } from '@react-navigation/native'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { Stack } from 'expo-router'; import * as SplashScreen from 'expo-splash-screen'; +import { StatusBar } from 'expo-status-bar'; import { useEffect } from 'react'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; import 'react-native-reanimated'; @@ -41,6 +43,7 @@ export default function RootLayout() { return ( <> + diff --git a/app/add.tsx b/app/add.tsx index 89f3b04..47413b1 100644 --- a/app/add.tsx +++ b/app/add.tsx @@ -1,5 +1,6 @@ import AddFactory from '@/components/add/AddFactory'; import { isSupportedAddType } from '@/components/add/utils'; +import AppSafeAreaView from '@/components/common/AppSafeAreaView'; import Container from '@/components/common/Container'; import Tabs from '@/components/common/Tabs'; import { TabItem } from '@/components/common/Tabs/TabsItem'; @@ -8,7 +9,7 @@ import ThemedView from '@/components/common/ThemedView'; import { MaterialCommunityIcons } from '@expo/vector-icons'; import { useLocalSearchParams, useNavigation } from 'expo-router'; import React, { useState } from 'react'; -import { KeyboardAvoidingView, Platform, SafeAreaView, StyleSheet } from 'react-native'; +import { KeyboardAvoidingView, Platform, StyleSheet } from 'react-native'; export type SupportedAddItems = 'Expense' | 'Todo'; @@ -36,7 +37,7 @@ export default function AddScreen() { }; return ( - + - + ); } diff --git a/components/common/EasyDatePicker/EasyDatePicker.tsx b/components/common/EasyDatePicker/EasyDatePicker.tsx index aa66cb9..5bbf387 100644 --- a/components/common/EasyDatePicker/EasyDatePicker.tsx +++ b/components/common/EasyDatePicker/EasyDatePicker.tsx @@ -23,7 +23,18 @@ type EasyDatePickerProps = { }; export default function EasyDatePicker({ onSelectDate, selectedDate, label }: EasyDatePickerProps) { - const [selectedType, setSelectedType] = useState(null); + const [selectedType, setSelectedType] = useState(() => { + if (!selectedDate) { + return null; + } + if (dayjs(selectedDate).isSame(dayjs(), 'day')) { + return 'today'; + } + if (dayjs(selectedDate).isSame(dayjs().add(1, 'day'), 'day')) { + return 'tomorrow'; + } + return 'custom'; + }); const handlePressToday = () => { setSelectedType('today'); diff --git a/components/common/HeaderWithBackButton/HeaderWithBackButton.tsx b/components/common/HeaderWithBackButton/HeaderWithBackButton.tsx index 8f4a2aa..33a3e90 100644 --- a/components/common/HeaderWithBackButton/HeaderWithBackButton.tsx +++ b/components/common/HeaderWithBackButton/HeaderWithBackButton.tsx @@ -1,6 +1,8 @@ import { MaterialCommunityIcons } from '@expo/vector-icons'; import PageHeader from '../PageHeader'; import { PageHeaderProps } from '../PageHeader/PageHeader'; +import { View } from 'react-native'; +import { colors } from '@/constants/Colors'; type HeaderWithBackButtonProps = { onBackPress: () => void; @@ -11,11 +13,13 @@ export default function HeaderWithBackButton({ ...pageHeaderProps }: HeaderWithBackButtonProps) { return ( - - } - {...pageHeaderProps} - /> + + + } + {...pageHeaderProps} + /> + ); } diff --git a/components/expenses/EditBudgetCard/EditBudgetCard.tsx b/components/expenses/EditBudgetCard/EditBudgetCard.tsx deleted file mode 100644 index d9d1218..0000000 --- a/components/expenses/EditBudgetCard/EditBudgetCard.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import BentoCard from '@/components/common/BentoCard'; -import EditIcon from '@/components/common/icons/EditIcon'; -import ThemedView from '@/components/common/ThemedView'; -import React from 'react'; -import { TouchableOpacity } from 'react-native'; -import { UpdateBudgetManager } from '../UpdateBudgetBottomSheet/UpdateBudgetBottomSheet'; - -function EditBudgetCard() { - const handlePress = () => { - UpdateBudgetManager.show(); - }; - - return ( - - - - - - - - ); -} - -export default EditBudgetCard; diff --git a/components/expenses/EditBudgetCard/index.ts b/components/expenses/EditBudgetCard/index.ts deleted file mode 100644 index d321b99..0000000 --- a/components/expenses/EditBudgetCard/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './EditBudgetCard'; diff --git a/components/expenses/EditExpenseScreen/EditExpenseForm/EditExpenseForm.tsx b/components/expenses/EditExpenseScreen/EditExpenseForm/EditExpenseForm.tsx index faf055c..a4754ff 100644 --- a/components/expenses/EditExpenseScreen/EditExpenseForm/EditExpenseForm.tsx +++ b/components/expenses/EditExpenseScreen/EditExpenseForm/EditExpenseForm.tsx @@ -1,12 +1,11 @@ +import CategorySelect from '@/components/common/CategorySelect'; import Container from '@/components/common/Container'; +import EasyDatePicker from '@/components/common/EasyDatePicker'; import RecurringExpenseField from '@/components/common/RecurringExpenseBottomSheet'; import ThemedView from '@/components/common/ThemedView'; -import ComboBox from '@/components/common/forms/ComboBox'; -import DatePicker from '@/components/common/forms/DatePicker'; import TextArea from '@/components/common/forms/TextArea'; import TextField from '@/components/common/forms/TextField'; import useCategories from '@/hooks/services/category/useCategories'; -import { useGetOrCreateCategory } from '@/hooks/services/category/useGetOrCreateCategory'; import { Expense } from '@/hooks/services/expense/expense.types'; import { useExpense } from '@/hooks/services/expense/useExpense'; import { useUpdateExpense } from '@/hooks/services/expense/useUpdateExpense'; @@ -28,7 +27,6 @@ export default function EditExpenseForm({ id }: EditExpenseFormProps) { const { data: categories, isLoading: isLoadingCategories } = useCategories(); const { data: expense, isLoading: isLoadingExpense } = useExpense(id); const { mutateAsync: updateExpenseMutate } = useUpdateExpense(id); - const getOrCreateCategory = useGetOrCreateCategory(); const validateAndHandleFieldUpdate = async ( fieldName: keyof EditExpenseFormValues, @@ -40,7 +38,7 @@ export default function EditExpenseForm({ id }: EditExpenseFormProps) { updateExpenseMutate({ [resolvedFieldName]: value }); return true; } catch (e) { - console.log(e); + console.error(e); return false; } }; @@ -54,12 +52,6 @@ export default function EditExpenseForm({ id }: EditExpenseFormProps) { const categoryName = categories?.find(({ id }) => id === expense?.category_id)?.category_name || ''; - const getCategoryIdByName = async (name: string) => { - const categoryId = await getOrCreateCategory(name); - - return categoryId ?? null; - }; - return ( @@ -78,7 +70,7 @@ export default function EditExpenseForm({ id }: EditExpenseFormProps) { // No form submission needed, everything is inline editing }} > - {({ handleChange, handleBlur, setFieldValue, values, errors, touched }) => ( + {({ handleBlur, setFieldValue, values, errors, touched }) => ( - { + + { setFieldValue('category', value); - const categoryId = await getCategoryIdByName(value); - updateExpenseMutate({ category_id: categoryId }); - }} - onBlur={async () => { - if (!values.category) return; - const categoryId = await getCategoryIdByName(values.category); - updateExpenseMutate({ category_id: categoryId }); }} - onChangeText={handleChange('category')} - isError={!!errors.category && !!touched.category} - errorMessage={errors.category} - options={categories?.map(({ category_name }) => category_name) ?? []} value={values.category} - label="Category" - placeholder="e.g. Restaurant, Grocery" - keyboardType="default" - returnKeyLabel="Done Category" - returnKeyType="done" /> - { setFieldValue('transactionDate', value); - debouncedHandleChange('transactionDate', dayjs(value).unix()); }} - variant="border" /> - + + } /> - + - + ); } diff --git a/components/expenses/RemainingBudgetCard/RemainingBudgetCard.tsx b/components/expenses/RemainingBudgetCard/RemainingBudgetCard.tsx index e20485c..01af0f8 100644 --- a/components/expenses/RemainingBudgetCard/RemainingBudgetCard.tsx +++ b/components/expenses/RemainingBudgetCard/RemainingBudgetCard.tsx @@ -91,6 +91,6 @@ const verticalStyles = StyleSheet.create({ alignItems: 'center', }, pieChart: { - marginTop: 0, + marginTop: 16, }, }); diff --git a/components/home/BudgetOverview/BudgetOverview.tsx b/components/home/BudgetOverview/BudgetOverview.tsx index ccd6177..403c539 100644 --- a/components/home/BudgetOverview/BudgetOverview.tsx +++ b/components/home/BudgetOverview/BudgetOverview.tsx @@ -2,12 +2,17 @@ import Container from '@/components/common/Container'; import React from 'react'; import TotalSpentTodayCard from './TotalSpentTodayCard'; import RemainingBudgetCard from '@/components/expenses/RemainingBudgetCard'; +import { View } from 'react-native'; function BudgetOverview() { return ( - - + + + + + + ); } diff --git a/components/tasks/TaskWorkArea.tsx b/components/tasks/TaskWorkArea.tsx index adee3d3..9cada1f 100644 --- a/components/tasks/TaskWorkArea.tsx +++ b/components/tasks/TaskWorkArea.tsx @@ -1,10 +1,10 @@ import TodoList from '@/components/tasks/TaskList'; -import { SafeAreaView } from 'react-native'; +import AppSafeAreaView from '../common/AppSafeAreaView'; export default function TaskWorkArea() { return ( - + - + ); }