Skip to content

feat(web): redesign Sales with a MUI order desk and settlement rail - #900

Merged
mforce merged 20 commits into
feat/831-mui-ledgersfrom
feat/831-mui-ledgers-sales
Sep 21, 2026
Merged

mforce merged 20 commits into
feat/831-mui-ledgersfrom
feat/831-mui-ledgers-sales

Conversation

@mforce

@mforce mforce commented Sep 18, 2026 •

Copy link
Copy Markdown
Owner

Part of #831. Sales MUI conversion and approved Field Console, stacked on #899.

Redesign fidelity — second audit round

Head 2a735f8f594ca05a46eff2d62800151d19a76eb8. The artifact's bSales() and CSS were read against each requested rule.

  • Ledger (1–5): New order has a local 4px radius; Clear filters is always present and clears status/customer/unpaid while preserving unrelated URL keys. Draft/Confirmed use 6px dots and bold text. Discounts use plain amber exception text, with the existing long partial-price/payment descriptions retained for hover and accessibility. Open/edit/remove are underlined links; remove retains destructive colour.
  • Manifest (6–7, 12): uppercase Draft order eyebrow, order/customer heading and flush-right status; no below-list row tint. Desktop retains every column and the four-field entry row. Phone hides Unit price and Line total as explicitly requested in this round, retaining list-price/discount disclosures beneath the product and exposing Unit price during editing. Edit/remove stay inline; rows grow around their content without overlap or horizontal scrolling.
  • Settlement (8–11): desktop actions use content widths and align right; phone keeps equal paired actions. Cancel draft is white-filled with dark text, distinct from the destructive outlined Void order. Settlement labels the serif total; Payments is serif, and its swipe cue uses the rail surface. Close remains deliberately: it dismisses the loaded order and editor; the static prototype has no load/dismiss lifecycle.
  • Payment evidence (13): new frames show the actual Record payment dialog open in both viewports and themes. Capture does not submit a payment.

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

  • Full 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.
  • SalesPage 241 → 243 tests. Browser Sales layout 1 → 4; the lifecycle test now checks Confirmed beside the title in the order header.
  • TypeScript and browser-harness typechecks pass. All five guards pass: harness selectors 1, declared tokens 1, farm-theme policy 28, elevation 16, discount 36; no allowlists.
  • Red-first: four UI regressions failed before implementation. The discount guard rejects a chip fill (1 failed, 35 passed, then 36 passed restored); the status-dot check rejects 0px against 6px. Browser geometry rejects clipped phone rows and wrapped edit/remove links before their fixes. A CSP-blocked injection was discarded and repeated using CSSOM before counting the dot proof.
  • Isolated 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.
  • Fresh default-farm captures: 1280×800 and 390×844, light/dark, scale 1; ledger, draft/settlement, confirmed, actual payment dialog, phone editing and bottom clearance. Six capture/translation scenarios pass, including Spanish/Tagalog action geometry.
  • Matched widest seeded Orders row at 1280: scrollWidth 948 / clientWidth 948, 36px rows; short cells nowrap. At 390 the complete Orders ledger remains bounded and scrollable (896 / 353); the manifest itself fits without horizontal scrolling.

Cleanup and preserved evidence

Functional commit 69d6fc6; separate deslop 2a735f8: 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.discounted retirements and their caller search remain documented in prior comments. .toolbar, table.data, .page-head and .muted remain.

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 #899 5aadb243ee8f21b525cf733a436e3cd408943eb3.

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 cw900r stack remains running on port 8105 at the owner's request; cw899r is removed. Shared link colour remains deferred to #901 and must resolve to --brand when that theme is rebased in.

@coderabbitai

coderabbitai Bot commented Sep 18, 2026 •

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 8cf720b1-4d0c-4bb3-af2f-62d00ee85761

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@mforce
mforce force-pushed the feat/831-mui-ledgers-sales branch 2 times, most recently from 2c32d7b to 62a3581 Compare September 18, 2026 00:46
@mforce

mforce commented Sep 18, 2026 •

Copy link
Copy Markdown
Owner Author

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 + dark

Isolated-stack captures at head 2c32d7b, before rebuilt from this PR's own base (feat/831-mui-ledgers, PR #899's tip). All 1:1 (deviceScaleFactor 1). Captured against default-farm (the simulation fixture) — DemoDataSeeder seeds no sales orders on readme-farm.

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 SimulationDataSeeder's own fixture order, not a fabricated one.

@mforce

mforce commented Sep 18, 2026

Copy link
Copy Markdown
Owner Author

Runtime verification (isolated stack, not cluckwork-sim)

Test plan checklist, closing out the two pending items:

  • Isolated-stack full quick Playwright suite — first run 53 passed, 1 failed, 1 skipped (both projects, all 55 specs), against a stack built at this PR's original head. Re-run after the fix below: 54 passed, 1 skipped, 0 failed.
  • Before/after 1:1 captures at 1280×800 and 390×844, light/dark, with a drill-down open — attached above.

One real regression found and fixed during this verification, not by me — same defect class as PR #899: phone.spec.ts's overflow-walk test still located /sales via content: "table.data", but this PR's MUI <Table> conversion drops that class. Root-caused, reported, and fixed live by another agent working the same issue — commit 62a3581 switches /sales to content: "role=table", mirroring #899's fix for /stock//history and #832's original fix for /customers//flocks.

DIRECTION.md compliance, checked against docs/designs/864-visual-language/DIRECTION.md, specifically the discount-tint requirement: the below-list line renders with the --tint-warn row tint and a "Below list" chip carrying the --surface lift — not a bordered white box drill-down, which direction A rejects. The order-detail drill-down itself is a plain ruled region (a named role="region" landmark replacing .order-panel), no card fill. Status/Customer filter selects render cleanly (floating label shrinks correctly, confirmed in both themes/viewports) — worth noting since PR #899's Expenses page had a visually similar-looking issue that turned out to be a stale-Docker-image artifact in my own testing, not a real bug; see the correction on that PR's thread. Sales' own Status-select shrink fix (e179793) was applied proactively by the same pass, before I'd even looked at Sales specifically.

Captured against the seeded simulation fixture's own draft order (Sim Customer 1, Large Eggs at $0.35 vs $0.45 list) — my first capture attempt had accidentally landed on an E2E-test-artifact order (absurd numbers) because I'd run the full suite immediately beforehand, which creates its own below-list orders; recaptured on a freshly-reseeded stack, before running the suite, to get the clean fixture order instead.

SHA note: verified at 62a3581 (this PR's current head, rebased onto #899's 2da532a) — confirmed via git log/git fetch after the fact that both branches' final SHAs match what's referenced here.

Isolated stack (cw900, its own compose project + ports, distinct from and never touching the shared cluckwork-sim stack), torn down after use.

@mforce

mforce commented Sep 19, 2026 •

Copy link
Copy Markdown
Owner Author

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 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • before-sales-1280-light.png
  • before-sales-1280-dark.png
  • before-sales-390-light.png
  • before-sales-390-dark.png

before sales 1280 light

before sales 1280 dark

before sales 390 light

before sales 390 dark

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — sales-detail-1280

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • before-sales-detail-1280-light.png
  • after-sales-detail-1280-light.png
  • before-sales-detail-1280-dark.png
  • after-sales-detail-1280-dark.png

before sales detail 1280 light

after sales detail 1280 light

before sales detail 1280 dark

after sales detail 1280 dark

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — sales-detail-390

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • before-sales-detail-390-light.png
  • after-sales-detail-390-light.png
  • before-sales-detail-390-dark.png
  • after-sales-detail-390-dark.png

before sales detail 390 light

after sales detail 390 light

before sales detail 390 dark

after sales detail 390 dark

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — sales-payment-scroll

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • after-sales-payment-scroll-1280-light.png
  • after-sales-payment-scroll-1280-dark.png
  • after-sales-payment-scroll-390-light.png
  • after-sales-payment-scroll-390-dark.png

after sales payment scroll 1280 light

after sales payment scroll 1280 dark

after sales payment scroll 390 light

after sales payment scroll 390 dark

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — sales-discounted-draft

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • before-sales-draft-1280-light.png
  • after-sales-draft-1280-light.png
  • before-sales-draft-1280-dark.png
  • after-sales-draft-1280-dark.png
  • before-sales-draft-390-light.png
  • after-sales-draft-390-light.png
  • before-sales-draft-390-dark.png
  • after-sales-draft-390-dark.png

before sales draft 1280 light

after sales draft 1280 light

before sales draft 1280 dark

after sales draft 1280 dark

before sales draft 390 light

after sales draft 390 light

before sales draft 390 dark

after sales draft 390 dark

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — sales-phone-actions

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • after-sales-line-edit-390-light.png
  • after-sales-line-edit-390-dark.png
  • after-sales-settlement-390-light.png
  • after-sales-settlement-390-dark.png

after sales line edit 390 light

after sales line edit 390 dark

after sales settlement 390 light

after sales settlement 390 dark

@mforce mforce changed the title feat(web): convert Sales to MUI, retire .order-panel and tr.discounted feat(web): redesign Sales with a MUI order desk and settlement rail Sep 19, 2026
@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — phone-clearance-light

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • after-sales-bottom-390-light.png

Maximum-scroll checks confirm the page content ends above the fixed phone navigation.

after sales bottom 390 light

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Field Console redesign — phone-clearance-dark

Groundwork 04077f131eff4638ba2a1be43f8653505ede0288 → redesigned b1e9dde897c14f953f8790b8abbecb0d5285f9ef, isolated default-farm fixture. Viewports are 1280×800 or 390×844, at device scale 1. No page JavaScript errors were recorded.

  • after-sales-bottom-390-dark.png

Maximum-scroll checks confirm the page content ends above the fixed phone navigation.

after sales bottom 390 dark

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Codex review (gpt-6-astra, read-only) of the combined diff origin/main...feat/831-mui-ledgers-sales at 2ae3925/b1e9dde, the first reviewer round on either PR; CodeRabbit's round is queued behind its rate-limit window. Five findings, forwarded into the open fix round; per-finding status follows with the fix SHAs.

  1. feat(web): redesign seven ledgers as a Field Console with MUI #899 WaterPage.tsx:514, FeedPage.tsx:343: the new previews print raw floating-point subtractions (0.09999999999999998 kg). Product defect.
  2. feat(web): redesign seven ledgers as a Field Console with MUI #899 specs-canary/canary.spec.ts:75, ~122-128: the Stock and Reports canaries still target the removed grade table and an ambiguous Profit locator; dispatch-only callers missed by the grep.
  3. feat(web): redesign Sales with a MUI order desk and settlement rail #900 SalesPage.tsx:1461, mutants.ts:1025: the settlement rail's selector outranks phone-action-label-wrapped, so that mutant reports a survivor without injecting its defect.
  4. feat(web): redesign Sales with a MUI order desk and settlement rail #900 SalesPage.test.tsx:3417, ~3330-3387: queryByRole("region") returns null under the exit-transition aria-hidden, weakening the dismissal tests.
  5. feat(web): redesign seven ledgers as a Field Console with MUI #899 StockPage.test.tsx:170, ExpensesPage.test.tsx:1136: the bounded-date tests no longer assert the 12rem bound (SPA: table layout — provenance column to one line, date-range filters into a bounded toolbar #653).

@mforce

mforce commented Sep 19, 2026 •

Copy link
Copy Markdown
Owner Author

Coordinator Orders fix at 84420b44716b4d86166608f458fd0c73bd65e056: fresh default-farm light captures at 1280×800 and 390×844.

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.

Sales 1280 light — compact Orders

Sales 390 light — scrollable commercial ledger

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Reply to the combined-diff review. All five findings are fixed.

Heads: #899 663b6908c677cb15ae2c8ecc5cde8781010b474d; #900 84420b44716b4d86166608f458fd0c73bd65e056.

Finding Status and evidence
1. Decimal previews Fixed in #899. Both exact cases failed first; 1 − 0.9 kg and 100.2 − 100.1 L now render 0.1 using integer thousandths and the farm formatter.
2. Dispatch canaries Fixed in #899 with named board/list roles and scoped Reports queries. Reproduced both initial failures and the missing footer separately; full isolated canary 4/4 passes.
3. Phone action mutant Fixed in #900. Old selector reproduced as a survivor; retargeted selector breaks both width-share and taller-than-wide assertions. Full mutation-check: killed, baseline/restore 54 passed + 1 intentional skip, desktop control 46 passed + 1 skip.
4. Dismissal checks Fixed in #900 with hidden: true. Each of the 12 affected write/refresh/cancel cases failed directly on the mounted panel when its close was independently skipped. Restored Sales/catalog group 437/437 passes.
5. Date-field bound Fixed in #899. Stock and Expenses assert the rendered field's 12rem max-width; removing the bound makes both fail. Restored affected page group 200/200 passes.

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.

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

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 aria-hidden; the bounded-date tests require the 12rem bound; the Orders short tokens keep the #720/#773 wording as accessible descriptions in all three locales with inline actions and single-line rows. No new defect. CodeRabbit's round on #899 is queued behind its rate-limit window.

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

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.

@mforce

mforce commented Sep 19, 2026

Copy link
Copy Markdown
Owner Author

Owner-requested Sales design comparison

Please address these differences from the approved #831 Sales Field Console. Reviewed source at ccb0121d6c92df5da01011e565f49a3a7090a481, the draft/detail captures, and the newer compact Orders captures. This is a source/capture review; no new runtime tests were run.

  1. The approved order-context band is missing. The reference places the active order/status, order total and outstanding value in a compact ruled strip between the page header and order workspace. The implementation moves straight from Sales/New order to the active-order heading. Restore that hierarchy using the real order and balance semantics; drafts must not invent an outstanding payment balance.

  2. The manifest's desktop hierarchy and form arrangement differ. The reference keeps the order/customer identity and Draft state in the manifest's own header, then compact rows and a four-field Product/Per/Quantity/Unit price entry row. Current source puts the identity above both panels, adds a separate "Order manifest" heading, and uses the shared two-column CONSOLE_FORM_SX. In the draft capture this makes the workspace tall enough to push the commercial rows below the first desktop frame. Add line is outlined despite being the filled manifest action in the approved render. Match the intended structure while retaining the quantity stepper, discounts, list-price details and all manifest columns. Draft evidence.

  3. The settlement hierarchy is reversed and omits the list-value row. The approved rail starts with the large order total, followed by aligned List value, Discount and Stock commitment rows. Current source starts with a large stock-commitment number, follows it with discount prose, and places Total below. Recompose the existing discount/total information to match the reference. Where list prices are incomplete, preserve the current unknown/partial semantics rather than presenting an invented full list total. Keep payment controls/history and the existing unsaved-quantity preview behavior. Settlement evidence.

  4. Phone page actions and shared surface treatment differ. The reference puts a full-width rectangular New order action below the page intro; the PR keeps a pill beside the heading. The reference uses warm paper rather than the current lavender canvas. The approved draft actions are balanced side by side; the rail's & .actions { flexDirection: "column" } stacks every action. Reconcile the layout with the reference while preserving Close, translated labels, readable 44px controls and destructive-action distinction. Do not hide manifest columns to copy the prototype's abbreviated phone table: the locked requirement to retain every comparison column takes precedence, and the swipe cue/sticky actions are useful existing work.

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.

@mforce
mforce force-pushed the feat/831-mui-ledgers branch from 7dfef10 to b37faa3 Compare September 19, 2026 23:37
@mforce
mforce force-pushed the feat/831-mui-ledgers-sales branch from ccb0121 to 4a7bfa0 Compare September 19, 2026 23:37
@mforce
mforce force-pushed the feat/831-mui-ledgers branch from 10fc6a2 to 508fe2d Compare September 20, 2026 01:24
@mforce
mforce force-pushed the feat/831-mui-ledgers-sales branch from 3b3dc8a to 3f7f486 Compare September 20, 2026 01:45
@mforce

mforce commented Sep 20, 2026

Copy link
Copy Markdown
Owner Author

Field Console fidelity corrections: ledger

Head 3f7f486cafdf9bf373410f89e1dfa03eaf4cc382, isolated default-farm. 1280×800 and 390×844, light/dark, device scale 1. Compared with the approved #831 artifact. Shared theme treatment remains deferred to #901; complete columns, provenance and workflows are retained. Existing before captures remain in earlier comments.

  • sales-ledger-1280-light.png
  • sales-ledger-1280-dark.png
  • sales-ledger-390-light.png
  • sales-ledger-390-dark.png

sales ledger 1280 light

sales ledger 1280 dark

sales ledger 390 light

sales ledger 390 dark

@mforce
mforce force-pushed the feat/831-mui-ledgers-sales branch from cc78c35 to c6d9261 Compare September 21, 2026 01:52
)

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.
@mforce
mforce force-pushed the feat/831-mui-ledgers-sales branch from c6d9261 to 6f8291b Compare September 21, 2026 03:25
@mforce
mforce merged commit 6f8291b into feat/831-mui-ledgers Sep 21, 2026
3 checks passed
@mforce
mforce deleted the feat/831-mui-ledgers-sales branch September 21, 2026 03:29
@mforce
mforce restored the feat/831-mui-ledgers-sales branch September 21, 2026 03:31
@mforce

mforce commented Sep 21, 2026

Copy link
Copy Markdown
Owner Author

Closed by accident, not by a real merge — replaced by #927.

I force-pushed this branch's commits onto its base ref feat/831-mui-ledgers
while the worktree was checked out here. GitHub saw this PR's head commit
contained in its own base branch, concluded it was merged, marked it MERGED and
deleted the head branch.

Nothing reached main. Both refs are restored to their correct heads —
feat/831-mui-ledgers at 0b90f77 and feat/831-mui-ledgers-sales at
6f8291b, this PR's own head — and no commit was lost. GitHub does not allow a
PR marked MERGED to be reopened, which is why the work continues on #927 rather
than here.

The review history and the 50 reviewed captures on this PR stay readable and are
still the record for that work; #927 carries the same body and points back here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant