fix(web): stake-input-error-display #1797
Conversation
|
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. 🔧 ast-grep (0.31.1)web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsxAn unexpected error occurred while running ast-grep. WalkthroughThe pull request introduces state management improvements for the stake and withdraw functionality in the Courts module. Changes are focused on the Changes
Possibly related PRs
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
❌ Deploy Preview for kleros-v2-testnet failed. Why did it fail? →
|
✅ Deploy Preview for kleros-v2-neo ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
✅ Deploy Preview for kleros-v2-university ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🔭 Outside diff range comments (1)
web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx (1)
Line range hint
249-260: Add cleanup to prevent stale error messages.The useEffect hook should clean up error messages when unmounting to prevent stale states.
useEffect(() => { if (isPopupOpen) return; if ( action === ActionType.stake && targetStake !== 0n && courtDetails && targetStake < BigInt(courtDetails.court?.minStake) ) { setErrorMsg(`Min Stake in court is: ${formatETH(courtDetails?.court?.minStake)}`); } else if (setStakeError || allowanceError) { setErrorMsg(parseWagmiError(setStakeError || allowanceError)); } + return () => setErrorMsg(undefined); }, [setStakeError, setErrorMsg, targetStake, courtDetails, allowanceError, isPopupOpen, action]);
🧹 Nitpick comments (4)
web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx (1)
Line range hint
124-130: Consider simplifying the conditional rendering.The condition can be more concise while maintaining the same logic.
- {phase !== Phases.staking && !isLoading ? ( + {!isLoading && phase !== Phases.staking && ( <InfoContainer> <Divider /> <StyledInfoCard msg={`The ${action === ActionType.stake ? "stake" : "withdraw"} might be delayed by ~1 hr.`} /> </InfoContainer> - ) : null} + )}web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx (1)
110-111: Consider consolidating error message logic.The error message and variant logic could be simplified using a single derived value.
+ const fieldError = !isPopupOpen && errorMsg ? errorMsg : undefined; <StyledField value={uncommify(amount)} onChange={(e) => { setAmount(e); }} placeholder={isStaking ? "Amount to stake" : "Amount to withdraw"} - message={isPopupOpen ? undefined : (errorMsg ?? undefined)} - variant={!isUndefined(errorMsg) && !isPopupOpen ? "error" : "info"} + message={fieldError} + variant={fieldError ? "error" : "info"} formatter={(number: string) => (number !== "" ? commify(roundNumberDown(Number(number))) : "")} />web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx (2)
Line range hint
281-289: Consider using try-finally for cleanup in closePopup.The cleanup operations should run even if there's an error in any of the state updates.
const closePopup = () => { - setErrorMsg(undefined); - setIsPopupOpen(false); - setIsSuccess(false); - setAmount(""); - setPopupStepsState(undefined); - if (controllerRef.current) { - controllerRef.current.abort(); - } + try { + setErrorMsg(undefined); + setIsPopupOpen(false); + setIsSuccess(false); + setAmount(""); + setPopupStepsState(undefined); + } finally { + if (controllerRef.current) { + controllerRef.current.abort(); + } + } };
54-62: Props destructuring could be more concise.Consider using object destructuring in a single line for better readability.
-const StakeWithdrawButton: React.FC<IActionButton> = ({ - amount, - parsedAmount, - action, - setErrorMsg, - setAmount, - isPopupOpen, - setIsPopupOpen, -}) => { +const StakeWithdrawButton: React.FC<IActionButton> = ({ amount, parsedAmount, action, setErrorMsg, setAmount, isPopupOpen, setIsPopupOpen }) => {
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx(4 hunks)web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx(3 hunks)web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx(2 hunks)
❌ Deploy Preview for kleros-v2-testnet-devtools failed. Why did it fail? →
|
alcercu
dismissed stale reviews from kemuru, coderabbitai[bot], and themself
via
24a9c9c
|
Code Climate has analyzed commit 24a9c9c and detected 2 issues on this pull request. Here's the issue category breakdown:
View more on Code Climate. |
|
PR-Codex overview
This PR focuses on enhancing the
StakeWithdrawPopupand related components by introducing loading states and managing popup visibility. It improves user experience by controlling error messages and popup states during staking and withdrawal actions.Detailed summary
isLoadingstate toStakeWithdrawPopup.isLoading.isPopupOpenstate inInputDisplay.InputDisplaybased onisPopupOpen.StakeWithdrawButtonto acceptisPopupOpenandsetIsPopupOpenprops.isPopupOpenstate fromStakeWithdrawButton.Summary by CodeRabbit
New Features
Bug Fixes
Documentation