Fix statements data formatting

#6
app/components/IncomeStatement/index.tsx CHANGED
@@ -8,36 +8,26 @@ type Props = {
8
  };
9
 
10
  const IncomeStatement = ({ statementData }: Props) => {
11
- console.log('statementData', statementData);
12
  const [data, setData] = useState<any | undefined>(undefined);
13
  const [profit, setProfit] = useState(0);
14
- const [incomeTotal, setIncomeTotal] = useState(0);
15
- const [expensesTotal, setExpensesTotal] = useState(0);
16
  const [summaryData, setSummaryData] = useState<any[]>([]);
17
 
18
  useEffect(() => {
19
- // (async () => {
20
- // const resp = await fetch(incomeStatements);
21
- // const t = await resp.json();
22
- // setData(t);
23
- // })();
24
-
25
  if (statementData) {
26
- const calculateTotal = (obj: any) => Object.values(obj).reduce((acc: any, value: any) => acc + value, 0);
27
- const aggIncome = calculateTotal(statementData.income);
28
- const expensesTotal = calculateTotal(statementData.expenses);
29
- const profit = Number(incomeTotal) - Number(expensesTotal);
30
-
31
- const incomeData = Object.keys(statementData.income).map((key) => ({
32
- key,
33
- category: `Income - ${key.charAt(0).toUpperCase() + key.slice(1)}`,
34
- amount: statementData.income[key],
35
  }));
36
 
37
- const expensesData = Object.keys(statementData.expenses).map((key) => ({
38
- key,
39
- category: `Expense - ${key.charAt(0).toUpperCase() + key.slice(1)}`,
40
- amount: statementData.expenses[key],
41
  }));
42
 
43
  const summaryData = [
@@ -61,14 +51,11 @@ const IncomeStatement = ({ statementData }: Props) => {
61
  ];
62
 
63
  setProfit(profit);
64
- setIncomeTotal(Number(aggIncome));
65
  setSummaryData(summaryData);
66
  }
67
  setData(statementData);
68
  }, []);
69
 
70
-
71
-
72
  const columns = [
73
  {
74
  title: 'Category',
@@ -90,8 +77,6 @@ const IncomeStatement = ({ statementData }: Props) => {
90
  return '';
91
  };
92
 
93
-
94
-
95
  if (!data) {
96
  return (
97
  <Flex align="center" gap="middle">
 
8
  };
9
 
10
  const IncomeStatement = ({ statementData }: Props) => {
 
11
  const [data, setData] = useState<any | undefined>(undefined);
12
  const [profit, setProfit] = useState(0);
 
 
13
  const [summaryData, setSummaryData] = useState<any[]>([]);
14
 
15
  useEffect(() => {
 
 
 
 
 
 
16
  if (statementData) {
17
+ const incomeTotal = statementData.income.total;
18
+ const expensesTotal = statementData.expenses.total;
19
+ const profit = incomeTotal - expensesTotal;
20
+
21
+ const incomeData = statementData.income.category_totals.map((item: any) => ({
22
+ key: Object.keys(item)[0],
23
+ category: `Income - ${Object.keys(item)[0]}`,
24
+ amount: Object.values(item)[0],
 
25
  }));
26
 
27
+ const expensesData = statementData.expenses.category_totals.map((item: any) => ({
28
+ key: Object.keys(item)[0],
29
+ category: `Expense - ${Object.keys(item)[0]}`,
30
+ amount: Object.values(item)[0],
31
  }));
32
 
33
  const summaryData = [
 
51
  ];
52
 
53
  setProfit(profit);
 
54
  setSummaryData(summaryData);
55
  }
56
  setData(statementData);
57
  }, []);
58
 
 
 
59
  const columns = [
60
  {
61
  title: 'Category',
 
77
  return '';
78
  };
79
 
 
 
80
  if (!data) {
81
  return (
82
  <Flex align="center" gap="middle">