Files
calcount/frontend/src/App.svelte
T
2026-07-26 11:16:10 +01:00

40 lines
939 B
Svelte

<script>
import { onMount } from 'svelte'
import { api } from './lib/api.js'
import { currentDate } from './lib/stores.svelte.js'
import Dashboard from './components/Dashboard.svelte'
// Every async view handles loading / error / empty states (spec §8.2 rule 4)
let backend = $state({ loading: true, ok: false, error: null })
onMount(async () => {
try {
await api.health()
backend = { loading: false, ok: true, error: null }
} catch (e) {
backend = { loading: false, ok: false, error: e.message }
}
})
</script>
<main>
<h1>CalCount</h1>
{#if backend.loading}
<p>Connecting to backend…</p>
{:else if backend.error}
<p role="alert">Backend unreachable: {backend.error}</p>
{:else}
<Dashboard date={currentDate.value} />
{/if}
</main>
<style>
main {
max-width: 32rem;
margin: 0 auto;
padding: 1rem;
font-family: system-ui, sans-serif;
}
</style>