dave/calorie-tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Code format

Browse Source
This commit is contained in:
David Majdandžić
2024-06-12 10:11:01 +02:00
parent 5b28ea62b1
commit 41b77d8c98
13 changed files with 163 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/lib/components/AggregatedFood/AggregatedFoodComp.svelte Normal file
View File

@@ -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>

16
src/lib/components/AggregatedFood/AggregatedFoodTable.svelte
View File

@@ -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>

12
src/lib/components/EmptyFoodComp.svelte
View File

@@ -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>

4
src/lib/components/Food/FoodComp.svelte
View File

@@ -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">

12
src/lib/components/Food/FoodTable.svelte
View File

@@ -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>

20
src/lib/components/Header.svelte
View File

@@ -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>

24
src/lib/components/IPC/CallTauri.svelte
View File

@@ -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>

38
src/lib/components/IPC/HashString.svelte
View File

@@ -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>

94
src/lib/components/IPC/KeyValuePair.svelte
View File

@@ -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>

25
src/lib/database/food.ts
View File

@@ -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 }

18
src/lib/ipc.ts
View File

@@ -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 })
}

8
src/lib/router/routes/Daily.svelte
View File

@@ -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>

2
src/lib/router/routes/Home.svelte
View File

@@ -4,5 +4,5 @@
</script>
<template>
<FoodTable items="{$foodStore}" create="true" />
<FoodTable create="true" items="{$foodStore}" />
</template>