41 lines
1.7 KiB
JavaScript
41 lines
1.7 KiB
JavaScript
import { html } from 'htm/preact'
|
|
import { useState } from 'preact/hooks'
|
|
import { ConnectionPage } from '#tofu/components/pages/ConnectionPage.js'
|
|
import { PlanningPage } from '#tofu/components/pages/PlanningPage.js'
|
|
import { RECIPE_INDEX_FIXTURE } from '#tofu/const/RECIPE_INDEX_FIXTURE.js'
|
|
import { createMemoryPlanningStore } from '#tofu/services/planning/createMemoryPlanningStore.js'
|
|
import { createPlanningStore } from '#tofu/services/planning/createPlanningStore.js'
|
|
import { createStaticRecipeSource } from '#tofu/services/recipes/createStaticRecipeSource.js'
|
|
|
|
// Built once: the source is stateless and shared by every session.
|
|
const RECIPE_SOURCE = createStaticRecipeSource(RECIPE_INDEX_FIXTURE)
|
|
|
|
// Owns the session: which store the planning page reads and writes.
|
|
export function App() {
|
|
const [store, setStore] = useState(null)
|
|
|
|
// Two implementations of one contract, so the page never tests for a client.
|
|
function openSession({ client, folder }) {
|
|
setStore(client ? createPlanningStore(client, folder) : createMemoryPlanningStore())
|
|
}
|
|
|
|
function closeSession() {
|
|
setStore(null)
|
|
}
|
|
|
|
if (store === null) return html`<${ConnectionPage} onReady=${openSession} />`
|
|
|
|
// The sheet comes first: the page opens on the week, not on its plumbing.
|
|
// Where it is stored is a footnote, so it reads as one, at the bottom.
|
|
return html`
|
|
<div class="app">
|
|
<${PlanningPage} store=${store} recipeSource=${RECIPE_SOURCE} />
|
|
<div class="app-session">
|
|
<p class="app-session-label">${store.describeStorage().label}</p>
|
|
<button type="button" class="button button--quiet" onClick=${closeSession}>
|
|
Changer de connexion
|
|
</button>
|
|
</div>
|
|
</div>
|
|
`
|
|
}
|