45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
import { useEffect, useState } from 'preact/hooks';
|
|
import type { Bar, BarConfig } from '@wutzcalc/shared';
|
|
import { api } from '../api';
|
|
import { BarPicker } from './BarPicker';
|
|
import { Sale } from './Sale';
|
|
|
|
const STORAGE_KEY = 'wutz.bar_id';
|
|
|
|
export function App() {
|
|
const [bars, setBars] = useState<Bar[] | null>(null);
|
|
const [barId, setBarId] = useState<number | null>(() => {
|
|
const v = localStorage.getItem(STORAGE_KEY);
|
|
return v ? Number(v) : null;
|
|
});
|
|
const [config, setConfig] = useState<BarConfig | null>(null);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
if (barId == null) {
|
|
api.bars().then(setBars).catch(e => setError(String(e)));
|
|
}
|
|
}, [barId]);
|
|
|
|
useEffect(() => {
|
|
if (barId == null) return;
|
|
setConfig(null);
|
|
api.config(barId).then(setConfig).catch(e => setError(String(e)));
|
|
}, [barId]);
|
|
|
|
function pick(id: number) {
|
|
localStorage.setItem(STORAGE_KEY, String(id));
|
|
setBarId(id);
|
|
}
|
|
|
|
function changeBar() {
|
|
localStorage.removeItem(STORAGE_KEY);
|
|
setBarId(null);
|
|
setConfig(null);
|
|
}
|
|
|
|
if (error) return <div class="bar-picker"><h1>Fehler</h1><p>{error}</p><button onClick={() => location.reload()}>Neu laden</button></div>;
|
|
if (barId == null) return <BarPicker bars={bars} onPick={pick} />;
|
|
if (!config) return <div class="bar-picker"><p>Lade…</p></div>;
|
|
return <Sale config={config} onChangeBar={changeBar} />;
|
|
}
|