[TASK-7269] feat: login button on setup#554
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThe changes in this pull request primarily enhance the Changes
Possibly related PRs
Suggested reviewers
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: 1
🧹 Outside diff range and nitpick comments (3)
src/components/Setup/Views/Welcome.tsx (2)
44-45: Consider accessibility improvements for the Card componentWhile the Card layout looks good, consider adding proper ARIA attributes for better accessibility.
-<Card className="mx-auto w-full max-w-md border-2 shadow-lg"> +<Card className="mx-auto w-full max-w-md border-2 shadow-lg" role="region" aria-label="Welcome">Also applies to: 91-92
79-88: Consider adding loading text for better UXThe Next button shows a loading state but doesn't indicate what's happening.
<Button loading={isLoading || isChanging} shadowSize="4" onClick={() => { handleNext<'passkey'>(async () => true, { handle }) }} disabled={!isValid || isChanging || isLoading} + loadingText="Creating wallet..." > Next </Button>src/context/walletContext/zeroDevContext.context.tsx (1)
Line range hint
189-196: Consider adding error type checking before propagationThe error handling could be more specific to help UI layer handle different scenarios.
try { // ... existing code ... } catch (e) { console.error('Error logging in', e) + // Categorize error types + if (e instanceof WebAuthnError) { + throw new PasskeyError('Failed to validate passkey', { cause: e }); + } else if (e instanceof NetworkError) { + throw new NetworkError('Failed to connect to passkey server', { cause: e }); + } throw e } finally { await fetchUser() setIsLoggingIn(false) }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (2)
src/components/Setup/Views/Welcome.tsx(2 hunks)src/context/walletContext/zeroDevContext.context.tsx(1 hunks)
🔇 Additional comments (3)
src/components/Setup/Views/Welcome.tsx (2)
1-1: LGTM: Required imports added correctly
The new imports for useZeroDev and useRouter are properly added to support the login functionality.
Also applies to: 7-8
16-18: LGTM: State management for login flow
The component correctly initializes required state variables:
isLoggingInfrom useZeroDev for loading stateisSignUpfor toggling between login/signup viewsuseRouterfor navigation after successful login
src/context/walletContext/zeroDevContext.context.tsx (1)
193-193: LGTM: Proper error propagation added
Adding throw e ensures that login errors are properly propagated to the UI layer for handling.
| <Button | ||
| shadowSize="4" | ||
| loading={isLoggingIn} | ||
| variant="stroke" | ||
| onClick={() => { | ||
| handleLogin() | ||
| .then(() => push('/home')) | ||
| .catch((_e) => toast.error('Error logging in')) | ||
| }} | ||
| > | ||
| Login | ||
| </Button> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Improve error handling for login flow
The current error handling only shows a generic message. Consider:
- Providing more specific error messages based on error types
- Adding retry logic for transient failures
-onClick={() => {
- handleLogin()
- .then(() => push('/home'))
- .catch((_e) => toast.error('Error logging in'))
-}}
+onClick={() => {
+ handleLogin()
+ .then(() => push('/home'))
+ .catch((e) => {
+ console.error('Login failed:', e);
+ if (e.name === 'PasskeyError') {
+ toast.error('Passkey verification failed. Please try again.');
+ } else if (e.name === 'NetworkError') {
+ toast.error('Network error. Please check your connection.');
+ } else {
+ toast.error('Error logging in. Please try again later.');
+ }
+ })
+}}Committable suggestion skipped: line range outside the PR's diff.
Hugo0
left a comment
Hugo0
left a comment
There was a problem hiding this comment.
good on reusing components
2 participants
Add login button to welcome page so existing users can access
Summary by CodeRabbit
New Features
Bug Fixes
Documentation