Repository navigation
feat(web): redesign Sales with a MUI order desk and settlement rail - #900
Conversation
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Advanced Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
2c32d7b to
62a3581
Compare
|
Screenshot deletion note: The 8 superseded conversion-only screenshots were deleted from this comment at the owner's request to avoid confusion. This comment is historical verification, not the current design target. Use the approved #831 Field Console mockups. Newer implementation evidence. Before/after captures — Sales, 1280×800 + 390×844, light + darkIsolated-stack captures at head Both frames show the same drill-down state: an open Draft order (Sim Customer 1's seeded order) with the below-list discount chip visible on its Large Eggs line ($0.35 vs $0.45 list, "Below list" tag) — this is |
Runtime verification (isolated stack, not
|
62a3581 to
04077f1
Compare
|
Screenshot deletion note: The four superseded standalone Sales after screenshots were deleted from this comment at the owner's request to avoid confusion. The matching before frames remain. The newer compact Orders captures replace the old light frames; refreshed dark compact-ledger evidence is still needed. Use the approved #831 Field Console mockups. Newer implementation evidence. Field Console redesign — sales Groundwork
|
|
Field Console redesign — sales-detail-1280 Groundwork
|
|
Field Console redesign — sales-detail-390 Groundwork
|
|
Field Console redesign — sales-payment-scroll Groundwork
|
|
Field Console redesign — sales-discounted-draft Groundwork
|
|
Field Console redesign — sales-phone-actions Groundwork
|
|
Field Console redesign — phone-clearance-light Groundwork
Maximum-scroll checks confirm the page content ends above the fixed phone navigation. |
|
Field Console redesign — phone-clearance-dark Groundwork
Maximum-scroll checks confirm the page content ends above the fixed phone navigation. |
|
Codex review (gpt-6-astra, read-only) of the combined diff
|
|
Coordinator Orders fix at At 1280, TableContainer scrollWidth = 948px, clientWidth = 948px; all 17 seeded rows are 43.75px tall, values are nowrap, and Audit history/Open are inline. Full partial-payment and missing-list-price wording remains available through hover and accessible descriptions. The phone comparison table retains its swipe cue. |
|
Reply to the combined-diff review. All five findings are fixed. Heads: #899
The coordinator's two visual/copy fixes are also complete: Inventory points to the Feed page in en/es/tl; Orders uses short cells with full title/accessible descriptions and inline Audit history/Open. At 1280 the TableContainer is scrollWidth 948px / clientWidth 948px, with 43.75px rows. Fresh Sales 1280/390 light captures are attached on #900. Final coverage gates: #899 3,133/3,133, #900 3,131/3,131; all five required guards and both typechecks pass. Both isolated stacks, volumes and task images are removed. PR bodies are updated; no review bot was triggered. |
|
Codex re-verified 663b690 (#899) and 84420b4 (#900) (read-only): Feed and Water previews subtract in integer thousandths and format through the farm's number formatting, tested on the exact inputs; the Stock and Reports canaries target the new markup by role; the Sales phone mutant now breaks the settlement rail and is wired into every mutation-check map; the dismissal tests observe the mounted panel under |
|
Codex re-verified 7dfef10 (and its merge into #900 as ccb0121): the Feed and Water previews sit in permanently mounted polite, atomic live regions with label and value, pinned by tests; the canary total must parse to a positive number; the Expenses test requires both Category labels. No new defect; no objection to merging once CodeRabbit's queued round returns clean. |
Owner-requested Sales design comparisonPlease address these differences from the approved #831 Sales Field Console. Reviewed source at
The newest compact Orders captures already correct the earlier verbose ledger cells; I am not reporting that fixed issue again. The images reviewed are correctly sized 1280×800 / 390×844. Refresh matching draft, confirmed/payment and compact-ledger states after the visual corrections, in both themes. At the owner's request, the earlier conversion-only capture set and the four superseded pre-compact standalone Sales after frames were removed with notes. Their matched redesign before frames, unchanged detail/action evidence, and newest compact frames remain. The #831 approved mockups remain the design reference. No review bot requested. |
7dfef10 to
b37faa3
Compare
ccb0121 to
4a7bfa0
Compare
10fc6a2 to
508fe2d
Compare
3b3dc8a to
3f7f486
Compare
|
Field Console fidelity corrections: ledger Head
|
cc78c35 to
c6d9261
Compare
) Pairs 7/9/10/11/15 across the title row, both order-detail tables (the line-items table keeps the discount tint and the below-list chip's surface lift, now DISCOUNTED_ROW_SX/DISCOUNTED_BADGE_SX inline sx on the same --tint-warn/--surface tokens instead of tr.discounted CSS), the new-order/payment dialogs, the add-line form, the order-detail ruled region (pair 15, replacing the retired .order-panel div with a named role="region" landmark), the orders filter row (status + customer + unpaid — no FilterBar, since Sales carries no date range), and the orders table. Sales was the last consumer of `.order-panel` and `tr.discounted .badge-warn`; both CSS rules retire in this commit. styles.discount.test.ts's cross-brand/mode contrast guard now asserts directly against the --tint-warn/--surface token names instead of the deleted selectors. tools/simulation/ui/specs/phone.spec.ts's draft-panel phone-stacking walk moves from `.order-panel .actions` to the new region landmark. 21 of SalesPage.test.tsx's `.order-panel` presence checks rewritten to role="region" queries (17 were silently vacuous after the markup change, not just the 4 that surfaced as failures); .form-grid/td.num/ tr.discounted class assertions rewritten to structural (.MuiStack-root) or style-based (textAlign, backgroundColor) equivalents. Full Sales suite (3 files, 237 tests) green; full web suite 3121/3122 (the 1 failure a pre-existing DailyEntryPage flake, confirmed standalone-green, unrelated to this branch).
Records six divergences from row 9: both halves of tr.discounted retired (not just .badge-warn), the EntryRow extraction ahead of History, the #150 scroll-shadow gradient added to MuiTableContainer, the confirmed 6+1 FilterBar caller count, the two-PR split, and that .panel-actions/.actions stay declared.
…831) TextField select whose value can be "" with a placeholder option needs slotProps.inputLabel.shrink=true or the label rests on top of the placeholder text (the owner caught this on #897's Grade select; #833 hit it again on Audit's filters). Sales' Status filter has the same shape. Adds the unit assertion #897 established (label carries MuiInputLabel-shrink).
Mirrors PR899's fix for /stock and /history: /sales now renders MUI's <Table>, so its phone-overflow-walk entry switches from content: "table.data" to content: "role=table". This is the last of the six walked routes to convert; phone-table-overflow-unclipped's own comment (mutants.ts) already anticipated this state — the mutant now reaches zero of the six routes and is due for retirement or a new CSS target, flagged as a follow-up rather than done here.
…ar surface (#831) Coordinator review of the rendered frames: Customer/Outstanding cells and the header row wrapped onto multiple lines at 1280 (the #897 regression this repo has hit before), and the actions cell clipped at the right edge with no scroll cue. Pins whiteSpace:nowrap on the short value cells and headers, leaves the discount/partly-paid notes free to wrap after their own <br/>, and lets the row actions wrap onto a second line (flexWrap: wrap) instead of overflowing. Also wraps the orders filter row (status/customer/unpaid) in FilterBar for the same outlined surface every other converted screen shows, overriding this slice's earlier "Sales carries no date range, so it doesn't need FilterBar" reasoning per coordinator review. Groundwork commit ahead of the Concept B "Field Console" redesign landing under the same issue; not polished further since the redesign restyles these tables.
c6d9261 to
6f8291b
Compare
|
Closed by accident, not by a real merge — replaced by #927. I force-pushed this branch's commits onto its base ref Nothing reached The review history and the 50 reviewed captures on this PR stay readable and are |




































Part of #831. Sales MUI conversion and approved Field Console, stacked on #899.
Redesign fidelity — second audit round
Head
2a735f8f594ca05a46eff2d62800151d19a76eb8. The artifact'sbSales()and CSS were read against each requested rule.Shared colour-token changes remain deferred to #901. Links consume the existing link token, so dark-mode text stays readable until that theme lands. No global theme edits. Extra list-price disclosures and full action wording remain longer than the abbreviated prototype to preserve #720/#773 semantics. Above-list settlement still reads Above list, exact list equality reads At list, and unknown/partial prices retain their existing wording.
The manifest, payments and Orders remain real tables; the manifest becomes a bounded phone grid. Context is a labelled definition list and settlement a named aside. Navigation, role gates, provenance, idempotency, concurrency, payment/void lifecycles and hidden-region dismissal guards remain.
Verification
npm test -- --maxWorkers=2 --coverage: 3,164 passed / 133 files at the final rebased head. The Sales-only round added two tests (3,155 → 3,157); the new ledger base contributes seven more. Coverage: 91.69% statements, 88.61% branches, 87.38% functions, 94.48% lines; gates green.cw900r, one Playwright worker. Quick baseline 62 passed / 1 intentional skip. Phone-action mutant killed: 1 killed, 0 survivors. Restored quick suite 62 passed / 1 intentional skip; desktop control 50 passed / 1 skip.Cleanup and preserved evidence
Functional commit
69d6fc6; separate deslop2a735f8: three stale/redundant comment blocks and two duplicate assertions removed; obsolete row-tint guard names updated. No new any casts, suppressions or defensive catches. No CSS selector is deleted in this round; the earlier.order-panel/tr.discountedretirements and their caller search remain documented in prior comments..toolbar,table.data,.page-headand.mutedremain.Final-head captures: ledger · draft · settlement · confirmed · payment · phone-detail. Earlier capture comments stay unchanged; the earlier “payment” frames were confirmed-order views and are superseded by the new dialog evidence. No images committed, no review bot invoked. The isolated cw900r stack and volumes were removed after verification.
The closing phrase remains deferred until the owner merges #899 and retargets #900 to main.
Rebased combined head
Sales is rebased onto #899
9080ca31088a28cb7adf6288d29be2cdd931f362. Its component, unit tests, browser layout tests and mutant code are unchanged by that rebase. The shared FilterBar now uses the ledger spacing, so the Sales frames are recaptured at the new head. The mutation totals above were measured before this base rebase; the final rebuilt head passed both typechecks, full coverage (3,164 tests / 133 files), quick Playwright (62 passed / 1 intentional skip), and six capture/translation scenarios. All 24 produced frames were compared with the approved artifact; 22 distinct frames are attached, omitting the duplicate desktop settlement views already present in the draft frames. The isolated stack, volumes and local image are removed.Review follow-up — current head
Head
cc78c35b1849af3e831556e6adc39bfe2a7b3d86, rebased onto #8995aadb243ee8f21b525cf733a436e3cd408943eb3.The phone manifest keeps Unit price and Line total visually hidden while exposing their labelled amounts to screen readers inside the Product cell. It uses the existing translated labels and order-currency formatter. Desktop columns remain complete; editing retains the visible price input.
Draft and Confirmed unit regressions both failed before the fix: “Unable to find an element with the text: Unit price $0.38, Line total $9.12.” Restored Sales tests: 243 → 245 passed. At 390px, removing the screen-reader span made the browser row-name check fail: the row contained only “Sim Large Eggs per egg 36 36 List price: $0.45 Discount: —”, missing the labelled unit price and $16.20 line total. The clean-context quick suite passed 63 tests / 1 intentional skip; browser layout tests increased 4 → 5.
Both typechecks and all five guards passed. Full coverage at this head: 3,166 tests / 133 files; statements 91.69%, branches 88.61%, functions 87.38%, lines 94.48%. After rebuilding at the committed head, the quick suite passed 63 tests / 1 intentional skip, and both capture scenarios passed. History tests remain 78 on the new base.
The three-file diff passed deslop review without additional cleanup. No CSS selector was deleted, no allowlist or guard was weakened, and no image was committed. Six phone-detail frames cover confirmed orders, editing and bottom clearance in light/dark at 390×844, scale 1. Final phone-detail captures.
The isolated
cw900rstack remains running on port 8105 at the owner's request;cw899ris removed. Shared link colour remains deferred to #901 and must resolve to --brand when that theme is rebased in.