From 2712d81d8e300119f1e6a9b6dbafd7e375af1232 Mon Sep 17 00:00:00 2001 From: davye Date: Thu, 17 Oct 2024 19:56:49 -0700 Subject: [PATCH 1/2] format summary page --- source/frontend/pages/summary.tsx | 30 ++++++++++++++++++++---------- 1 file changed, 20 insertions(+), 10 deletions(-) diff --git a/source/frontend/pages/summary.tsx b/source/frontend/pages/summary.tsx index ce49266..00587dd 100644 --- a/source/frontend/pages/summary.tsx +++ b/source/frontend/pages/summary.tsx @@ -134,7 +134,7 @@ export class Summary extends Component { > { > {this.state.month} - + {/* */} { fontSize: 15, textAlign: "left", fontWeight: "bold", - color: Colors.primary, + color: Colors.tertiary, }} > Categorical Spending @@ -169,14 +169,14 @@ export class Summary extends Component { backgroundColor={"transparent"} paddingLeft={"0"} /> - + {/* */} Total Spending @@ -197,7 +197,7 @@ export class Summary extends Component { fontWeight: "bold", }} > - Total: {this.state.totalAmount} + Total: ${this.state.totalAmount.toFixed(2)} { domainPadding={{ y: 10 }} > { /> { labels={({ datum }) => datum.y} labelComponent={} style={{ - data: { stroke: "#c43a31" }, + data: { stroke: "#44576D", strokeWidth: 2 }, parent: { border: "1px solid #ccc" }, }} > @@ -286,21 +286,31 @@ export class Summary extends Component { if (res.ok) { res.json().then((data) => { if (graph === "pie") { + console.log(data); this.processPieData(data); } else if (graph === "line") { + console.log(data); this.processlineData(data); } }); } else { console.error("Error receiving user info"); + // this.setState({ loading: false }); // Stop loading if there's an error } }; processPieData = (data: { [key: string]: number }) => { + // if (Object.keys(data).length === 0) { + // // Handle empty data case + // this.setState({ pieData: [], loading: false }); + // return; + // } + const totalSpending = Object.values(data).reduce( (acc, amount) => acc + amount, 0 ); + console.log(totalSpending); // Transform the data into a format suitable for the PieChart const newData = Object.keys(data).map((category) => ({ @@ -324,7 +334,7 @@ export class Summary extends Component { this.setState({ lineData: data, loading: false, - maxY: max, + maxY: max === 0 ? 1 : max, // Set maxY to 1 if max is 0 totalAmount: total, }); }; From dcd6c91fe7b5ad7670f2a2431d9840011a3e8c03 Mon Sep 17 00:00:00 2001 From: davye Date: Thu, 17 Oct 2024 21:05:25 -0700 Subject: [PATCH 2/2] update summary UI --- source/frontend/pages/summary.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/source/frontend/pages/summary.tsx b/source/frontend/pages/summary.tsx index d75cb51..6597f24 100644 --- a/source/frontend/pages/summary.tsx +++ b/source/frontend/pages/summary.tsx @@ -96,7 +96,6 @@ export class Summary extends Component { > {this.state.month} - {/* */} { paddingLeft={"0"} /> -