feat(auth): 登录回调先跳转再拉用户,优化 callback 页与 useAuth#317
Conversation
- useAuth: handleAuthSuccess 先安排跳转再后台 getCurrentUser,避免卡在「正在跳转」 - useAuth: 增加 client-side 未生效时的整页跳转兜底,移除所有 console - auth/callback: 优化回调页逻辑与文案,抽取常量与工具函数,改进无障碍 - types: AuthResponse 恢复简洁注释 Made-with: Cursor
❌ Deploy Preview for ornate-blancmange-89db6b failed. Why did it fail? →
|
Summary of ChangesHello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! 此拉取请求旨在全面优化用户认证流程,特别是登录成功后的用户体验。通过调整认证成功后的跳转策略,确保用户能够更快地进入目标页面,同时在后台异步加载用户资料。此外,还增强了认证回调页面的稳定性和可访问性,并对相关代码进行了清理和标准化,以提高整体代码质量。 Highlights
Changelog
Activity
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
There was a problem hiding this comment.
Code Review
这个 PR 做的很棒!通过将认证流程改为“先跳转,后获取用户信息”的模式,极大地优化了用户在登录回调页的体验。代码重构质量很高,主要体现在:
useAuthhook 逻辑更清晰,移除了大量调试日志,并引入了常量和辅助函数,增强了代码的可读性和可维护性。handleAuthSuccess函数的重构是本次优化的核心,通过异步获取用户信息,避免了 API 请求阻塞页面跳转,同时加入了window.location.href作为备用跳转方案,非常稳健。callback/page.tsx组件也得到了全面的改进,包括代码结构、UX(增加了手动跳转链接)和可访问性(a11y)支持。
整体而言,这是一次高质量的重构和功能优化。我只发现一个可以微调的小细节。
| mutationFn: async ({ | ||
| authData, | ||
| redirectUrl, | ||
| }: { | ||
| authData: AuthResponse; | ||
| redirectUrl?: string; | ||
| }) => { | ||
| return { authData, redirectUrl }; | ||
| }, | ||
| }) => ({ authData, redirectUrl }), |
There was a problem hiding this comment.
useTokenLogin 中的 mutationFn 被标记为 async,但其内部没有使用 await,而是直接返回一个对象。这里的 async 关键字是多余的。
为了使代码更简洁并准确反映其同步行为,可以移除 async。react-query 的 useMutation 可以很好地处理同步函数和返回 Promise 的异步函数。
| mutationFn: async ({ | |
| authData, | |
| redirectUrl, | |
| }: { | |
| authData: AuthResponse; | |
| redirectUrl?: string; | |
| }) => { | |
| return { authData, redirectUrl }; | |
| }, | |
| }) => ({ authData, redirectUrl }), | |
| mutationFn: ({ | |
| authData, | |
| redirectUrl, | |
| }: { | |
| authData: AuthResponse; | |
| redirectUrl?: string; | |
| }) => ({ authData, redirectUrl }), |
PR 描述
PR 类型
Issue 关联
Closes #
其他信息