update

docs/tasks_1_Authentication.md

@@ -1,41 +1,41 @@
 # Authentication
 
-## Chức năng 1: Layout cơ bản (Header, Footer, Navbar, SidebarAdmin)
+## Function 1: Basic Layout (Header, Footer, Navbar, SidebarAdmin)
 
-### Mục tiêu
-    Tạo layout nền tảng cho toàn bộ hệ thống và cấu trúc render nội dung theo route.
+### Objective
+    Create a foundational layout for the entire system and structure content rendering by route.
 
-#### Nhiệm vụ chi tiết
-- Tạo thư mục:
+#### Detailed Tasks
+- Create directory:
     ```
     src/components/layouts/
     ```
-- Bao gồm:
+- Include:
     + Header.jsx
     + Footer.jsx
     + Navbar.jsx
     + SidebarAdmin.jsx
     + LayoutMain.jsx
-- Dùng <Outlet /> trong LayoutMain để render nội dung động.
-- Navbar thay đổi tùy trạng thái đăng nhập:
-    + Nếu chưa login → hiển thị nút “Đăng nhập / Đăng ký”.
-    + Nếu đã login → hiển thị avatar, tên user và nút “Đăng xuất”.
-- SidebarAdmin chỉ hiển thị với role = admin.
+- Use <Outlet /> in LayoutMain to render dynamic content.
+- Navbar changes based on login status:
+    + If not logged in → display "Login / Register" button.
+    + If logged in → display avatar, user name and "Logout" button.
+- SidebarAdmin only displays with role = admin.
 
-### Kết quả mong đợi
-1. Layout tổng thể hiển thị ổn định.
-2. Navbar hiển thị nội dung động theo trạng thái người dùng.
-3. Giao diện responsive, tương thích desktop/mobile.
+### Expected Results
+1. Overall layout displays stably.
+2. Navbar displays dynamic content based on user status.
+3. Responsive interface, compatible with desktop/mobile.
 
 ---
 
-## Chức năng 2: Cấu hình Routing (react-router-dom)
+## Function 2: Routing Configuration (react-router-dom)
 
-### Mục tiêu
-    Thiết lập hệ thống định tuyến chuẩn, có bảo vệ route theo role.
+### Objective
+    Set up a standard routing system with role-based route protection.
 
-#### Nhiệm vụ chi tiết
-- Cấu trúc route chính:
+#### Detailed Tasks
+- Main route structure:
     ```
     <Route path="/" element={<LayoutMain />}>
         <Route index element={<HomePage />} />
@@ -51,25 +51,25 @@
     <Route path="/dashboard" element={<ProtectedRoute><Dashboard /></ProtectedRoute>} />
     <Route path="/admin/*" element={<AdminRoute><AdminModule /></AdminRoute>} />
     ```
-- Dùng ProtectedRoute và AdminRoute để kiểm tra:
+- Use ProtectedRoute and AdminRoute to check:
     + isAuthenticated
     + role === "admin"
 
-### Kết quả mong đợi
-1. Người dùng không đăng nhập bị redirect về /login.
-2. AdminRoute chỉ cho phép admin truy cập.
-3. Tất cả route hoạt động mượt, không lỗi vòng lặp redirect.
+### Expected Results
+1. Unauthenticated users are redirected to /login.
+2. AdminRoute only allows admin access.
+3. All routes work smoothly, no redirect loop errors.
 
 ---
 
-## Chức năng 3: useAuthStore (Zustand Store)
+## Function 3: useAuthStore (Zustand Store)
 
-### Mục tiêu
-    Quản lý trạng thái xác thực toàn cục (token, userInfo, role).
+### Objective
+    Manage global authentication state (token, userInfo, role).
 
-#### Nhiệm vụ chi tiết
-- Tạo src/stores/useAuthStore.js
-- Cấu trúc:
+#### Detailed Tasks
+- Create src/stores/useAuthStore.js
+- Structure:
     ```
     const useAuthStore = create((set) => ({
         token: localStorage.getItem("token") || null,
@@ -82,132 +82,132 @@
         resetPassword: async (payload) => { ... },
     }));
     ```
-- Khi đăng nhập thành công:
-    + Lưu token + userInfo vào localStorage.
-- Khi logout:
-    + Xóa localStorage và reset state.
+- When login succeeds:
+    + Save token + userInfo to localStorage.
+- When logout:
+    + Clear localStorage and reset state.
 
-### Kết quả mong đợi
-1. Toàn bộ thông tin user được quản lý tập trung.
-2. Duy trì đăng nhập sau khi reload trang.
-3. Dễ dàng truy cập userInfo trong mọi component.
+### Expected Results
+1. All user information is managed centrally.
+2. Maintain login after page reload.
+3. Easy access to userInfo in any component.
 
 --- 
 
-## Chức năng 4: Form Login
+## Function 4: Login Form
 
-### Mục tiêu
-    Cho phép người dùng đăng nhập hệ thống.
+### Objective
+    Allow users to log into the system.
 
-#### Nhiệm vụ chi tiết
-- Tạo LoginPage.jsx
-- Dùng React Hook Form + Yup validate:
-    + Email hợp lệ
-    + Mật khẩu ≥ 8 ký tự
+#### Detailed Tasks
+- Create LoginPage.jsx
+- Use React Hook Form + Yup validation:
+    + Valid email
+    + Password ≥ 8 characters
 - API:
     ```
     POST /api/auth/login
     ```
-- Sau khi đăng nhập thành công:
-    + Lưu token vào localStorage.
-    + Gọi setUser() để cập nhật Zustand.
-    + Redirect về /dashboard.
-    + Gửi email POST /api/notify/login-success.
-- UX nâng cao:
-    + Nút loading khi đang gửi form.
-    + “Hiện/Ẩn mật khẩu”.
-    + “Nhớ đăng nhập” → lưu 7 ngày.
+- After successful login:
+    + Save token to localStorage.
+    + Call setUser() to update Zustand.
+    + Redirect to /dashboard.
+    + Send email POST /api/notify/login-success.
+- Enhanced UX:
+    + Loading button when submitting form.
+    + "Show/Hide password".
+    + "Remember me" → save for 7 days.
 
-### Kết quả mong đợi
-1. Đăng nhập hoạt động mượt, hiển thị thông báo lỗi rõ ràng.
-2. Email được gửi khi login thành công.
-3. Chuyển hướng đúng theo vai trò user.
+### Expected Results
+1. Login works smoothly, displays clear error messages.
+2. Email is sent when login succeeds.
+3. Redirect correctly based on user role.
 
 ---
 
-## Chức năng 5: Form Register
+## Function 5: Register Form
 
-### Mục tiêu
-    Cho phép người dùng đăng ký tài khoản mới.
+### Objective
+    Allow users to register a new account.
 
-#### Nhiệm vụ chi tiết
-- Tạo RegisterPage.jsx
-- Dùng React Hook Form + Yup validate:
-    + Họ tên không rỗng
-    + Email hợp lệ
-    + Mật khẩu ≥ 8 ký tự, có ký tự đặc biệt
+#### Detailed Tasks
+- Create RegisterPage.jsx
+- Use React Hook Form + Yup validation:
+    + Full name not empty
+    + Valid email
+    + Password ≥ 8 characters, contains special characters
 - API:
     ```
     POST /api/auth/register
     ```
-- Sau khi đăng ký thành công:
-    + Hiển thị toast “Đăng ký thành công, vui lòng đăng nhập”.
-    + Redirect về /login.
+- After successful registration:
+    + Display toast "Registration successful, please login".
+    + Redirect to /login.
 
-### Kết quả mong đợi
-1. Người dùng tạo tài khoản mới thành công.
-2. Validate chặt chẽ, UX mượt mà.
-3. Giao diện thống nhất với form login.
+### Expected Results
+1. Users can create new accounts successfully.
+2. Strict validation, smooth UX.
+3. Interface consistent with login form.
 
 ---
 
-## Chức năng 6: Quên mật khẩu (Forgot Password)
+## Function 6: Forgot Password
 
-### Mục tiêu
-    Cung cấp chức năng gửi email reset mật khẩu.
+### Objective
+    Provide functionality to send password reset email.
 
-#### Nhiệm vụ chi tiết
-- Tạo ForgotPasswordPage.jsx
+#### Detailed Tasks
+- Create ForgotPasswordPage.jsx
 - API:
     ```
     POST /api/auth/forgot-password
     ```
-- Sau khi gửi thành công:
-    + Hiển thị thông báo “Vui lòng kiểm tra email để đặt lại mật khẩu.”
-    + Backend gửi link reset có token dạng:
+- After successful send:
+    + Display message "Please check your email to reset password."
+    + Backend sends reset link with token:
         ```
         https://domain.com/reset-password/:token
         ```
 
-### Kết quả mong đợi
-1. Gửi email thành công.
-2. UX rõ ràng, có loading và thông báo lỗi.
-3. Giao diện thân thiện.
+### Expected Results
+1. Email sent successfully.
+2. Clear UX, with loading and error messages.
+3. User-friendly interface.
 
 ---
 
-## Chức năng 7: Đặt lại mật khẩu (Reset Password)
+## Function 7: Reset Password
 
-### Mục tiêu
-    Cho phép người dùng đổi mật khẩu thông qua link email.
+### Objective
+    Allow users to change password through email link.
 
-#### Nhiệm vụ chi tiết
-- Tạo ResetPasswordPage.jsx
-- Validate:
-    + Mật khẩu mới ≥ 8 ký tự, chứa ký tự đặc biệt
-    + Nhập lại mật khẩu trùng khớp
+#### Detailed Tasks
+- Create ResetPasswordPage.jsx
+- Validation:
+    + New password ≥ 8 characters, contains special characters
+    + Confirm password matches
 - API:
     ```
     POST /api/auth/reset-password
     ```
-- Sau khi đổi mật khẩu thành công:
-    + Gửi email xác nhận POST /api/notify/reset-success.
-    + Redirect về /login.
+- After successful password change:
+    + Send confirmation email POST /api/notify/reset-success.
+    + Redirect to /login.
 
-### Kết quả mong đợi
-1. Mật khẩu được cập nhật thành công.
-2. Gửi email thông báo thành công.
-3. Bảo vệ token hết hạn (invalid token → redirect về forgot-password).
+### Expected Results
+1. Password updated successfully.
+2. Success notification email sent.
+3. Protect expired token (invalid token → redirect to forgot-password).
 
 --- 
 
-## Chức năng 8: Phân quyền & Bảo vệ route (ProtectedRoute / AdminRoute)
+## Function 8: Permissions & Route Protection (ProtectedRoute / AdminRoute)
 
-### Mục tiêu
-    Chặn truy cập trái phép và bảo vệ các route quan trọng.
+### Objective
+    Block unauthorized access and protect important routes.
 
-#### Nhiệm vụ chi tiết
-- Tạo component ProtectedRoute.jsx:
+#### Detailed Tasks
+- Create ProtectedRoute.jsx component:
     ```
     const ProtectedRoute = ({ children }) => {
     const { isAuthenticated } = useAuthStore();
@@ -216,13 +216,13 @@
     };
     ```
 
-- Tạo AdminRoute.jsx:
+- Create AdminRoute.jsx:
     ```
     const AdminRoute = ({ children }) => {
     const { userInfo } = useAuthStore();
     return userInfo?.role === "admin" ? children : <Navigate to="/" replace />;
     };
     ```
-### Kết quả mong đợi
-1. Chỉ người dùng hợp lệ mới truy cập được route quan trọng.
-2. AdminRoute đảm bảo bảo mật cho module quản trị.
+### Expected Results
+1. Only valid users can access important routes.
+2. AdminRoute ensures security for admin module.