From 497c556a8741896167c5a0480f3e9963ede5d0f3 Mon Sep 17 00:00:00 2001 From: thschleicher Date: Fri, 5 Jan 2024 20:53:47 +0100 Subject: [PATCH] removed "entered" log, fixed loading symbol, implemented category update with editing --- app/(tabs)/budget/category.tsx | 2 +- app/(tabs)/budget/editCategory.tsx | 3 ++- app/(tabs)/budget/index.tsx | 2 +- app/(tabs)/home/index.tsx | 6 ++---- components/common/loadingSymbol.tsx | 14 +++++++------- services/database.ts | 12 ++++++++++++ 6 files changed, 25 insertions(+), 14 deletions(-) diff --git a/app/(tabs)/budget/category.tsx b/app/(tabs)/budget/category.tsx index a58d02b..ca96d05 100644 --- a/app/(tabs)/budget/category.tsx +++ b/app/(tabs)/budget/category.tsx @@ -14,7 +14,7 @@ export default function Page() { const {data, isLoading, reFetch} = useFetch({sql: "SELECT e.guid AS expense_guid, e.name AS expense_name, c.name AS category_name, e.datetime AS expense_datetime, e.amount AS expense_amount, c.color AS category_color FROM expense e JOIN category c ON e.category_guid = c.guid WHERE c.guid = ? ORDER BY expense_datetime desc;", args: [category_guid]}); const handleEditCategory = () => { - router.push({pathname: "./(tabs)/budget/editCategory", params: {category_guid: category_guid, category_color: category_color, category_amount: category_amount, category_name: category_name, category_type: category_type}}); + router.push({pathname: "/(tabs)/budget/editCategory", params: {category_guid: category_guid, category_color: category_color, category_amount: category_amount, category_name: category_name, category_type: category_type}}); } const handleBackButton = () => { diff --git a/app/(tabs)/budget/editCategory.tsx b/app/(tabs)/budget/editCategory.tsx index b3b8ec7..d45958d 100644 --- a/app/(tabs)/budget/editCategory.tsx +++ b/app/(tabs)/budget/editCategory.tsx @@ -2,6 +2,7 @@ import { router, useLocalSearchParams } from "expo-router"; import { useState } from "react"; import { SafeAreaView, StyleSheet, Text, TextInput, View } from "react-native"; import { AutoDecimalInput, CustomColorPicker, NavigationButton, TypeSelectorSwitch } from "../../../components"; +import { updateCategory } from "../../../services/database"; import { useTheme } from "../../contexts/ThemeContext"; const addCategory = () => { @@ -48,7 +49,7 @@ const addCategory = () => { router.back(); }}/> { - console.log("Implement Saving here!"); + updateCategory(category_guid.toString(), categoryName, categoryColor, selectedType, amount); router.back(); }}/> diff --git a/app/(tabs)/budget/index.tsx b/app/(tabs)/budget/index.tsx index 3f2aa97..9131dc7 100644 --- a/app/(tabs)/budget/index.tsx +++ b/app/(tabs)/budget/index.tsx @@ -38,7 +38,7 @@ export default function Page() { }; const handleCategoryPress = (item: {[column: string]: any;}) => { - router.push({pathname: "./(tabs)/budget/category", params: {category_guid: item.category_guid, category_name: item.category_name}}) + router.push({pathname: "/(tabs)/budget/category", params: {category_guid: item.category_guid, category_name: item.category_name}}) } return ( diff --git a/app/(tabs)/home/index.tsx b/app/(tabs)/home/index.tsx index d57614f..8f78e74 100644 --- a/app/(tabs)/home/index.tsx +++ b/app/(tabs)/home/index.tsx @@ -1,4 +1,4 @@ -import React, { useRef, useState, useMemo } from 'react'; +import React, { useMemo, useRef, useState } from 'react'; import { NativeScrollEvent, NativeSyntheticEvent, StyleSheet, View } from 'react-native'; import { Calendar } from 'react-native-calendars'; import { FlatList, RefreshControl } from 'react-native-gesture-handler'; @@ -6,9 +6,8 @@ import { SafeAreaView } from 'react-native-safe-area-context'; import { ExpenseItem, LoadingSymbol, Plus, TextInputBar, Welcome } from '../../../components'; import useFetch from '../../../hooks/useFetch'; -import { addExpense, executeQuery } from "../../../services/database"; -import { useAuth } from '../../contexts/AuthContext'; import { useRouter } from "expo-router"; +import { addExpense } from "../../../services/database"; import { SimpleDate } from '../../../util/SimpleDate'; import { useTheme } from '../../contexts/ThemeContext'; @@ -22,7 +21,6 @@ type MarkedDates = { } const constructMarkedDates = (data : {[column: string]: any}) => { - console.log("entered") let markedDates: MarkedDates = {}; data.forEach((value: any) => { const dateKey: string = String(value["expense_datetime"]).split(" ")[0] diff --git a/components/common/loadingSymbol.tsx b/components/common/loadingSymbol.tsx index b7e1a03..2769dcb 100644 --- a/components/common/loadingSymbol.tsx +++ b/components/common/loadingSymbol.tsx @@ -1,15 +1,15 @@ import React, { useEffect, useRef } from "react"; -import { StyleSheet, View, Animated, Easing, ActivityIndicator } from "react-native"; +import { ActivityIndicator, Animated, Easing, StyleSheet, View } from "react-native"; +import { useTheme } from "../../app/contexts/ThemeContext"; const LoadingSymbol = () => { - const color = ["blue", "red", "purple", "green", "yellow", "orange"]; - const random = Math.floor(Math.random() * color.length); + const {colors} = useTheme(); const spinValue = useRef(new Animated.Value(0)).current; const spin = spinValue.interpolate({ inputRange: [0, 1], - outputRange: ["0deg", "360deg"], + outputRange: [0, 360], }); useEffect(() => { @@ -25,7 +25,6 @@ const LoadingSymbol = () => { const styles = StyleSheet.create({ container: { - backgroundColor: color[random], width: "100%", height: "100%", position: "absolute", @@ -35,13 +34,14 @@ const LoadingSymbol = () => { loader: { width: 100, height: 100, - transform: [{ rotate: spin }], + transform: [{ rotate: spin + "deg"}], + zIndex: 999, }, }); return ( - + ); }; diff --git a/services/database.ts b/services/database.ts index cbee2b1..7fe3921 100644 --- a/services/database.ts +++ b/services/database.ts @@ -24,6 +24,18 @@ export const initDatabase = async () => { } }; +export const updateCategory = async (guid: string, name: string, color: string, type: string, allocated_amount: number) => { + + try { + await db.transactionAsync(async (tx) => { + await tx.executeSqlAsync("UPDATE category SET name = ?, color = ?, type = ?, allocated_amount = ? WHERE guid = ?", [name, color, type, allocated_amount, guid]); + }); + } catch (error) { + console.log("Error updating category: ", error); + throw error; + } +}; + export const addCategory = async (name: string, color: string, type: string, allocated_amount: number) => { //needs user input validation for type and color (should be validated by this function)