Spaces:
Sleeping
Sleeping
Fix statements data formatting
#6
by hakeemsyd - opened
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
|
| 27 |
-
const
|
| 28 |
-
const
|
| 29 |
-
|
| 30 |
-
|
| 31 |
-
|
| 32 |
-
|
| 33 |
-
|
| 34 |
-
amount: statementData.income[key],
|
| 35 |
}));
|
| 36 |
|
| 37 |
-
const expensesData =
|
| 38 |
-
key,
|
| 39 |
-
category: `Expense - ${
|
| 40 |
-
amount:
|
| 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">
|