From 41b77d8c98762e17e4894ffe6eedd5c7bac29f9f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20Majdand=C5=BEi=C4=87?=
 <david.majdandzic@hotmail.com>
Date: Wed, 12 Jun 2024 10:11:01 +0200
Subject: [PATCH] Code format

---
 .../AggregatedFood/AggregatedFoodComp.svelte  | 23 +++++
 .../AggregatedFood/AggregatedFoodTable.svelte | 16 ++--
 src/lib/components/EmptyFoodComp.svelte       | 12 +--
 src/lib/components/Food/FoodComp.svelte       |  4 +-
 src/lib/components/Food/FoodTable.svelte      | 12 +--
 src/lib/components/Header.svelte              | 20 ++--
 src/lib/components/IPC/CallTauri.svelte       | 24 ++---
 src/lib/components/IPC/HashString.svelte      | 38 ++++----
 src/lib/components/IPC/KeyValuePair.svelte    | 94 +++++++++----------
 src/lib/database/food.ts                      | 25 +++--
 src/lib/ipc.ts                                | 18 ++--
 src/lib/router/routes/Daily.svelte            |  8 +-
 src/lib/router/routes/Home.svelte             |  2 +-
 13 files changed, 163 insertions(+), 133 deletions(-)
 create mode 100644 src/lib/components/AggregatedFood/AggregatedFoodComp.svelte

diff --git a/src/lib/components/AggregatedFood/AggregatedFoodComp.svelte b/src/lib/components/AggregatedFood/AggregatedFoodComp.svelte
new file mode 100644
index 0000000..6fcbd72
--- /dev/null
+++ b/src/lib/components/AggregatedFood/AggregatedFoodComp.svelte
@@ -0,0 +1,23 @@
+<script lang="ts">
+	import type { AggregatedFood } from '$lib/database/food'
+
+	export let item: 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"
+		    scope="row">
+			{item.date}
+		</th>
+		<td class="px-6 py-4">
+			{item.amount}
+		</td>
+		<td class="px-6 py-4 bg-gray-50 dark:bg-gray-800">
+			{item.avgPer100}
+		</td>
+		<td class="px-6 py-4">
+			{item.energy}
+		</td>
+	</tr>
+</template>
diff --git a/src/lib/components/AggregatedFood/AggregatedFoodTable.svelte b/src/lib/components/AggregatedFood/AggregatedFoodTable.svelte
index 8afce5e..e8a36d0 100644
--- a/src/lib/components/AggregatedFood/AggregatedFoodTable.svelte
+++ b/src/lib/components/AggregatedFood/AggregatedFoodTable.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
 
-	import FoodComp from '$components/Food/FoodComp.svelte'
-	import type { Food } from '$lib/database/food'
+	import type { AggregatedFood } from '$lib/database/food'
+	import AggregatedFoodComp from '$components/AggregatedFood/AggregatedFoodComp.svelte'
 
-	export let items: Food[] = []
+	export let items: AggregatedFood[] = []
 </script>
 
 <template>
@@ -12,23 +12,23 @@
 			<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 scope="col" class="px-6 py-3 bg-gray-50 dark:bg-gray-800">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
 						Period
 					</th>
-					<th scope="col" class="px-6 py-3">
+					<th class="px-6 py-3" scope="col">
 						Amount
 					</th>
-					<th scope="col" class="px-6 py-3 bg-gray-50 dark:bg-gray-800">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
 						AvgPer100
 					</th>
-					<th scope="col" class="px-6 py-3">
+					<th class="px-6 py-3" scope="col">
 						Energy
 					</th>
 				</tr>
 				</thead>
 				<tbody>
 				{#each items as f}
-					<FoodComp item="{f}" />
+					<AggregatedFoodComp item="{f}" />
 				{/each}
 				</tbody>
 			</table>
diff --git a/src/lib/components/EmptyFoodComp.svelte b/src/lib/components/EmptyFoodComp.svelte
index 055514c..36b269d 100644
--- a/src/lib/components/EmptyFoodComp.svelte
+++ b/src/lib/components/EmptyFoodComp.svelte
@@ -45,18 +45,18 @@
 		<th 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 class="px-6 py-4"
-		    bind:innerText={name}
+		<td bind:innerText={name}
+		    class="px-6 py-4"
 		    contenteditable="true"
 		    on:keyup={update}>
 		</td>
-		<td class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
-		    bind:innerText={description}
+		<td bind:innerText={description}
+		    class="px-6 py-4 bg-gray-50 dark:bg-gray-800"
 		    contenteditable="true"
 		    on:keyup={update}>
 		</td>
-		<td class="px-6 py-4"
-		    bind:innerText={amount}
+		<td bind:innerText={amount}
+		    class="px-6 py-4"
 		    contenteditable="true"
 		    on:keyup={update}>
 		</td>
diff --git a/src/lib/components/Food/FoodComp.svelte b/src/lib/components/Food/FoodComp.svelte
index b95de89..a64458f 100644
--- a/src/lib/components/Food/FoodComp.svelte
+++ b/src/lib/components/Food/FoodComp.svelte
@@ -8,8 +8,8 @@
 
 <template>
 	<tr class="border-b border-gray-200 dark:border-gray-700">
-		<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">
+		<th 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.date}
 		</th>
 		<td class="px-6 py-4">
diff --git a/src/lib/components/Food/FoodTable.svelte b/src/lib/components/Food/FoodTable.svelte
index b4aee71..aa52462 100644
--- a/src/lib/components/Food/FoodTable.svelte
+++ b/src/lib/components/Food/FoodTable.svelte
@@ -13,22 +13,22 @@
 			<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 scope="col" class="px-6 py-3 bg-gray-50 dark:bg-gray-800">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
 						Date
 					</th>
-					<th scope="col" class="px-6 py-3">
+					<th class="px-6 py-3" scope="col">
 						Food
 					</th>
-					<th scope="col" class="px-6 py-3 bg-gray-50 dark:bg-gray-800">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
 						Description
 					</th>
-					<th scope="col" class="px-6 py-3">
+					<th class="px-6 py-3" scope="col">
 						Amount
 					</th>
-					<th scope="col" class="px-6 py-3 bg-gray-50 dark:bg-gray-800">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
 						Cal Per 100
 					</th>
-					<th scope="col" class="px-6 py-3">
+					<th class="px-6 py-3" scope="col">
 						Energy
 					</th>
 				</tr>
diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte
index 90cab29..df3a3f7 100644
--- a/src/lib/components/Header.svelte
+++ b/src/lib/components/Header.svelte
@@ -31,11 +31,11 @@
 </script>
 
 <header
-	data-tauri-drag-region
 	class="flex h-14 items-center justify-between bg-base-100 shadow-lg sticky top-0 z-50 border-b
    border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60"
+	data-tauri-drag-region
 >
-	<Button on:click={toggleMode} size="icon" variant="outline" class="ml-2">
+	<Button class="ml-2" on:click={toggleMode} size="icon" variant="outline">
 		<Sun
 			class="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0"
 		/>
@@ -49,11 +49,11 @@
 		class="flex space-x-4 text-xl font-bold select-none"
 		on:dragstart|preventDefault
 	>
-		<div class:text-amber-500="{$dbStateStore.transacting}" on:click={DBService.Begin} class="cursor-pointer">T
+		<div class="cursor-pointer" class:text-amber-500="{$dbStateStore.transacting}" on:click={DBService.Begin}>T
 		</div>
-		<div class:text-emerald-600={$dbStateStore.transacting} on:click={DBService.Commit} class="cursor-pointer">C
+		<div class="cursor-pointer" class:text-emerald-600={$dbStateStore.transacting} on:click={DBService.Commit}>C
 		</div>
-		<div class:text-red-700={$dbStateStore.transacting} on:click={DBService.Rollback} class="cursor-pointer">R</div>
+		<div class="cursor-pointer" class:text-red-700={$dbStateStore.transacting} on:click={DBService.Rollback}>R</div>
 		{#each links as { href, label }}
 			<a
 				use:link
@@ -68,18 +68,18 @@
 
 	<div class="flex h-full [&>*]:px-2 [&>*]:transition-all">
 		<a
-			on:dragstart|preventDefault
-			target="_blank"
-			href="https://github.com/Fractal-Tess/Svelte-Tauri"
 			class="flex items-center hover:text-secondary"
+			href="https://github.com/Fractal-Tess/Svelte-Tauri"
+			on:dragstart|preventDefault
 			rel="noreferrer noopener"
+			target="_blank"
 		>
 			<Fa icon={faGithub} size="lg" />
 		</a>
-		<button on:click={appWindow.minimize} class="text-xl hover:text-secondary">
+		<button class="text-xl hover:text-secondary" on:click={appWindow.minimize}>
 			<Fa icon={faWindowMinimize} />
 		</button>
-		<button on:click={appWindow.close} class="text-2xl hover:text-secondary">
+		<button class="text-2xl hover:text-secondary" on:click={appWindow.close}>
 			<Fa icon={faXmark} />
 		</button>
 	</div>
diff --git a/src/lib/components/IPC/CallTauri.svelte b/src/lib/components/IPC/CallTauri.svelte
index 302fcbf..1561356 100644
--- a/src/lib/components/IPC/CallTauri.svelte
+++ b/src/lib/components/IPC/CallTauri.svelte
@@ -1,23 +1,25 @@
 <script lang="ts">
-  import { Button } from '$components/ui/button'
-  import { helloTauri } from '$lib/ipc'
-  import { cn } from '$lib/utils'
+	import { Button } from '$components/ui/button'
+	import { helloTauri } from '$lib/ipc'
+	import { cn } from '$lib/utils'
 
-  let message = ''
-  async function callTauri() {
-    message = await helloTauri()
-  }
+	let message = ''
+
+	async function callTauri() {
+		message = await helloTauri()
+	}
 </script>
 
-<Button variant="outline" class="px-8 py-6" on:click={callTauri}
-  >Call Tauri</Button
+<Button class="px-8 py-6" on:click={callTauri} variant="outline"
+>Call Tauri
+</Button
 >
 
 <p
-  class={cn(
+	class={cn(
     'text-2xl font-bold border-b-2 border-border transition-opacity min-h-10 duration-500',
     message ? 'opacity-100' : 'opacity-0'
   )}
 >
-  {message}
+	{message}
 </p>
diff --git a/src/lib/components/IPC/HashString.svelte b/src/lib/components/IPC/HashString.svelte
index abd7b59..0497dce 100644
--- a/src/lib/components/IPC/HashString.svelte
+++ b/src/lib/components/IPC/HashString.svelte
@@ -1,27 +1,27 @@
 <script lang="ts">
-  import { Input } from '$components/ui/input'
-  import { Label } from '$components/ui/label'
-  import { hash256sum } from '$lib/ipc'
+	import { Input } from '$components/ui/input'
+	import { Label } from '$components/ui/label'
+	import { hash256sum } from '$lib/ipc'
 
-  let hashInput = 'String to hash'
-  let hashOutput = ''
+	let hashInput = 'String to hash'
+	let hashOutput = ''
 
-  $: hash256sum(hashInput).then(hash => (hashOutput = hash))
+	$: hash256sum(hashInput).then(hash => (hashOutput = hash))
 </script>
 
 <section class="flex items-center justify-center flex-col gap-8">
-  <div class="flex flex-col w-full max-w-sm gap-1.5">
-    <Label for="hash">Hash string</Label>
-    <Input
-      placeholder="String to hash"
-      id="hash"
-      bind:value={hashInput}
-      type="text"
-      class="input-bordered input-secondary input focus:border-secondary
+	<div class="flex flex-col w-full max-w-sm gap-1.5">
+		<Label for="hash">Hash string</Label>
+		<Input
+			bind:value={hashInput}
+			class="input-bordered input-secondary input focus:border-secondary
     focus:outline-none focus:ring-secondary"
-    />
-  </div>
-  <code class="border border-border rounded-md px-2 py-1 text-sm"
-    >{hashOutput}</code
-  >
+			id="hash"
+			placeholder="String to hash"
+			type="text"
+		/>
+	</div>
+	<code class="border border-border rounded-md px-2 py-1 text-sm"
+	>{hashOutput}</code
+	>
 </section>
diff --git a/src/lib/components/IPC/KeyValuePair.svelte b/src/lib/components/IPC/KeyValuePair.svelte
index e748ae4..42a3644 100644
--- a/src/lib/components/IPC/KeyValuePair.svelte
+++ b/src/lib/components/IPC/KeyValuePair.svelte
@@ -1,56 +1,56 @@
 <script lang="ts">
-  import { storeReadKey, storeSetKey } from '$lib/ipc'
-  import { Input } from '$components/ui/input'
-  import { Label } from '$components/ui/label'
-  import { Button } from '$components/ui/button'
-  import { toast } from 'svelte-sonner'
+	import { storeReadKey, storeSetKey } from '$lib/ipc'
+	import { Input } from '$components/ui/input'
+	import { Label } from '$components/ui/label'
+	import { Button } from '$components/ui/button'
+	import { toast } from 'svelte-sonner'
 
-  let key = ''
-  let val = ''
+	let key = ''
+	let val = ''
 
-  async function setValueWithKey() {
-    await storeSetKey(key, val)
-    let id = (Math.random() + 1).toString(36).substring(16)
-    toast(`You have set the key '${key}' to be the value of '${val}'`, {
-      id,
-      action: {
-        label: 'X',
-        onClick: () => {
-          toast.dismiss(id)
-        }
-      }
-    })
-  }
+	async function setValueWithKey() {
+		await storeSetKey(key, val)
+		let id = (Math.random() + 1).toString(36).substring(16)
+		toast(`You have set the key '${key}' to be the value of '${val}'`, {
+			id,
+			action: {
+				label: 'X',
+				onClick: () => {
+					toast.dismiss(id)
+				}
+			}
+		})
+	}
 
-  async function readValFromKey() {
-    const val = await storeReadKey(key)
-    let id = (Math.random() + 1).toString(36).substring(16)
-    toast(`You have read the key '${key}' to be the value of '${val}'`, {
-      id,
-      action: {
-        label: 'X',
-        onClick: () => {
-          toast.dismiss(id)
-        }
-      }
-    })
-  }
+	async function readValFromKey() {
+		const val = await storeReadKey(key)
+		let id = (Math.random() + 1).toString(36).substring(16)
+		toast(`You have read the key '${key}' to be the value of '${val}'`, {
+			id,
+			action: {
+				label: 'X',
+				onClick: () => {
+					toast.dismiss(id)
+				}
+			}
+		})
+	}
 </script>
 
 <div class="flex flex-col gap-4 items-center justify-center">
-  <div class="flex gap-4">
-    <div class="flex-1 flex-col gap-y-2 flex">
-      <Label for="key">Key</Label>
-      <Input id="key" bind:value={key} />
-    </div>
+	<div class="flex gap-4">
+		<div class="flex-1 flex-col gap-y-2 flex">
+			<Label for="key">Key</Label>
+			<Input bind:value={key} id="key" />
+		</div>
 
-    <div class="flex-1 flex-col gap-y-2 flex">
-      <Label for="val">Value</Label>
-      <Input id="val" bind:value={val} />
-    </div>
-  </div>
-  <div class="flex w-full gap-4">
-    <Button class="w-full bg-primary" on:click={setValueWithKey}>Set</Button>
-    <Button class="w-full" on:click={readValFromKey}>Read</Button>
-  </div>
+		<div class="flex-1 flex-col gap-y-2 flex">
+			<Label for="val">Value</Label>
+			<Input bind:value={val} id="val" />
+		</div>
+	</div>
+	<div class="flex w-full gap-4">
+		<Button class="w-full bg-primary" on:click={setValueWithKey}>Set</Button>
+		<Button class="w-full" on:click={readValFromKey}>Read</Button>
+	</div>
 </div>
diff --git a/src/lib/database/food.ts b/src/lib/database/food.ts
index 322c7a9..3e6c896 100644
--- a/src/lib/database/food.ts
+++ b/src/lib/database/food.ts
@@ -11,6 +11,13 @@ export type Food = {
 	energy?: number,
 }
 
+export type AggregatedFood = {
+	date: Date,
+	amount: number,
+	avgPer100: number,
+	energy: number,
+}
+
 const columns = ['rowid', 'date', 'food', 'description', 'amount', 'per100', 'energy']
 const aggColumns = ['date', 'amount', 'avgPer100', 'energy']
 
@@ -40,22 +47,22 @@ order by date DESC;
 
 		return [row, null]
 	},
-	async GetDaily(): Promise<[Food[], Err]> {
-		const rows = await db.select<Food[]>(`select ${aggColumns.join(', ')} from daily limit 100`)
+	async GetDaily(): Promise<[AggregatedFood[], Err]> {
+		const rows = await db.select<AggregatedFood[]>(`select ${aggColumns.join(', ')} from daily limit 100`)
 		return [rows, null]
 	},
-	async GetWeekly(): Promise<[Food[], Err]> {
-		const rows = await db.select<Food[]>(`select ${aggColumns.join(', ')} from weekly limit 100`)
+	async GetWeekly(): Promise<[AggregatedFood[], Err]> {
+		const rows = await db.select<AggregatedFood[]>(`select ${aggColumns.join(', ')} from weekly limit 100`)
 		return [rows, null]
 	},
-	async GetMonthly(): Promise<[Food[], Err]> {
-		const rows = await db.select<Food[]>(`select ${aggColumns.join(', ')} from monthly limit 100`)
+	async GetMonthly(): Promise<[AggregatedFood[], Err]> {
+		const rows = await db.select<AggregatedFood[]>(`select ${aggColumns.join(', ')} from monthly limit 100`)
 		return [rows, null]
 	},
-	async GetYearly(): Promise<[Food[], Err]> {
-		const rows = await db.select<Food[]>(`select ${aggColumns.join(', ')} from yearly limit 100`)
+	async GetYearly(): Promise<[AggregatedFood[], Err]> {
+		const rows = await db.select<AggregatedFood[]>(`select ${aggColumns.join(', ')} from yearly limit 100`)
 		return [rows, null]
-	},
+	}
 }
 
 export { FoodService }
diff --git a/src/lib/ipc.ts b/src/lib/ipc.ts
index 3796316..c6dbde9 100644
--- a/src/lib/ipc.ts
+++ b/src/lib/ipc.ts
@@ -2,28 +2,26 @@
 // This file was generated by [tauri-specta](https://github.com/oscartbeaumont/tauri-specta). Do not edit this file manually.
 
 declare global {
-    interface Window {
-        __TAURI_INVOKE__<T>(cmd: string, args?: Record<string, unknown>): Promise<T>;
-    }
+	interface Window {
+		__TAURI_INVOKE__<T>(cmd: string, args?: Record<string, unknown>): Promise<T>;
+	}
 }
 
 // Function avoids 'window not defined' in SSR
-const invoke = () => window.__TAURI_INVOKE__;
+const invoke = () => window.__TAURI_INVOKE__
 
 export function helloTauri() {
-    return invoke()<string>("hello_tauri")
+	return invoke()<string>('hello_tauri')
 }
 
 export function hash256sum(hashInput: string) {
-    return invoke()<string>("hash256sum", { hashInput })
+	return invoke()<string>('hash256sum', { hashInput })
 }
 
 export function storeSetKey(key: string, value: string) {
-    return invoke()<null>("store_set_key", { key,value })
+	return invoke()<null>('store_set_key', { key, value })
 }
 
 export function storeReadKey(key: string) {
-    return invoke()<string | null>("store_read_key", { key })
+	return invoke()<string | null>('store_read_key', { key })
 }
-
-
diff --git a/src/lib/router/routes/Daily.svelte b/src/lib/router/routes/Daily.svelte
index cd0dc45..95e11df 100644
--- a/src/lib/router/routes/Daily.svelte
+++ b/src/lib/router/routes/Daily.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
-	import { type Food, FoodService } from '$lib/database/food'
+	import { type AggregatedFood, FoodService } from '$lib/database/food'
 	import { onMount } from 'svelte'
-	import FoodTable from '$components/Food/FoodTable.svelte'
+	import AggregatedFoodTable from '$components/AggregatedFood/AggregatedFoodTable.svelte'
 
-	let foods: Food[] = []
+	let foods: AggregatedFood[] = []
 	onMount(async () => {
 		const [dbfoods, err] = await FoodService.GetDaily()
 		if (err) {
@@ -15,5 +15,5 @@
 </script>
 
 <template>
-	<FoodTable items="{foods}"/>
+	<AggregatedFoodTable items="{foods}" />
 </template>
diff --git a/src/lib/router/routes/Home.svelte b/src/lib/router/routes/Home.svelte
index d0c7e7d..cf09ef3 100644
--- a/src/lib/router/routes/Home.svelte
+++ b/src/lib/router/routes/Home.svelte
@@ -4,5 +4,5 @@
 </script>
 
 <template>
-	<FoodTable items="{$foodStore}" create="true" />
+	<FoodTable create="true" items="{$foodStore}" />
 </template>