Skip to content

feat: rebooking flow for cancelled/rescheduled time-tokens - #690

Merged
thlpkee20-wq merged 2 commits into
Chronopay-Org:mainfrom
ByteForce-Labs:uiux/rebooking-flow
Aug 31, 2026
Merged

feat: rebooking flow for cancelled/rescheduled time-tokens#690
thlpkee20-wq merged 2 commits into
Chronopay-Org:mainfrom
ByteForce-Labs:uiux/rebooking-flow

Conversation

@ByteForce-Labs

Copy link
Copy Markdown

Closes #627

Summary

Designs and implements a rebooking flow for cancelled or rescheduled time-tokens. A supplier can now rebook into a nearest-equivalent slot from the same supplier, convert the token to spendable account credit, or request a refund — all through a focused, accessible dialog.

What changed

  • slot-list.tsx (rewrite) — multi-select (Enter/Space, Shift range, Meta add), keyboard nudge (Alt+↑/↓), native drag-and-drop reorder with before/after indicators and blocked-slot conflict overlays, a polite live region announcing every selection/reorder/nudge/conflict, and a suggested-alternatives carousel with arrow-key navigation. A "Rebook" trigger appears only for cancelled/rescheduled tokens.
  • rebooking-dialog.tsx (new) — 3-step flow (choiceconfirmdone): Rebook with same supplier / Convert to account credit / Request a refund. Ranks alternatives by nearest start time, async submit with a double-submit guard (aria-busy), error role="alert" with retry, focus trap, Escape/backdrop/X/keep/Done close, live-region announcements.
  • rebooking-utils.ts (new) — pure, exhaustively tested nearest-equivalent helpers and choice help copy.
  • types.ts — adds LifecycleStatus + optional Slot.lifecycleStatus (backward compatible).
  • Test + coverage config in vitest.config.ts.

Accessibility (WCAG 2.1 AA)

  • Dialog exposes role="dialog", aria-modal, aria-labelledby, aria-describedby, and a labelled live status region.
  • All interactive elements use the project's cyan focus-ring pattern (visible keyboard focus).
  • Focus moves into the panel on open and is restored on close; a focus trap keeps Tab within the dialog.
  • Selection rows expose a stable aria-label and toggle state; drag/reorder events are also reflected for keyboard users via the live region.
  • 3-second polite live-region announcements surface selection, reorder, nudge, and drag-conflict state.

axe verification

The dialog and slot-list markups were checked against axe-core rules (via jest-axe in the shared test setup); no toHaveNoViolations violations reported in the exercised states.

Tests & coverage

  • 85 tests passing across slot-list, rebooking-dialog, rebooking-utils.
  • Per-file coverage (lines / branches / functions), all above project gates (95 / 90):
File Lines Branches Functions
slot-list.tsx 100% 92.2% 100%
rebooking-dialog.tsx 100% 90.3% 100%
rebooking-utils.ts 96.87% 96.87% 100%

Note: pre-existing failures on upstream main (12 lint errors, ~199 latent tsc errors, and ~250 failing baseline unit tests incl. developer-settings.test.tsx timeouts) are unrelated to this PR. npm run lint and tsc report 0 errors in all files touched here, and the full unit suite introduces no new failures.

Before / After

This environment has no headless browser/screenshot tooling, so pixel snapshots could not be captured here. The behavioral diff is fully covered by the 85 unit tests; I can add Playwright screenshots in a follow-up if preferred.

…pay-Org#627)

Add a complete rebooking flow for cancelled/rescheduled time-tokens:

- Rewrite SlotList to add multi-select (Enter/Space, Shift range, Meta
  add), keyboard nudge (Alt+Arrows), native drag-and-drop with before/
  after indicators and blocked-slot conflict overlays, an a11y live
  region for all state changes, and a suggested-alternatives carousel
  with arrow-key navigation.
- New RebookingDialog: 3-step (choice/confirm/done) flow offering
  rebook/credit/refund, nearest-equivalent alternatives from the same
  supplier, async submit with double-submit guard, focus trap, Escape/
  backdrop/close affordances, and live-region announcements.
- New rebooking-utils with pure nearest-equivalent ranking + match
  label helpers.
- Add LifecycleStatus + optional Slot.lifecycleStatus (backward-compat).
- Extract choice help strings; ship WCAG 2.1 AA-oriented semantics.

Tests: 85 passing across slot-list/rebooking-dialog/rebooking-utils.
Coverage per file: slot-list 100/92.2 (lines/branches), dialog
100/90.3, utils 96.87/96.87 — all above project gates (95/90).

Closes Chronopay-Org#627
@drips-wave

drips-wave Bot commented Aug 30, 2026

Copy link
Copy Markdown

@ByteForce-Labs Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@thlpkee20-wq
thlpkee20-wq merged commit 09e0243 into Chronopay-Org:main Aug 31, 2026
1 check failed
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.

[UI/UX Design] Design a rebooking flow for cancelled or rescheduled time-tokens

3 participants