fix(frontend): "Scan a receipt" button does nothing on Landing #73

New issue

Closed

opened 2026-07-06 22:10:54 +01:00 by TimCane · 0 comments

TimCane commented

2026-07-06 22:10:54 +01:00

(Migrated from github.com)

Summary

On the Landing page, the Scan a receipt button is inert - clicking it does nothing.
frontend/src/routes/Landing.tsx:18 renders a bare <Button size="lg">Scan a receipt</Button> with no onClick or link. It is still the M1 placeholder.
The whole frontend capture/upload flow was never wired up, though the backend and spec for it exist:
- Backend POST /api/v1/sessions (multipart image) is implemented - SessionsController.Create (M2).
- Flow is fully specified in docs/09-ux-flows.md#1-landing--capture and docs/08-frontend-design.md#uploads.
Missing pieces on the frontend:
- No createSession(...) in frontend/src/lib/api/client.ts (and no CreateSessionResponse schema in schemas.ts).
- No lib/image.ts preprocess(file) (downscale to 2000px longest edge, re-encode JPEG 0.85, strip EXIF).
- No file input (accept="image/*" capture="environment"), no photo preview (Use photo / Retake), no upload progress bar, no identity store + navigate to /s/:id.

Impact

A host cannot start a split at all from the UI - the primary entry point is dead.

Expected (per docs/09-ux-flows.md)

Tap Scan a receipt -> file picker (accept="image/*" capture="environment").
Preview screen: photo with Use photo / Retake.
Use photo -> client preprocess -> multipart upload with progress bar (XHR).
Store the returned host token via storeIdentity, navigate to /s/:sessionId (lands on Processing).
Errors: upload error stays on page with a message; 429 rate-limited -> "Too many sessions from this network - try again in a few minutes."

Repro

Run the frontend, open /.
Click Scan a receipt.
Nothing happens (no file dialog, no navigation, no network request).

## Summary - On the Landing page, the **Scan a receipt** button is inert - clicking it does nothing. - `frontend/src/routes/Landing.tsx:18` renders a bare `<Button size="lg">Scan a receipt</Button>` with no `onClick` or link. It is still the M1 placeholder. - The whole frontend capture/upload flow was never wired up, though the backend and spec for it exist: - Backend `POST /api/v1/sessions` (multipart `image`) is implemented - `SessionsController.Create` (M2). - Flow is fully specified in `docs/09-ux-flows.md#1-landing--capture` and `docs/08-frontend-design.md#uploads`. - Missing pieces on the frontend: - No `createSession(...)` in `frontend/src/lib/api/client.ts` (and no `CreateSessionResponse` schema in `schemas.ts`). - No `lib/image.ts` `preprocess(file)` (downscale to 2000px longest edge, re-encode JPEG 0.85, strip EXIF). - No file input (`accept="image/*" capture="environment"`), no photo preview (`Use photo` / `Retake`), no upload progress bar, no identity store + navigate to `/s/:id`. ## Impact - A host cannot start a split at all from the UI - the primary entry point is dead. ## Expected (per docs/09-ux-flows.md) 1. Tap **Scan a receipt** -> file picker (`accept="image/*" capture="environment"`). 2. Preview screen: photo with `Use photo` / `Retake`. 3. `Use photo` -> client preprocess -> multipart upload with progress bar (XHR). 4. Store the returned host token via `storeIdentity`, navigate to `/s/:sessionId` (lands on Processing). 5. Errors: upload error stays on page with a message; `429 rate-limited` -> "Too many sessions from this network - try again in a few minutes." ## Repro 1. Run the frontend, open `/`. 2. Click **Scan a receipt**. 3. Nothing happens (no file dialog, no navigation, no network request).