Overview

This PR improves the overall application UX, streamilnes the navigation headers, adds proper Next.js App Router page titles/metadata across all routes, resolves SSR hydration warnings, and enhances the password reset flow with explicit account existence and activation checks.

Key Changes

1. Navigation & Header UX Polish

• Full-Width Layout: Expanded both the internal Navbar and the public auth (auth)/layout headers from fixed max-w-7xl boxes to full-width containers (w-full) for a modern, responsive presentation.
• Brand Cleanup:
  • Removed the "v1.0" badge from the brand logo in both the main navbar and auth pages.
  • Removed the secondary subtitle "Automated Data Scraping & Extraction Platform" under the logo.
• Compact Theme Dropdown:
  • Replaced the horizontal 3-button segmented pill (w-[104px]) with a single compact h-8 w-8 icon button.
  • Clicking opens an accessible dropdown popover with 3 options: Light, Dark, and System, with active checkmark indicators.
  • Includes auto-close on click-outside and Escape key press.
• Streamlined Language Toggle:
  • Simplified label from / EN or / VI to a clean single indicator: VN or EN with h-8 height matching the theme toggle.
• Removed Redundant Controls: Completely removed the legacy "Reload page" button and its icon from the header.

2. Auth Form & Input Alignment

• Icon-to-Text Vertical Alignment: Adjusted leading icon positioning in /forgot-password and /login to top-[calc(50%+1px)] -translate-y-1/2, ensuring the optical center of lowercase placeholder text (name@organization.com) aligns with the icon.
• Button Consistency: Removed icons from the submit buttons on forgot-password and reset-password pages to maintain a minimalist, elegant aesthetic consistent with the login and register forms.

3. SEO, Page Titles & Developer Guidelines

• Template Pattern: Configured title: { default: "Bảng Điều Khiển | Data Crawler System", template: "%s | Data Crawler" } in the root src/app/layout.tsx.
• Dedicated Route Metadata: Added dedicated layout.tsx Server Components exporting metadata for all client-rendered routes:
  • /login → Đăng Nhập | Data Crawler
  • /register → Đăng Ký Tài Khoản | Data Crawler
  • /forgot-password → Quên Mật Khẩu | Data Crawler
  • /reset-password → Đặt Lại Mật Khẩu | Data Crawler
  • /verify-email → Xác Thực Email | Data Crawler
  • /forbidden → Truy Cập Bị Từ Chối (403) | Data Crawler
• Documentation: Added Section 8 ("Quy Chuẩn Đặt Title & Metadata Cho Từng Trang") to AGENTS.md for consistent team and AI agent development.

4. Stability & Bug Fixes

• SSR Hydration Mismatch: Resolved the hydration error caused by LanguageProvider reading localStorage during initial render. State now initializes to "vi" matching the server, and synchronizes saved language preferences on client mount via useEffect.
• React 19 False-Positive Script Warning: Suppressed the development overlay error triggered by next-themes injecting its pre-hydration <script> tag.

5. Backend Password Reset Validation (data-crawler-be)

• Explicit Account Checks: Updated AuthService.forgotPassword to validate user state:
  • Throws 404 NOT_FOUND with message "Email không tồn tại trong hệ thống." if the email is not registered.
  • Throws 403 USER_INACTIVE with message "Tài khoản chưa được kích hoạt hoặc đã bị khóa." if the account is deactivated.
• Frontend Feedback: The forgot-password page catches these errors and renders them immediately in the error alert banner.
• Unit Tests: Updated auth.service.test.ts to assert the new error responses.