Adding retry button for eligibility flow #5004
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThis pull request introduces a new "retry" label across multiple localization files (Catalan, English, and Spanish), ensuring consistency in messaging. Additionally, it updates the error handling workflow in the donor eligibility card component by replacing the existing inline toast with an error-specific version and incorporating a retry button that invokes the refresh functionality when a passport error occurs. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Card as QFDonorEligibilityCard
participant Toast as ErrorInlineToast
User ->> Card: Triggers action (e.g., form submission)
Card ->> Card: Detects passport error state (EPassportState.ERROR)
Card ->> Toast: Displays ErrorInlineToast with ReplyButton
User ->> Card: Clicks ReplyButton to retry
Card ->> Card: Invokes refreshScore function
Suggested labels
Suggested reviewers
Poem
Tip 🌐 Web search-backed reviews and chat
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 (
|
![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
🧹 Nitpick comments (2)
src/components/views/userProfile/QFDonorEligibilityCard.tsx (2)
271-292: Remove duplicate onClick handler and simplify structure.The current implementation has redundant onClick handlers and unnecessary wrapper components.
Apply this diff to simplify the code:
{passportState === EPassportState.ERROR && ( <> <ErrorInlineToast type={EToastType.Error} message={formatMessage({ id: 'label.passport.error', })} /> - <ReplyButton onClick={refreshScore}> - <FlexCenter gap='8px'> - <Button - label={formatMessage({ - id: 'label.retry', - })} - size='medium' - buttonType='primary' - onClick={refreshScore} - /> - </FlexCenter> - </ReplyButton> + <ReplyButton> + <Button + label={formatMessage({ + id: 'label.retry', + })} + size='medium' + buttonType='primary' + onClick={refreshScore} + /> + </ReplyButton> </> )}
376-391: Improve styled components implementation.The styled components have several areas for improvement:
- Avoid using !important as it makes styles harder to maintain
- Consider extracting the shadow color to a constant
- The hover state should be more consistent with the design system
Apply this diff to improve the implementation:
const ErrorInlineToast = styled(InlineToast)` margin-bottom: 0.5em; `; const ReplyButton = styled.div` & button { color: ${brandColors.pinky[500]}; background-color: white; - font-size: 14px !important; + font-size: 14px; - filter: drop-shadow(0px 3px 20px rgba(83, 38, 236, 0.13)); + filter: drop-shadow(0px 3px 20px ${brandColors.pinky[100]}); } & button:hover { color: white; + background-color: ${brandColors.pinky[500]}; } `;
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
lang/ct.json(1 hunks)lang/en.json(1 hunks)lang/es.json(1 hunks)src/components/views/userProfile/QFDonorEligibilityCard.tsx(2 hunks)
✅ Files skipped from review due to trivial changes (3)
- lang/es.json
- lang/en.json
- lang/ct.json
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: build
🔇 Additional comments (1)
src/components/views/userProfile/QFDonorEligibilityCard.tsx (1)
271-391: LGTM! The retry functionality is well-implemented.The changes successfully implement the retry button for the eligibility flow, with proper error handling and consistent UI styling.
divine-comedian
requested review from
maryjaf
and removed request for
maryjaf
|
Thanks @kkatusic |
|
@kkatusic ready to merge! |
Summary by CodeRabbit