From b63f156eb7a9958bf3e6d1c1d439375d72c7355a Mon Sep 17 00:00:00 2001
From: Daniel <danthevip@gmail.com>
Date: Wed, 25 Oct 2023 21:20:42 +0300
Subject: [PATCH] Working on in-app live updates

---
 .../routes/dashboard/board/Dashboard.svelte   | 22 +++++++-
 .../dashboard/board/graphs/Graph1.svelte      | 53 ++++++++-----------
 2 files changed, 42 insertions(+), 33 deletions(-)

diff --git a/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/Dashboard.svelte b/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/Dashboard.svelte
index 68a21dc..8849016 100644
--- a/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/Dashboard.svelte
+++ b/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/Dashboard.svelte
@@ -4,11 +4,31 @@
 	import QuickInfobar from "./other/QuickInfobar.svelte";
     import { getCookie } from "svelte-cookie";
     import {onMount} from "svelte";
+    import {writable} from "svelte/store";
+    import axios from "axios";
 
-    onMount(() => {
+    const incomeData = writable([]);
+    const expenseData = writable([]);
+
+    onMount(async () => {
             if (getCookie('access_token') === null ) {
                     window.location.href = '/auth/login';
             }
+
+            try {
+                    const response = await axios.get('http://localhost:8081/incomes/personal-incomes', config);
+                    incomeData.set(response.data);
+            } catch (error) {
+                    console.error('Error fetching income data:', error);
+            }
+
+            try {
+                    const response = await axios.get('http://localhost:8081/expenses/personal-expenses', config);
+                    expenseData.set(response.data);
+            } catch (error) {
+                    console.error('Error fetching expense data:', error);
+            }
+
             console.log(getCookie('access_token'));
     })
 </script>
diff --git a/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/graphs/Graph1.svelte b/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/graphs/Graph1.svelte
index 0d1fa43..433a217 100644
--- a/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/graphs/Graph1.svelte
+++ b/src/main/java/com/faf223/expensetrackerfaf/web/src/routes/dashboard/board/graphs/Graph1.svelte
@@ -1,44 +1,35 @@
 <script>
 	import Chart from 'chart.js/auto';
 	import { onMount } from 'svelte';
-	import axios from 'axios';
-	import { getCookie } from "svelte-cookie";
-
+	import { incomeData } from '../Dashboard.svelte';
 	let ctx;
 	let chartCanvas;
 
-	async function updateGraph() {
-		const token = getCookie('access_token');
-
-		const config = {
-			headers: {
-				'Authorization': `Bearer ${token}`
+	function groupAndSumByCategory(incomes) {
+		const groupedData = new Map();
+		incomes.forEach(income => {
+			const category = income.incomeCategory.name;
+			if (groupedData.has(category)) {
+				groupedData.set(category, groupedData.get(category) + income.amount);
+			} else {
+				groupedData.set(category, income.amount);
 			}
-		};
+		});
+		return groupedData;
+	}
 
-		try {
-			const response = await axios.get('http://localhost:8081/incomes/personal-incomes', config);
-			const incomeData = response.data;
+	function updateGraph() {
+		const incomeDataArray = $incomeData;
+		const groupedIncomeData = groupAndSumByCategory(incomeDataArray);
 
-			function groupAndSumByCategory(incomes) {
-				const groupedData = new Map();
-				incomes.forEach(income => {
-					const category = income.incomeCategory.name;
-					if (groupedData.has(category)) {
-						groupedData.set(category, groupedData.get(category) + income.amount);
-					} else {
-						groupedData.set(category, income.amount);
-					}
-				});
-				return groupedData;
-			}
-
-			const groupedIncomeData = groupAndSumByCategory(incomeData);
-
-			const chartLabels = Array.from(groupedIncomeData.keys());
-			const chartValues = Array.from(groupedIncomeData.values());
+		const chartLabels = Array.from(groupedIncomeData.keys());
+		const chartValues = Array.from(groupedIncomeData.values());
 
+		if (chartCanvas) {
 			ctx = chartCanvas.getContext('2d');
+			if (ctx.chart) {
+				ctx.chart.destroy(); 
+			}
 			new Chart(ctx, {
 				type: 'bar',
 				data: {
@@ -54,8 +45,6 @@
 					maintainAspectRatio: false
 				}
 			});
-		} catch (error) {
-			console.error('Error:', error);
 		}
 	}