Code format

frontend/src/lib/components/Energy/Aggregated/AggregatedFoodComp.svelte

@@ -1,13 +1,15 @@
 <script lang="ts">
 	import { main } from "$wails/models";
 
-	export let item: main.AggregatedFood
+	export let item: main.AggregatedFood;
 </script>
 
 <template>
 	<tr class="border-b border-gray-200 dark:border-gray-700">
-		<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+		<th
-		    scope="row">
+			class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+			scope="row"
+		>
 			{item.period}
 		</th>
 		<td class="px-6 py-4">

frontend/src/lib/components/Energy/Aggregated/AggregatedFoodTable.svelte

@@ -90,49 +90,51 @@
 <template>
 	<div class="flex flex-col gap-6 p-6 bg-gray-900 min-h-screen">
 		<div class="bg-gray-800 rounded-lg p-6 shadow-lg border border-gray-700">
-			<Line {data} 
+			<Line
+				{data}
 				options={{
 					responsive: true,
 					maintainAspectRatio: false,
 					plugins: {
 						legend: {
-							position: 'top',
+							position: "top",
 							labels: {
 								padding: 20,
-								color: 'rgb(229, 231, 235)',
+								color: "rgb(229, 231, 235)",
 								font: {
 									size: 12,
-									family: "'Nunito', sans-serif"
+									family: "'Nunito', sans-serif",
-								}
+								},
-							}
+							},
-						}
+						},
 					},
 					scales: {
 						y: {
 							grid: {
-								color: 'rgba(75, 85, 99, 0.2)'
+								color: "rgba(75, 85, 99, 0.2)",
 							},
 							ticks: {
-								color: 'rgb(229, 231, 235)',
+								color: "rgb(229, 231, 235)",
 								font: {
-									family: "'Nunito', sans-serif"
+									family: "'Nunito', sans-serif",
-								}
+								},
-							}
+							},
 						},
 						x: {
 							grid: {
-								color: 'rgba(75, 85, 99, 0.2)'
+								color: "rgba(75, 85, 99, 0.2)",
 							},
 							ticks: {
-								color: 'rgb(229, 231, 235)',
+								color: "rgb(229, 231, 235)",
 								font: {
-									family: "'Nunito', sans-serif"
+									family: "'Nunito', sans-serif",
-								}
+								},
-							}
+							},
-						}
+						},
-					}
+					},
 				}}
-				class="max-h-[50vh] h-[50vh]" />
+				class="max-h-[50vh] h-[50vh]"
+			/>
 		</div>
 		<div class="relative flex flex-col h-[43vh]" data-vaul-drawer-wrapper id="page">
 			<div class="relative overflow-x-auto shadow-md rounded-lg">

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

@@ -57,7 +57,10 @@
 </script>
 
 <template>
-	<div class="px-6 py-3 text-3xl font-bold rounded-lg bg-gray-800/50 shadow-lg border border-gray-700" style="color: {color}">
+	<div
+		class="px-6 py-3 text-3xl font-bold rounded-lg bg-gray-800/50 shadow-lg border border-gray-700"
+		style="color: {color}"
+	>
 		<span class="mr-2">{remainingToday}</span>
 		<span class="text-lg text-gray-400">kcal remaining</span>
 	</div>

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

@@ -1,84 +1,94 @@
 <script lang="ts">
-	import { UpdateFood } from '$wails/main/App';
+	import { UpdateFood } from "$wails/main/App";
-	import {main} from '$wails/models'
+	import { main } from "$wails/models";
-	import { toast } from 'svelte-sonner'
+	import { toast } from "svelte-sonner";
 
-	export let item: main.Food
+	export let item: main.Food;
-	export let energyColor: string
+	export let energyColor: string;
-	export let nameColor: string
+	export let nameColor: string;
-	export let dateColor: string
+	export let dateColor: string;
 
-	let amount: string = item.amount.toString()
+	let amount: string = item.amount.toString();
-	let per100: string = item.per100?.toString() ?? ''
+	let per100: string = item.per100?.toString() ?? "";
-	let description: string = item.description ?? ''
+	let description: string = item.description ?? "";
-	let name: string = item.food
+	let name: string = item.food;
 
-	async function update(event: KeyboardEvent & { currentTarget: (EventTarget & HTMLTableCellElement) }) {
+	async function update(event: KeyboardEvent & { currentTarget: EventTarget & HTMLTableCellElement }) {
-		if (event.key == 'Enter') {
+		if (event.key == "Enter") {
-			event.preventDefault()
+			event.preventDefault();
-			await updateItem()
+			await updateItem();
 		}
 	}
 
 	async function focusOutUpdate() {
-		await updateItem()
+		await updateItem();
 	}
 
 	async function updateItem() {
-		amount = amount.trim()
+		amount = amount.trim();
-		per100 = per100.trim()
+		per100 = per100.trim();
-		description = description.trim()
+		description = description.trim();
-		name = name.trim()
+		name = name.trim();
 
-		item.food = name
+		item.food = name;
-		item.description = description
+		item.description = description;
-		item.amount = parseInt(amount)
+		item.amount = parseInt(amount);
-		item.per100 = parseInt(per100)
+		item.per100 = parseInt(per100);
 
-		const res = await UpdateFood(item)
+		const res = await UpdateFood(item);
 		if (!res.success) {
-			toast.error(`failed to update food item with error ${res.error}`)
+			toast.error(`failed to update food item with error ${res.error}`);
 		} else {
-			item = res.data
+			item = res.data;
 		}
-		name = item.food
+		name = item.food;
-		description = item.description ?? ''
+		description = item.description ?? "";
-		amount = item.amount.toString()
+		amount = item.amount.toString();
-		per100 = item.per100?.toString() ?? ''
+		per100 = item.per100?.toString() ?? "";
 	}
 </script>
 
 <template>
 	<tr class="border-b border-gray-200 dark:border-gray-700 font-bold text-lg">
-		<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+		<th
+			class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
 			style="color: {dateColor}"
-		    scope="row">
+			scope="row"
+		>
 			{item.date}
 		</th>
-		<td class="px-6 py-4"
+		<td
+			class="px-6 py-4"
 			style="color: {nameColor}"
 			contenteditable="true"
 			bind:innerText={name}
 			on:focusout={focusOutUpdate}
-		    on:keydown={update}>
+			on:keydown={update}
+		>
 		</td>
-		<td class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
+		<td
+			class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
 			contenteditable="true"
 			bind:innerText={description}
 			on:focusout={focusOutUpdate}
-		    on:keydown={update}>
+			on:keydown={update}
+		>
 		</td>
-		<td class="px-6 py-4"
+		<td
+			class="px-6 py-4"
 			contenteditable="true"
 			bind:innerText={amount}
 			on:focusout={focusOutUpdate}
-		    on:keydown={update}>
+			on:keydown={update}
+		>
 		</td>
-		<td class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
+		<td
+			class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
 			contenteditable="true"
 			bind:innerText={per100}
 			on:focusout={focusOutUpdate}
-		    on:keydown={update}>
+			on:keydown={update}
+		>
 		</td>
 		<td class="px-6 py-4" style="color: {energyColor}">
 			{item.energy}

frontend/src/lib/components/Settings/Setting.svelte

@@ -18,7 +18,7 @@
 		if (!res.success) {
 			toast.error(`Failed to set setting with error ${res.error}`);
 			editSetting = String(setting);
-			return
+			return;
 		}
 		setting = numSetting;
 		settingsStore.update((store) => {

frontend/src/lib/components/Settings/Settings.svelte

@@ -11,7 +11,7 @@
 
 	<div class="flex flex-2 flex-col gap-4 text-left text-xl">
 		{#each Object.keys($settingsStore) as key}
-			<Setting key={key} setting={$settingsStore[key]} />
+			<Setting {key} setting={$settingsStore[key]} />
 		{/each}
 	</div>
 </Modal>

frontend/src/lib/components/Weight/Aggregated/AggregatedWeightComp.svelte

@@ -1,13 +1,15 @@
 <script lang="ts">
-	import {main} from '$wails/models'
+	import { main } from "$wails/models";
 
-	export let item: main.AggregatedWeight
+	export let item: main.AggregatedWeight;
 </script>
 
 <template>
 	<tr class="border-b border-gray-200 dark:border-gray-700">
-		<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+		<th
-		    scope="row">
+			class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+			scope="row"
+		>
 			{item.period}
 		</th>
 		<td class="px-6 py-4">

frontend/src/lib/components/Weight/Aggregated/AggregatedWeightTable.svelte

@@ -59,49 +59,51 @@
 <template>
 	<div class="flex flex-col gap-6 p-6 bg-gray-900 min-h-screen">
 		<div class="bg-gray-800 rounded-lg p-6 shadow-lg border border-gray-700">
-			<Line {data} 
+			<Line
+				{data}
 				options={{
 					responsive: true,
 					maintainAspectRatio: false,
 					plugins: {
 						legend: {
-							position: 'top',
+							position: "top",
 							labels: {
 								padding: 20,
-								color: 'rgb(229, 231, 235)',
+								color: "rgb(229, 231, 235)",
 								font: {
 									size: 12,
-									family: "'Nunito', sans-serif"
+									family: "'Nunito', sans-serif",
-								}
+								},
-							}
+							},
-						}
+						},
 					},
 					scales: {
 						y: {
 							grid: {
-								color: 'rgba(75, 85, 99, 0.2)'
+								color: "rgba(75, 85, 99, 0.2)",
 							},
 							ticks: {
-								color: 'rgb(229, 231, 235)',
+								color: "rgb(229, 231, 235)",
 								font: {
-									family: "'Nunito', sans-serif"
+									family: "'Nunito', sans-serif",
-								}
+								},
-							}
+							},
 						},
 						x: {
 							grid: {
-								color: 'rgba(75, 85, 99, 0.2)'
+								color: "rgba(75, 85, 99, 0.2)",
 							},
 							ticks: {
-								color: 'rgb(229, 231, 235)',
+								color: "rgb(229, 231, 235)",
 								font: {
-									family: "'Nunito', sans-serif"
+									family: "'Nunito', sans-serif",
-								}
+								},
-							}
+							},
-						}
+						},
-					}
+					},
 				}}
-				class="max-h-[50vh] h-[50vh]" />
+				class="max-h-[50vh] h-[50vh]"
+			/>
 		</div>
 		<div class="relative flex flex-col h-[43vh]" data-vaul-drawer-wrapper id="page">
 			<div class="relative overflow-x-auto shadow-md rounded-lg">

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

@@ -1,34 +1,34 @@
 <script lang="ts">
-	import { toast } from 'svelte-sonner'
+	import { toast } from "svelte-sonner";
 	import { main } from "$wails/models";
-	import { CreateWeight } from '$wails/main/App';
+	import { CreateWeight } from "$wails/main/App";
-	import { weightStore } from '$lib/store/Weight/weightStore';
+	import { weightStore } from "$lib/store/Weight/weightStore";
 
 	let item: main.Weight = {
 		weight: 0,
 		id: 0,
-		date: ''
+		date: "",
-	}
+	};
-	let weight: string | null = null
+	let weight: string | null = null;
 
-	async function update(event: KeyboardEvent & { currentTarget: (EventTarget & HTMLTableCellElement) }) {
+	async function update(event: KeyboardEvent & { currentTarget: EventTarget & HTMLTableCellElement }) {
-		if (!weight) return
+		if (!weight) return;
-		weight = weight.trim()
+		weight = weight.trim();
 
-		if (event.key == 'Enter') {
+		if (event.key == "Enter") {
-			event.preventDefault()
+			event.preventDefault();
-			item.weight = parseFloat(weight)
+			item.weight = parseFloat(weight);
 
 			if (isNaN(item.weight)) {
-				toast.error('Weight must be a number')
+				toast.error("Weight must be a number");
-				return
+				return;
 			}
-			const res = await CreateWeight(item)
+			const res = await CreateWeight(item);
-			weight = ''
+			weight = "";
 
 			if (!res.success) {
-				toast.error(`failed to create weight with error ${res.error}`)
+				toast.error(`failed to create weight with error ${res.error}`);
-				return
+				return;
 			}
 
 			console.log("update");
@@ -39,16 +39,20 @@
 
 <template>
 	<tr class="border-b border-gray-200 dark:border-gray-700 text-lg font-bold">
-		<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+		<th
-		    scope="row">
+			class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+			scope="row"
+		>
 		</th>
-		<td bind:innerText={weight}
+		<td
+			bind:innerText={weight}
 			class:border-[3px]={!weight}
 			class:border-red-600={!weight}
 			class="px-6 py-4 overflow-hidden"
 			contenteditable="true"
 			autofocus
-		    on:keydown={update}>
+			on:keydown={update}
+		>
 		</td>
 	</tr>
 </template>

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

@@ -1,15 +1,17 @@
 <script lang="ts">
 	import { main } from "$wails/models";
 
-	export let item: main.Weight
+	export let item: main.Weight;
-	export let dateColor: string
+	export let dateColor: string;
 </script>
 
 <template>
 	<tr class="border-b border-gray-200 dark:border-gray-700 font-bold text-lg">
-		<th class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
+		<th
+			class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap bg-gray-50 dark:text-white dark:bg-gray-800"
 			style="color: {dateColor}"
-		    scope="row">
+			scope="row"
+		>
 			{item.date}
 		</th>
 		<td class="px-6 py-4">

frontend/src/lib/router/Router.svelte

@@ -1,29 +1,29 @@
 <script lang="ts">
-	import Router from 'svelte-spa-router'
+	import Router from "svelte-spa-router";
-	import Energy from './routes/Energy/Energy.svelte'
+	import Energy from "./routes/Energy/Energy.svelte";
-	import Daily from './routes/Energy/Daily.svelte'
+	import Daily from "./routes/Energy/Daily.svelte";
-	import Weekly from './routes/Energy/Weekly.svelte'
+	import Weekly from "./routes/Energy/Weekly.svelte";
-	import Monthly from './routes/Energy/Monthly.svelte'
+	import Monthly from "./routes/Energy/Monthly.svelte";
-	import Yearly from './routes/Energy/Yearly.svelte'
+	import Yearly from "./routes/Energy/Yearly.svelte";
-	import Weight from './routes/Weight/Weight.svelte'
+	import Weight from "./routes/Weight/Weight.svelte";
-	import WDaily from './routes/Weight/WDaily.svelte'
+	import WDaily from "./routes/Weight/WDaily.svelte";
-	import WWeekly from './routes/Weight/WWeekly.svelte'
+	import WWeekly from "./routes/Weight/WWeekly.svelte";
-	import WMonthly from './routes/Weight/WMonthly.svelte'
+	import WMonthly from "./routes/Weight/WMonthly.svelte";
-	import WYearly from './routes/Weight/WYearly.svelte'
+	import WYearly from "./routes/Weight/WYearly.svelte";
 
 	const routes = {
-		'/': Energy,
+		"/": Energy,
-		'/Energy': Energy,
+		"/Energy": Energy,
-		'/Energy/daily': Daily,
+		"/Energy/daily": Daily,
-		'/Energy/weekly': Weekly,
+		"/Energy/weekly": Weekly,
-		'/Energy/monthly': Monthly,
+		"/Energy/monthly": Monthly,
-		'/Energy/yearly': Yearly,
+		"/Energy/yearly": Yearly,
-		'/Weight': Weight,
+		"/Weight": Weight,
-		'/Weight/daily': WDaily,
+		"/Weight/daily": WDaily,
-		'/Weight/weekly': WWeekly,
+		"/Weight/weekly": WWeekly,
-		'/Weight/monthly': WMonthly,
+		"/Weight/monthly": WMonthly,
-		'/Weight/yearly': WYearly
+		"/Weight/yearly": WYearly,
-	}
+	};
 </script>
 
 <Router {routes} />

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

@@ -1,8 +1,8 @@
 <script lang="ts">
-	import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
+	import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
-	import { dailyWeightStore } from '$lib/store/Weight/dailyWeightStore'
+	import { dailyWeightStore } from "$lib/store/Weight/dailyWeightStore";
 </script>
 
 <template>
-	<AggregatedWeightTable items="{$dailyWeightStore}" />
+	<AggregatedWeightTable items={$dailyWeightStore} />
 </template>

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

@@ -1,8 +1,8 @@
 <script lang="ts">
-	import { monthlyWeightStore } from '$lib/store/Weight/monthlyWeightStore'
+	import { monthlyWeightStore } from "$lib/store/Weight/monthlyWeightStore";
-	import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
+	import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
 </script>
 
 <template>
-	<AggregatedWeightTable items="{$monthlyWeightStore}" />
+	<AggregatedWeightTable items={$monthlyWeightStore} />
 </template>

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

@@ -1,8 +1,8 @@
 <script lang="ts">
-	import { weeklyWeightStore } from '$lib/store/Weight/weeklyWeightStore'
+	import { weeklyWeightStore } from "$lib/store/Weight/weeklyWeightStore";
-	import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
+	import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
 </script>
 
 <template>
-	<AggregatedWeightTable items="{$weeklyWeightStore}" />
+	<AggregatedWeightTable items={$weeklyWeightStore} />
 </template>

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

@@ -1,8 +1,8 @@
 <script lang="ts">
-	import AggregatedWeightTable from '$components/Weight/Aggregated/AggregatedWeightTable.svelte'
+	import AggregatedWeightTable from "$components/Weight/Aggregated/AggregatedWeightTable.svelte";
-	import { yearlyWeightStore } from '$lib/store/Weight/yearlyWeightStore'
+	import { yearlyWeightStore } from "$lib/store/Weight/yearlyWeightStore";
 </script>
 
 <template>
-	<AggregatedWeightTable items="{$yearlyWeightStore}" />
+	<AggregatedWeightTable items={$yearlyWeightStore} />
 </template>

frontend/src/lib/utils.ts

@@ -1,7 +1,6 @@
 import { cubicOut } from "svelte/easing";
 import type { TransitionConfig } from "svelte/transition";
 import regression from "regression";
-import type { ChartData, Point } from "chart.js";
 
 type FlyAndScaleParams = {
 	y?: number;

frontend/src/main.ts

@@ -1,8 +1,8 @@
-import './style.css'
+import "./style.css";
-import App from './App.svelte'
+import App from "./App.svelte";
 
 const app = new App({
-  target: document.getElementById('app')
+	target: document.getElementById("app"),
-})
+});
 
-export default app
+export default app;

frontend/src/style.css

@@ -11,17 +11,15 @@ html {
 body {
 	margin: 0;
 	color: white;
-    font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
+	font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell",
-    "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
+		"Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-    sans-serif;
 }
 
 @font-face {
 	font-family: "Nunito";
 	font-style: normal;
 	font-weight: 400;
-    src: local(""),
+	src: local(""), url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
-    url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
 }
 
 #app {