Implement weight components

frontend/src/lib/components/Energy/EmptyFoodComp.svelte

@@ -47,11 +47,7 @@
 				return;
 			}
 
-			foodStore.update((value) => {
-				const updatedValue = [res.data, ...value];
-				console.log("Updated items:", updatedValue.length);
-				return updatedValue;
-			});
+			foodStore.update((value) => [res.data, ...value]);
 		}
 
 		if (!per100Edited)

frontend/src/lib/components/Weight/EmptyWeightComp.svelte

@@ -1,12 +1,13 @@
 <script lang="ts">
 	import { toast } from 'svelte-sonner'
-	import type { Err } from '$lib/types'
-	import { type Weight, WeightService } from '$lib/database/weight'
-	import { weightStore } from '$lib/store/weight/weightStore'
-	import { RefreshStores } from '$lib/utils'
+	import { main } from "$wails/models";
+	import { CreateWeight } from '$wails/main/App';
+	import { weightStore } from '$lib/store/Weight/weightStore';
 
-	let item: Weight = {
-		weight: 0
+	let item: main.Weight = {
+		weight: 0,
+		rowid: 0,
+		date: ''
 	}
 	let weight: string | null = null
 
@@ -18,14 +19,20 @@
 			event.preventDefault()
 			item.weight = parseFloat(weight)
 
-			const [dbRow, err]: [Weight, Err] = await WeightService.Create(item)
-			weight = ''
-
-			if (err) {
-				toast.error(err)
+			if (isNaN(item.weight)) {
+				toast.error('Weight must be a number')
 				return
 			}
-			RefreshStores()
+			const res = await CreateWeight(item)
+			weight = ''
+			
+			if (!res.success) {
+				toast.error(`failed to create weight with error ${res.error}`)
+				return
+			}
+
+			console.log("update");
+			weightStore.update((value) => [res.data, ...value]);
 		}
 	}
 </script>

frontend/src/lib/components/Weight/WeightComp.svelte

@@ -1,34 +1,8 @@
 <script lang="ts">
-	import { type Weight, WeightService } from '$lib/database/weight'
+	import { main } from "$wails/models";
 
-	export let item: Weight
+	export let item: main.Weight
 	export let dateColor: string
-
-	let weight: string = item.weight.toString()
-
-	async function update(event: KeyboardEvent & { currentTarget: (EventTarget & HTMLTableCellElement) }) {
-		if (event.key == 'Enter') {
-			event.preventDefault()
-			await updateItem()
-		}
-	}
-
-	async function focusOutUpdate() {
-		await updateItem()
-	}
-
-	async function updateItem() {
-		weight = weight.trim()
-
-		item.weight = weight
-
-		const [newItem, err] = await WeightService.Update(item)
-
-		if (newItem && !err) {
-			item = newItem
-		}
-		weight = item.weight
-	}
 </script>
 
 <template>

frontend/src/lib/components/Weight/WeightTable.svelte

@@ -1,50 +1,45 @@
 <script lang="ts">
-	import { GenerateColor } from '$lib/utils'
-	import EmptyWeightComp from '$components/Weight/EmptyWeightComp.svelte'
-	import WeightComp from '$components/Weight/WeightComp.svelte'
-	import type { Weight } from '$lib/database/weight'
+	import { GenerateColor } from "$lib/utils";
+	import EmptyWeightComp from "$components/Weight/EmptyWeightComp.svelte";
+	import WeightComp from "$components/Weight/WeightComp.svelte";
+	import { main } from "$wails/models";
 
-	export let items: Weight[] = []
+	export let items: main.Weight[] = [];
 
-	const dateColors: Map<string, string> = new Map<string, string>()
+	const dateColors: Map<string, string> = new Map<string, string>();
 
-	function getDateColor(item: Weight): string {
-		if (!item) return GenerateColor()
-		if (!item.date) return GenerateColor()
-		const date = item.date.toString().split(' ')[0]
-		if (!date) return GenerateColor()
-		if (!dateColors.has(date)) dateColors.set(date, GenerateColor())
+	function getDateColor(item: main.Weight): string {
+		if (!item) return GenerateColor();
+		if (!item.date) return GenerateColor();
+		const date = item.date.toString().split("T")[0];
+		if (!date) return GenerateColor();
+		if (!dateColors.has(date)) dateColors.set(date, GenerateColor());
 		// THERE'S NOTHING UNDEFINED HERE
 		// WE GOT RID OF UNDEFINED ON LINE 33
 		// ASSHOLE
 		// @ts-ignore
-		return dateColors.get(date)
+		return dateColors.get(date);
 	}
 </script>
 
 <template>
-	<div class="relative flex flex-col flex-grow h-[95vh]" data-vaul-drawer-wrapper id="page">
+	<div class="relative flex flex-col flex-grow h-[93vh]" data-vaul-drawer-wrapper id="page">
 		<div class="relative overflow-auto h-full shadow-md sm:rounded-lg">
 			<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
 				<thead class="text-xs text-gray-700 uppercase dark:text-gray-400">
-				<tr>
-					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col">
-						Date
-					</th>
-					<th class="px-6 py-3 w-10/12" scope="col">
-						Weight
-					</th>
-				</tr>
+					<tr>
+						<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col"> Date </th>
+						<th class="px-6 py-3 w-10/12" scope="col"> Weight </th>
+					</tr>
 				</thead>
 				<tbody>
-				<EmptyWeightComp />
-				{#each items as f}
-					<WeightComp item="{f}" dateColor="{getDateColor(f)}" />
-				{/each}
+					<EmptyWeightComp />
+					{#each items as f}
+						<WeightComp item={f} dateColor={getDateColor(f)} />
+					{/each}
 				</tbody>
 			</table>
 		</div>
-		<div>
-		</div>
+		<div></div>
 	</div>
 </template>

frontend/src/lib/router/Router.svelte

@@ -5,6 +5,11 @@
 	import Weekly from './routes/Energy/Weekly.svelte'
 	import Monthly from './routes/Energy/Monthly.svelte'
 	import Yearly from './routes/Energy/Yearly.svelte'
+	import Weight from './routes/Weight/Weight.svelte'
+	// import WDaily from './routes/Weight/WDaily.svelte'
+	// import WWeekly from './routes/Weight/WWeekly.svelte'
+	// import WMonthly from './routes/Weight/WMonthly.svelte'
+	// import WYearly from './routes/Weight/WYearly.svelte'
 
 	const routes = {
 		'/': Energy,
@@ -12,6 +17,11 @@
 		'/Energy/weekly': Weekly,
 		'/Energy/monthly': Monthly,
 		'/Energy/yearly': Yearly,
+		'/Weight': Weight,
+		// '/Weight/daily': WDaily,
+		// '/Weight/weekly': WWeekly,
+		// '/Weight/monthly': WMonthly,
+		// '/Weight/yearly': WYearly
 	}
 </script>
 

frontend/src/lib/router/routes/Weight/Weight.svelte

@@ -1,8 +1,18 @@
 <script lang="ts">
-	import WeightTable from '$components/Weight/WeightTable.svelte'
-	import { weightStore } from '$lib/store/weight/weightStore'
+	import WeightTable from "$components/Weight/WeightTable.svelte";
+	import { weightStore } from "$lib/store/Weight/weightStore";
+
+	let forceUpdate = false;
+	weightStore.subscribe(() => {
+		console.log("updte");
+		forceUpdate = !forceUpdate;
+	});
 </script>
 
 <template>
-	<WeightTable items="{$weightStore}" />
+	{#if forceUpdate}
+		<WeightTable items={$weightStore} />
+	{:else}
+		<WeightTable items={$weightStore} />
+	{/if}
 </template>