- Order cards derive their label from item progress (Not Started,
Preparing, Partly Ready, Ready, Picked Up, Cancelled) instead of the
order's own status; final states are coloured
- Order page: animated status banner per item (ready/picked up check,
cancelled cross, running-late clock), steps collapse once an item is
settled with a Show/Hide steps toggle, done steps are faded instead
of struck through, and the per-item status badge is gone
- New Delay concept: machines can report extra time on a claimed step
(preparation_step_instances.delay_seconds), which counts toward the ETA
- The kitchen can cancel an item at any point before it's ready, with a
refund (order_items.cancelled_by records who cancelled)
- Dev kitchen simulation now runs server-side across every order, so a
step nobody is watching no longer blocks the queue; each settled step
may randomly be delayed or cancelled
- Humanize snake_case statuses in the UI
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Adds a Footer with the brand, quick links (Menu, Basket, Your orders,
Help), and a copyright line, rendered on every page. Body is now a
full-height flex column so the footer sits at the bottom of the
viewport on short pages instead of floating right under the content.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
globals.scss's button reset only set font: inherit — no appearance
reset, no color fallback. Several buttons only set a background and
relied on inherited text color, which iOS Safari doesn't honor for
unstyled <button> elements, so their labels/icons rendered in Safari's
native blue instead of the theme color:
- .stepperButton in MenuItemCustomizer, MenuList, and basket
- .refreshButton in admin/kitchen
- .addButton in admin/MenuItemForm (color was only set on :hover)
Added explicit `color` to each, and hardened globals.scss's button
reset with `color: inherit` plus `-webkit-appearance: none` /
`appearance: none` as a fallback for any future button that forgets.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RvYdJ3os7tumimsLdLu2j9
Move the color palette into CSS custom properties (:root in
globals.scss) with a prefers-color-scheme: dark override, and point the
existing $color-* Sass variables at them so every component picks up
dark mode automatically. Replaced the handful of rgba($color, alpha)
call sites with color-mix(), since Sass can't alpha-blend a color that's
now a CSS variable at compile time.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Introduces a role-gated /admin section (sidebar layout, requireAdmin
checked both in route loaders and independently in every admin server
function) with three sections:
- Orders: every order across all customers, and an admin-only order
detail view nested under /admin so the sidebar persists and admin
access bypasses the guest-token check.
- Menu: create/edit/delete menu items, their options, and their
preparation steps; deleting an item with past orders is refused
(protected by the orderItems FK) instead of crashing.
- Kitchen: read-only live view of every machine's busy/idle status and
per-tag queue depth, with a manual refresh.
Also:
- Adds a `role` field to the user table (Better Auth additionalFields,
input:false so it can't be self-assigned) and a db:seed-admin script
to create/promote an admin account.
- Fixes a real bug found while building this: src/server/auth.ts's
shared session helpers were plain exported functions using a
server-only import, which the framework couldn't tree-shake out of
the client bundle once shared across multiple server/*.ts modules —
this silently broke hydration app-wide. Fixed with createServerOnlyFn.
- Removes the now-fully-unused @tanstack/devtools-vite plugin.
- Disables view transitions for in-admin navigation so the persistent
sidebar doesn't cross-fade/shift on every click.
- Gives the "your orders" empty state the same visual treatment as the
basket page's.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- Add an AnimatedNumber component that slides a quantity stepper's
count horizontally — left on increment, right on decrement — and
wire it into both the menu and basket steppers.
- Make the top nav bar position: sticky, with an explicit background
so scrolled content doesn't show through it.
- Reserve the scrollbar's gutter on every page (scrollable or not) so
the sticky header doesn't shift width when navigating between short
and tall pages.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- Wire up Better Auth (email/password + Google/Apple SSO) with a
sign-in/sign-up UI, header account menu, and a basket that follows
the signed-in-or-guest state.
- Give the order status page a vertical timeline per preparation step
(with a distinct customer-facing name separate from the machine tag,
a done/in-progress/queued/pending look, and a sonar-ping highlight on
the active step), a formatted ETA (relative under 3h, absolute clock
time beyond that), and Buy again / Get help / Cancel actions.
- Expand Pizza's recipe into 6 steps across a shared prep station and
the existing oven/assembly stations, with matching schema, seed, and
domain changes plus updated/added test coverage.
- Add an Orders list (account orders via session, guest orders via a
locally remembered access-token list) with a shared getOrdersForCustomer
domain summary, and remember a guest's name/contact after their first
order so checkout doesn't ask again.
- Improve page transitions with the View Transitions API: a shared
element morph between an order card and its detail page, a stable
(non-jumping) header across navigations, and reduced-motion handling.
- Add a Ghost Kitchen wordmark (Space Grotesk, faded "Ghost", ghost
icon standing in for the "o") and shrink the basket icon to match
the rest of the header controls.
- Add a run-ghost-kitchen agent skill documenting local setup, the
dev-server driver, and the gotchas hit along the way.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Builds the main customer-facing flow: browse the Brand's menu, add
items to a cart, and check out either as a guest (name + contact) or,
if signed in, as the account customer — both call the existing
placeOrder server function, which already distinguishes the two. On
success, navigates to a new /orders/$orderId status page showing each
Order Item's Preparation Steps, queue position, ETA, and (per the
domain rules already established) a Cancel button while cancellable
and a pickup-confirmation button once ready.
Styled with SCSS Modules per CLAUDE.md; added the sass dependency and
the src/styles/ structure it describes (globals.scss imported once in
__root.tsx, alongside the existing Tailwind stylesheet the not-yet-
mounted header-user.tsx component depends on).
Verified end-to-end against a throwaway local Postgres: menu renders
with seeded items, cart quantities update, guest checkout places a
real order, and the status page reflects a real cancellation.
Also fixes CLAUDE.md's Commands section, which documented pnpm even
though this repo only has npm (package-lock.json, no pnpm installed).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
lukasandClaude Opus 5.5