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

Resolve "Routing Back Refresh"

Closes #63

See merge request thschleicher/interaktive-systeme!54
This commit is contained in:
jastornig 2024-01-25 15:16:13 +00:00
commit 79405f318d
5 changed files with 16 additions and 9 deletions

View file

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

View file

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

View file

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

View file

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

View file

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