client: fix reset-error handling, undersized qty buttons, chart resize,

dedupe j()/errText(), stale-fetch guard, empty bar-picker state

Six small, mostly-unrelated items from the #47 review round (#57):

1. 'Statistik zurücksetzen' now checks res.ok and shows the server's
   error instead of silently re-rendering the un-reset data on a 401/500
   with no indication anything went wrong.
2. DayChart now tracks its container width via ResizeObserver and calls
   uPlot's setSize() on change — previously read once at plot-creation
   time, so a resize/orientation-change (more visible on the phone/
   tablet path into /stats) left the chart the wrong width.
3. .qty-btn (cart +/- buttons) grown from 28x28px to 44x44px, the
   conventional minimum touch target — was the one conspicuously small
   interactive control in the money path, at a fast-moving bar counter.
4. Tablet's bar-config fetch (App.tsx) now guards against an
   out-of-order resolution if barId changes again while a previous
   api.config() call is still in flight. Currently unreachable (nothing
   triggers a second barId change mid-fetch today) but closes the gap
   before the next 'add a cancel button to the loading screen' change
   could make it live.
5. j()/errText() were duplicated byte-for-byte between Admin.tsx and
   Stats.tsx (Admin.tsx's own comment noted this exact duplication had
   already caused drift once before) — centralized in api.ts, both files
   now import instead of redeclaring.
6. Tablet's bar picker now shows an explicit empty-state message when
   zero bars exist (fresh install, or every bar deleted), previously
   indistinguishable from 'still loading'.

Closes #57. Verified: tsc --noEmit and vite build both clean.
This commit is contained in:
iris 2026-07-31 11:17:08 +02:00 committed by mara
commit 7a58a4a1bb
7 changed files with 64 additions and 44 deletions

View file

@ -24,7 +24,17 @@ export function App() {
useEffect(() => {
if (barId == null) return;
setConfig(null);
api.config(barId).then(setConfig).catch(e => setError(String(e)));
// Guards against an out-of-order resolution if barId changes again
// while this fetch is still in flight (e.g. a future "cancel loading"
// control) — currently unreachable since nothing triggers a second
// barId change mid-fetch today, but cheap to close now rather than
// leave as a defensive gap the next loading-screen change could make
// live.
let cancelled = false;
api.config(barId)
.then(c => { if (!cancelled) setConfig(c); })
.catch(e => { if (!cancelled) setError(String(e)); });
return () => { cancelled = true; };
}, [barId]);
function pick(id: number) {

View file

@ -21,6 +21,10 @@ export function BarPicker({ bars, onPick }: Props) {
<h1>Bar auswählen</h1>
{bars == null ? (
<p>Lade</p>
) : bars.length === 0 ? (
// A fresh install (or every bar deleted) otherwise renders nothing
// but the header here — indistinguishable from "still loading".
<p class="muted">Keine Bars angelegt bitte im Backoffice anlegen.</p>
) : (
bars.map(b => (
<button key={b.id} onClick={() => onPick(b.id)}>