feat: Misc Sideshift page polish - #667
Conversation
📝 WalkthroughWalkthroughAltpayment widget layout sizing and loading/error presentation were revised. Manual amount validation now uses a computed message, while Back navigation conditionally resets trades, returns to rate selection, or exits the widget. ChangesAltpayment UI flow
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (3 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
react/lib/components/Widget/AltpaymentWidget.tsxParsing error: error TS5012: Cannot read file '/tsconfig.json': ENOENT: no such file or directory, open '/tsconfig.json'. react/lib/tests/components/AltpaymentWidget.test.tsxParsing error: error TS5012: Cannot read file '/tsconfig.json': ENOENT: no such file or directory, open '/tsconfig.json'. 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@react/lib/components/Widget/AltpaymentWidget.tsx`:
- Around line 748-755: Update the altpaymentError branch in AltpaymentWidget so
non-editable flows also render an exit or retry action when
showManualAmountBackButton is false. Use backToWidget or the existing resetTrade
path as appropriate, while preserving the current manual-amount Back behavior.
- Around line 734-736: Update backToWidget to reset the parent-owned altpayment
trade, loading, shift, and error state before calling setUseAltpayment(false).
Reuse the existing state-reset mechanism or setters exposed by Widget.tsx, and
apply the same reset behavior to the other Back handler around the alternate
location.
- Around line 709-715: Update the amountValidationMessage logic in
AltpaymentWidget so null validation flags do not produce error messages; only
display the below- or above-maximum messages when isAboveMinimumAltpaymentAmount
or isBelowMaximumAltpaymentAmount is explicitly false, while preserving the
existing pairAmount requirement.
- Around line 414-417: Update the BackLink clickable element to use a native
button with type="button" or an equivalent MUI button primitive, preserving its
existing styling and click handling while making it keyboard-focusable and
operable.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 8c1362df-ef23-49f3-ad44-8a04c9a2371d
📒 Files selected for processing (2)
react/lib/components/Widget/AltpaymentWidget.tsxreact/lib/components/Widget/Widget.tsx
There was a problem hiding this comment.
🧹 Nitpick comments (2)
react/lib/tests/components/AltpaymentWidget.test.tsx (2)
144-146: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAssert the final reset occurs before exiting altpayment.
This only checks
setAltpaymentShiftordering; it would still pass ifsetLoadingPair,setLoadingShift, orsetShiftCompletedran aftersetUseAltpayment(false). Assert that all parent-owned reset setters—or at least the finalsetShiftCompletedcall—precede the exit call. (github.com)🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@react/lib/tests/components/AltpaymentWidget.test.tsx` around lines 144 - 146, Update the ordering assertions in the AltpaymentWidget test to verify that the final parent-owned reset, at minimum setShiftCompleted, occurs before setUseAltpayment is called with false; include setLoadingPair and setLoadingShift as well if asserting all reset setters. Preserve the existing setAltpaymentShift ordering check.
124-164: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAdd coverage for manual-amount Back navigation.
These tests cover error-state Back handlers, but not the new
backToRateSelectionbranch for invalid manual amounts. Add a regression test asserting that it clears the error, shift, loading, and pair state without callingsetUseAltpayment. (github.com)🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@react/lib/tests/components/AltpaymentWidget.test.tsx` around lines 124 - 164, The test suite lacks coverage for the invalid manual-amount Back path. Add a regression test in AltpaymentWidget tests that renders the manual-amount error state, clicks the Back button, and verifies setAltpaymentError, setAltpaymentShift, setLoadingPair, setLoadingShift, and setCoinPair are reset while setUseAltpayment is not called, covering the backToRateSelection branch.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@react/lib/tests/components/AltpaymentWidget.test.tsx`:
- Around line 144-146: Update the ordering assertions in the AltpaymentWidget
test to verify that the final parent-owned reset, at minimum setShiftCompleted,
occurs before setUseAltpayment is called with false; include setLoadingPair and
setLoadingShift as well if asserting all reset setters. Preserve the existing
setAltpaymentShift ordering check.
- Around line 124-164: The test suite lacks coverage for the invalid
manual-amount Back path. Add a regression test in AltpaymentWidget tests that
renders the manual-amount error state, clicks the Back button, and verifies
setAltpaymentError, setAltpaymentShift, setLoadingPair, setLoadingShift, and
setCoinPair are reset while setUseAltpayment is not called, covering the
backToRateSelection branch.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 31170617-309a-461c-a4ae-f5377c51add0
📒 Files selected for processing (2)
react/lib/components/Widget/AltpaymentWidget.tsxreact/lib/tests/components/AltpaymentWidget.test.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- react/lib/components/Widget/AltpaymentWidget.tsx
1 participant
Summary by CodeRabbit