diff --git a/app/(tabs)/(stats)/index.tsx b/app/(tabs)/(stats)/index.tsx
index d92ebf4..fc96d1a 100644
--- a/app/(tabs)/(stats)/index.tsx
+++ b/app/(tabs)/(stats)/index.tsx
@@ -1,33 +1,13 @@
import React from 'react';
-import { ScrollView, StyleSheet, View } from 'react-native';
+import { SafeAreaView } from 'react-native';
import { Graph } from '../../../components';
-import { useTheme } from '../../contexts/ThemeContext';
export default function Page() {
- const { colors } = useTheme();
-
- // Mock data #TODO Database einbinden
- // what to do when amount too small?
-
- const spent = 120.75;
- const budget = 696.96;
-
-
-
- const styles = StyleSheet.create({
- container: {
- flex: 1,
- backgroundColor: colors.backgroundColor,
- marginTop: 50,
- alignItems: 'center',
- },
- });
return (
-
-
+
-
+
{/*
@@ -45,7 +25,6 @@ export default function Page() {
*/}
-
-
+
);
}
diff --git a/components/stats/Graph.tsx b/components/stats/Graph.tsx
index 33ebd2d..6d737d8 100644
--- a/components/stats/Graph.tsx
+++ b/components/stats/Graph.tsx
@@ -1,35 +1,29 @@
-import { useEffect } from "react";
+import { Dimensions, View } from "react-native";
import { PieChart } from "react-native-chart-kit";
+import { useTheme } from "../../app/contexts/ThemeContext";
import useFetch from "../../hooks/useFetch";
const Graph = () => {
+ const {colors} = useTheme();
- const {data, isLoading, reFetch} = useFetch({sql: "SELECT c.name AS name, c.color AS color, SUM(e.amount) as total FROM category c LEFT JOIN expense e ON e.category_guid = c.guid GROUP BY c.guid", args: []});
-
- useEffect(() => {
- console.log(data);
- }, [data])
+ const {data} = useFetch({sql: "SELECT c.name AS name, c.color AS color, SUM(e.amount) as total FROM category c LEFT JOIN expense e ON e.category_guid = c.guid GROUP BY c.guid", args: []});
+ const acctual_data = data.map(item => ({...item, legendFontColor: colors.primaryText, legendFontSize: 14}));
return (
+
`rgba(255, 255, 255, ${opacity})`,
- style: {
- borderRadius: 16
- }
}}
+ backgroundColor="transparent"
accessor="total"
- backgroundColor="red"
paddingLeft="15"
- absolute
+ avoidFalseZero={true}
/>
+
);
}