Merge branch '63-routing-back-refresh' into 'main'

Resolve "Routing Back Refresh"

Closes #63

See merge request thschleicher/interaktive-systeme!54

app/(tabs)/(budget)/addCategory.tsx

@@ -51,8 +51,7 @@ export default function Page() {
                         router.back();
                     }}/>
                     <NavigationButton text="Save" onPress={() => {
-                        addCategory(categoryName, categoryColor, selectedType, amount);
-                        router.back();
+                        addCategory(categoryName, categoryColor, selectedType, amount).then(() => router.back());
                     }}/> 
                 </View>
             </View>

app/(tabs)/(budget)/index.tsx

@@ -1,12 +1,13 @@
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import { router, useNavigation } from 'expo-router';
-import { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import { FlatList } from 'react-native-gesture-handler';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import { BudgetHeader, CategoryItem, LoadingSymbol, Plus } from '../../../components';
 import useFetch from '../../../hooks/useFetch';
 import { useTheme } from '../../contexts/ThemeContext';
+import { useFocusEffect } from 'expo-router/src/useFocusEffect';
 
 export default function Page() {
     const {colors} = useTheme()
@@ -30,6 +31,14 @@ export default function Page() {
         reFetch()
     }, [selectedPage]);
 
+    useEffect(() => {
+        const unsubscribe = navigation.addListener("focus", () => {
+            reFetch();
+        })
+        return unsubscribe;
+    
+    }, [navigation])
+
 
     const handlePageSelection = (page: string) => {
         if(page !== selectedPage) {

app/(tabs)/_layout.tsx

@@ -34,7 +34,7 @@ export default function Layout() {
     }
 
     return (
-        <Tabs sceneContainerStyle={styles.sceneContainer} screenOptions={screenOptions}>
+        <Tabs sceneContainerStyle={styles.sceneContainer} backBehavior="initialRoute" initialRouteName="(home)" screenOptions={screenOptions}>
             <Tabs.Screen name="(budget)" options={
                 {
                     tabBarLabel: "Budget",

components/home/expenseItem.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import { ColorValue, StyleSheet, Text, View } from 'react-native';
+import { TouchableOpacity } from 'react-native-gesture-handler';
+import { useTheme } from '../../app/contexts/ThemeContext';
 import { SIZES } from '../../constants/theme';
 import CustomCard from "../common/CustomCard";
-import { useTheme } from '../../app/contexts/ThemeContext';
-import { TouchableOpacity } from 'react-native-gesture-handler';
 
 //export type ExpenseItemProps = {color: ColorValue, category: string, title: string, date: string, value : string}
 interface ExpenseItemProps {
@@ -44,9 +44,10 @@ export default function ExpenseItem(itemProps : ExpenseItemProps) {
             </View>
             <View style={[styles.valueSection, {backgroundColor: colors.backgroundColor}]}>
               <Text style={{
+                paddingRight: 10,
                 fontSize: SIZES.xxLarge,
                 color: colors.primaryText
-              }} numberOfLines={1}>{itemProps.value}</Text>
+              }} numberOfLines={1}>{itemProps.value + " €"}</Text>
             </View>
           </View>
        </TouchableOpacity>

hooks/useFetch.ts

@@ -28,7 +28,6 @@ const useFetch = (query: Query) => {
 
 
     const reFetch = () => {
-        console.log("refetch called")
         setIsLoading(true);
         executeQuery(query).then((result) => {
             if("rows" in result[0]) {
@@ -36,7 +35,6 @@ const useFetch = (query: Query) => {
                 if(result[0]["rows"].length == 0){
                     setIsEmptyResult(true);
                 }
-                console.log("len", result[0]["rows"].length)
             }
         }).catch((error: any) => {
             console.error("Fetching data from database has failed: ", error);