rawalcher/interaktive-systeme
Archived
1
0
Fork 0
Code Issues 5 Pull requests 2 Projects Releases 14 Packages Wiki Activity Actions

feat: Add expense screen

Browse source
This commit is contained in:
Jakob Stornig 2024-01-05 00:13:56 +01:00
parent e1efed5b21
commit 36679279c1
18 changed files with 459 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

14
app/(tabs)/home/index.tsx
View file

@ -1,9 +1,9 @@
import React, { useRef, useState, useMemo } from 'react';
import { NativeScrollEvent, NativeSyntheticEvent, StyleSheet, View } from 'react-native';
import { Calendar } from 'react-native-calendars';
import { FlatList } from 'react-native-gesture-handler';
import { FlatList, RefreshControl } from 'react-native-gesture-handler';
import { SafeAreaView } from 'react-native-safe-area-context';
import { ExpenseItem, LoadingSymbol, Plus, SearchBar, Welcome } from '../../../components';
import { ExpenseItem, LoadingSymbol, Plus, TextInputBar, Welcome } from '../../../components';
import useFetch from '../../../hooks/useFetch';
import { addExpense, executeQuery } from "../../../services/database";
@ -63,7 +63,7 @@ export default function Page() {
}
}
const {data, isLoading, reFetch} = useFetch({sql: "SELECT e.guid AS expense_guid, c.guid AS category_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, c.type AS category_type FROM expense e JOIN category c ON e.category_guid = c.guid;", args: []});
const {data, isLoading, reFetch} = useFetch({sql: "SELECT e.guid AS expense_guid, c.guid AS category_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, c.type AS category_type FROM expense e JOIN category c ON e.category_guid = c.guid ORDER BY expense_datetime desc;", args: []});
const expenseDates = useMemo(()=>
constructMarkedDates(data)
@ -92,7 +92,7 @@ export default function Page() {
ListHeaderComponent={
<>
<Welcome name="My Dude" image={profile} onPress={() => {router.push("/home/userSettings")}}/>
<Calendar key={theme} maxDate={SimpleDate.now().format("YYYY-MM-DD")} style={{margin: 10, borderRadius: 20, padding:10}} theme={{
<Calendar key={theme} maxDate={SimpleDate.now().format("YYYY-MM-DD")} style={{borderRadius: 20, padding:10}} theme={{
dayTextColor: colors.primaryText,
textDisabledColor: colors.secondaryText,
todayTextColor: colors.accentColor,
@ -106,7 +106,7 @@ export default function Page() {
>
</Calendar>
<SearchBar placeholder='Type to Search...'></SearchBar>
<TextInputBar placeholder='Type to Search...' style={{marginBottom: 20}}></TextInputBar>
</>
}
renderItem = {({item}) => <ExpenseItem category={item.category_name} color={item.category_color} date={item.expense_datetime} title={item.expense_name} value={item.expense_amount}/>}
@ -114,6 +114,9 @@ export default function Page() {
ItemSeparatorComponent={() => {
return (<View style={styles.itemSeperatorStyle}/>);
}}
refreshControl={
<RefreshControl refreshing={isLoading} onRefresh={reFetch}/>
}
onScroll={handleScroll}
scrollEventThrottle={20}
/>
@ -124,6 +127,7 @@ export default function Page() {
const styles = StyleSheet.create({
safeAreaViewStyle: {
flex: 1,
paddingHorizontal: 10
},
itemSeperatorStyle: {
marginVertical: 5,