v0.1.20 Release

Picker Pick Page Goes Phone-First

The order pick page has been rebuilt for phones. The desktop chrome (top nav + sidebar) is gone on this screen, replaced by a dark slate header with the order context, a slim progress bar, an orange location banner, a dark scanner row, and a fixed bottom nav with Back + Release/Cancel-Picking always within thumb-reach. Item cards picked up a cleaner layout — picked/total counter, bold SKU, name, NO UPC chip when applicable, and a new inline bundle hint so the picker can see at a glance which alternate barcodes (5-pack, case of N, etc.) resolve to that row.

The order pick page (/inventory/picker/{picklist}/order/{order}/pick) was designed for desktop. On a phone it crammed the chrome (sidebar + top nav) into half the viewport, leaving the items list and scanner squeezed into what was left. Pickers were thumb-stretching and pinch-zooming all day.

This release rebuilds that screen from scratch for phones.

What the page looks like now

Picker pick page redesigned for phones — dark slate header, orange location banner, dark scanner, white item cards, fixed bottom action bar

Top to bottom:

  • Dark slate header. Loc N/M chip on the left tells the picker which bin in the order's pick sequence they're in (1/3, 2/3, …). The order number is the primary identifier with a one-tap copy button. Picked / Reported chips top-right open the same modal lists as before. A slim emerald progress bar grows underneath so the picker sees Picked 44 of 64 · 69% without scrolling.
  • Orange location banner. Big mono bin code (Location: R-3-1) — the operator's visual confirmation of where they should physically be standing.
  • Dark scanner row. Single input that auto-focuses after every action. Scan a product, bundle, or case barcode and the JS routes it through the same scan handler as the old page.
  • Item cards. White cards on a soft slate background:
    • Left column: picked / total qty with tiny PKD TOT micro-labels in blue.
    • SKU bold mono.
    • Product name.
    • NO UPC chip in red when applicable.
    • NEW — inline bundle hint. When a product has pack-bundles (e.g. a 5-pack carton) or a units_per_case set, the card shows a small indigo chip like 5-pack · Case of 12 so the picker knows what other barcodes resolve to this row. No more "Product not found" surprises when scanning a 5-pack carton.
    • Two-column footer: Scan to pick / Pick All (when remaining exceeds the pick-all threshold) / Pick (for bypass-scan products) on the left, Issue on the right.
  • Fixed bottom nav. Back and Release stay reachable even with the soft keyboard up. Once any item has been picked, Release quietly swaps for the orange Cancel Picking button — same rule as before, just in a more visible spot.

Why bundle hints matter

If a product has a 5-pack pack-bundle and the picker scans the 5-pack UPC, the system has always known to credit them with 5 units — but until this release the picker had no on-screen hint that the alternative barcode existed. They'd see "Product not found" the first time, fall back to single scans, slow down. The new chip surfaces every alternative scan path on the card so the picker can choose the most efficient barcode for the box they're holding.

Nothing under the hood changed

All the scan, pick, pick-all, bypass-scan, report-exception, location-rotation, release, cancel-picking, complete-order, and heartbeat flows still run through the same JS module they did before. The redesign is visual + structural; the controllers and AJAX endpoints are untouched. So if you've memorised a shortcut or an edge-case behaviour, it still works the same way — it just looks better and fits your phone.

A note on the desktop chrome

The sidebar + top nav still render everywhere else (dashboard, picklist index, settings, etc.). The pick page is the only screen we've stripped it on — picking is a single-task flow that benefits from the full viewport. Other picker-facing pages (scan-bin, the dashboard) will get the same treatment in a follow-up once we've collected feedback from this one.