40 lines
939 B
Svelte
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>
|