Fix/client ux UI - #120
Fix/client ux UI#120
Conversation
|
Warning Review limit reached
Next review available in: 18 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (9)
📝 WalkthroughWalkthroughPR cập nhật luồng đăng nhập Google, điều hướng quay lại sau xác thực, đồng bộ cache và trạng thái đăng xuất. Ngoài ra, nhiều trang người dùng được làm mới giao diện, cùng với quy tắc an toàn mới trong ChangesLuồng xác thực và trạng thái phiên
Cập nhật giao diện người dùng
Quy tắc an toàn cho agent
Estimated code review effort: 4 (Complex) | ~45 minutes Sequence Diagram(s)sequenceDiagram
participant GoogleOAuth
participant CallBackGoogle
participant AppVue
participant UserAPI
GoogleOAuth->>CallBackGoogle: Trả token OAuth
CallBackGoogle->>AppVue: Chuyển token qua google_token
AppVue->>UserAPI: Gọi /user
AppVue->>UserAPI: Gọi /client/cart/merge nếu có cart_session_id
AppVue->>AppVue: Cập nhật cache và phát auth-status-changed
Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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: 2
🧹 Nitpick comments (2)
frontend/src/pages/user/shop/Index.vue (1)
1638-1646: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueLoại bỏ CSS trùng lặp cho
text-gold-gradient.Class
.text-gold-gradientđã được định nghĩa toàn cục trongApp.vue(kèm theo các cờ!important). Việc định nghĩa lại ở đây là không cần thiết và vi phạm nguyên tắc DRY. Bạn nên xóa khối CSS này để sử dụng style dùng chung của ứng dụng.♻️ Đề xuất sửa đổi
-/* PREMIUM BANNER CSS */ -.text-gold-gradient { - background: linear-gradient(135deg, `#e7ce7d` 0%, `#f9f0d1` 50%, `#d4af37` 100%); - -webkit-background-clip: text; - background-clip: text; - color: transparent; - text-shadow: 0 2px 10px rgba(231, 206, 125, 0.2); - padding: 0.2em 0; - line-height: 1.3; -} - .premium-category-item {🤖 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 `@frontend/src/pages/user/shop/Index.vue` around lines 1638 - 1646, Remove the local .text-gold-gradient CSS block from the page styles in Index.vue, allowing the shared global definition in App.vue to provide the styling.frontend/src/App.vue (1)
79-101: 📐 Maintainability & Code Quality | 🔵 Trivial | 🏗️ Heavy liftLogic vòng đời phiên đăng nhập/đăng xuất bị lặp lại độc lập ở 4 nơi, đã gây lệch hành vi.
Cả bốn vị trí đều tự triển khai riêng phần "đồng bộ sau đăng nhập" hoặc "dọn dẹp khi đăng xuất" thay vì dùng một composable chung (
useAuthSessionchẳng hạn), và điều này đã tạo ra sự khác biệt quan sát được:App.vuenuốt lỗi merge-cart im lặng cònLogin.vuelog lỗi;Header.vuechỉ xoá 2 key localStorage khi đăng xuất cònProfileSidebar.vuexoá toàn bộlocalStorage/sessionStorage. Gộp các thao tác này vào một composable dùng chung sẽ loại bỏ nguy cơ lệch pha khi một trong các nơi được sửa mà quên sửa các nơi còn lại.
frontend/src/App.vue#L79-L101: trích xuất khối lưu token/fetch/user/merge cart/invalidate cache/dispatch event thành một hàm dùng chung (ví dụsyncAfterLogin(token)).frontend/src/pages/user/auth/Login.vue#L142-L182: gọi cùng hàmsyncAfterLoginthay vì lặp lại logic (bao gồm cả việc log lỗi merge-cart thống nhất).frontend/src/components/user/Header.vue#L520-L537: dùng cùng hàmclearAuthSession()dùng chung vớiProfileSidebar.vueđể đảm bảo phạm vi xoá localStorage/sessionStorage nhất quán.frontend/src/components/ui/ProfileSidebar.vue#L319-L327: dùng cùng hàmclearAuthSession()nói trên, quyết định rõ ràng phạm vi xoá (toàn bộ hay chỉ các key liên quan auth) áp dụng thống nhất cho cả hai nơi.🤖 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 `@frontend/src/App.vue` around lines 79 - 101, Gộp logic vòng đời phiên đăng nhập/đăng xuất vào composable dùng chung với các hàm syncAfterLogin và clearAuthSession, thống nhất xử lý lỗi merge-cart và phạm vi xoá storage. Tại frontend/src/App.vue:79-101, trích xuất toàn bộ luồng đồng bộ sau đăng nhập; tại frontend/src/pages/user/auth/Login.vue:142-182, gọi lại syncAfterLogin. Tại frontend/src/components/user/Header.vue:520-537 và frontend/src/components/ui/ProfileSidebar.vue:319-327, thay logic dọn dẹp riêng bằng clearAuthSession và áp dụng cùng một phạm vi localStorage/sessionStorage.
🤖 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 `@frontend/src/pages/user/auth/CallBackGoogle.vue`:
- Around line 1-34: Update the Google callback flow in CallBackGoogle.vue to
store the received token directly in localStorage under auth_token, set a
lightweight pending_google_sync flag for App.vue, and redirect with
router.replace(redirectPath) without adding google_token to the URL. Update
App.vue’s synchronization logic to detect pending_google_sync instead of reading
the raw token from route.query.google_token, while preserving existing error and
fallback redirects.
In `@frontend/src/pages/user/auth/Login.vue`:
- Around line 164-184: Normalize the redirect selection in the login success
flow before the setTimeout navigation: accept only a string relative path,
reject arrays, absolute or malformed URLs, and use '/' as the fallback. Do not
use redirect_after_login as a fallback for ordinary login, while preserving the
existing admin-route protection, cleanup, cache invalidation, event dispatch,
and router.push behavior in the surrounding login handler.
---
Nitpick comments:
In `@frontend/src/App.vue`:
- Around line 79-101: Gộp logic vòng đời phiên đăng nhập/đăng xuất vào
composable dùng chung với các hàm syncAfterLogin và clearAuthSession, thống nhất
xử lý lỗi merge-cart và phạm vi xoá storage. Tại frontend/src/App.vue:79-101,
trích xuất toàn bộ luồng đồng bộ sau đăng nhập; tại
frontend/src/pages/user/auth/Login.vue:142-182, gọi lại syncAfterLogin. Tại
frontend/src/components/user/Header.vue:520-537 và
frontend/src/components/ui/ProfileSidebar.vue:319-327, thay logic dọn dẹp riêng
bằng clearAuthSession và áp dụng cùng một phạm vi localStorage/sessionStorage.
In `@frontend/src/pages/user/shop/Index.vue`:
- Around line 1638-1646: Remove the local .text-gold-gradient CSS block from the
page styles in Index.vue, allowing the shared global definition in App.vue to
provide the styling.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: e17dba62-ff12-4b0d-8dff-4eb3ba425b0b
📒 Files selected for processing (21)
AGENTS.mdfrontend/src/App.vuefrontend/src/components/ui/ProfileSidebar.vuefrontend/src/components/user/Header.vuefrontend/src/composables/useWishlist.jsfrontend/src/main.jsfrontend/src/pages/user/about/Index.vuefrontend/src/pages/user/auth/CallBackGoogle.vuefrontend/src/pages/user/auth/Login.vuefrontend/src/pages/user/auth/Register.vuefrontend/src/pages/user/checkout/Index.vuefrontend/src/pages/user/combo/Detail.vuefrontend/src/pages/user/combo/Index.vuefrontend/src/pages/user/contact/Index.vuefrontend/src/pages/user/favourite/Index.vuefrontend/src/pages/user/goldPrices/GoldPrice.vuefrontend/src/pages/user/news/Index.vuefrontend/src/pages/user/services/Index.vuefrontend/src/pages/user/shop/Index.vuefrontend/src/utils/apiClient.jsfrontend/src/utils/clientApiClient.js
2 participants
cải thiện trải nghiệm người dùng, tránh gián đoạn trải nghiệm khi phải đăng nhập.
Summary by CodeRabbit
Tính năng mới
Cải tiến giao diện
Tài liệu