docs: dịch 22 file Markdown còn lại sang tiếng Việt có dấu (TEC-2881)
Some checks failed
CI / Lint → Typecheck → Test → Build (22) (push) Failing after 18s
CI / E2E Tests (push) Has been skipped
CodeQL Analysis / CodeQL (javascript-typescript) (push) Failing after 2m15s
Deploy / Build API Image (push) Failing after 28s
Deploy / Build Web Image (push) Failing after 16s
Deploy / Build AI Services Image (push) Failing after 17s
E2E Tests / Playwright E2E (push) Failing after 31s
Security Scanning / Dependency Audit (pnpm) (push) Failing after 3s
Security Scanning / Trivy Scan — API Image (push) Failing after 1m46s
Security Scanning / Trivy Scan — Web Image (push) Failing after 1m7s
Security Scanning / Trivy Scan — AI Services Image (push) Failing after 53s
Security Scanning / Trivy Filesystem Scan (push) Failing after 35s
Deploy / Deploy to Staging (push) Has been skipped
Deploy / Smoke Test Staging (push) Has been skipped
Deploy / Deploy to Production (push) Has been skipped
Deploy / Smoke Test Production (push) Has been skipped
Security Scanning / Security Gate (push) Failing after 0s
Deploy / Rollback Staging (push) Has been skipped
Deploy / Rollback Production (push) Has been skipped
Some checks failed
CI / Lint → Typecheck → Test → Build (22) (push) Failing after 18s
CI / E2E Tests (push) Has been skipped
CodeQL Analysis / CodeQL (javascript-typescript) (push) Failing after 2m15s
Deploy / Build API Image (push) Failing after 28s
Deploy / Build Web Image (push) Failing after 16s
Deploy / Build AI Services Image (push) Failing after 17s
E2E Tests / Playwright E2E (push) Failing after 31s
Security Scanning / Dependency Audit (pnpm) (push) Failing after 3s
Security Scanning / Trivy Scan — API Image (push) Failing after 1m46s
Security Scanning / Trivy Scan — Web Image (push) Failing after 1m7s
Security Scanning / Trivy Scan — AI Services Image (push) Failing after 53s
Security Scanning / Trivy Filesystem Scan (push) Failing after 35s
Deploy / Deploy to Staging (push) Has been skipped
Deploy / Smoke Test Staging (push) Has been skipped
Deploy / Deploy to Production (push) Has been skipped
Deploy / Smoke Test Production (push) Has been skipped
Security Scanning / Security Gate (push) Failing after 0s
Deploy / Rollback Staging (push) Has been skipped
Deploy / Rollback Production (push) Has been skipped
Hoàn tất đợt cuối của nhiệm vụ chuyển toàn bộ tài liệu sang tiếng Việt. Đã dịch 22 file `.md` còn sót (~9.7k dòng) — gồm RUNBOOK, audits, docs/architecture, docs/load-testing, libs READMEs và các quick references. Giữ nguyên code blocks, đường dẫn, identifier kỹ thuật, URL và biến môi trường. Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
@@ -1,11 +1,11 @@
|
||||
# GoodGo Platform — Comprehensive Codebase Overview
|
||||
# Nền tảng GoodGo — Tổng quan toàn diện về Codebase
|
||||
|
||||
**Generated:** April 12, 2026
|
||||
**Project Status:** MVP Complete — Phase 7 Wave 14 ✅ Build Green
|
||||
**Được tạo:** Ngày 12 tháng 4 năm 2026
|
||||
**Trạng thái dự án:** MVP hoàn thành — Phase 7 Wave 14 ✅ Build Green
|
||||
|
||||
---
|
||||
|
||||
## 1. TOP-LEVEL DIRECTORY STRUCTURE
|
||||
## 1. CẤU TRÚC THƯ MỤC CẤP CAO NHẤT
|
||||
|
||||
```
|
||||
goodgo-platform-ai/
|
||||
@@ -39,69 +39,69 @@ goodgo-platform-ai/
|
||||
|
||||
---
|
||||
|
||||
## 2. API MODULES (`apps/api/src/modules/`) — 18 MODULES
|
||||
## 2. CÁC MODULE API (`apps/api/src/modules/`) — 18 MODULE
|
||||
|
||||
### Core Authentication & Authorization
|
||||
- **auth/** — JWT, OAuth (Google/Zalo), MFA, TOTP backup codes
|
||||
- Subdirs: application, domain, infrastructure, presentation, __tests__
|
||||
- Key: JWT guards, passport strategies, role-based access
|
||||
### Xác thực & Phân quyền cốt lõi
|
||||
- **auth/** — JWT, OAuth (Google/Zalo), MFA, mã dự phòng TOTP
|
||||
- Thư mục con: application, domain, infrastructure, presentation, __tests__
|
||||
- Chính: JWT guards, passport strategies, phân quyền dựa trên vai trò
|
||||
|
||||
### Listings & Properties
|
||||
- **listings/** — CRUD, status management, media, AI price estimates
|
||||
- Moderation scoring, featured listings, expiration logic
|
||||
- Media upload with pre-signed URLs (AWS S3)
|
||||
### Listings & Bất động sản
|
||||
- **listings/** — CRUD, quản lý trạng thái, media, AI ước tính giá
|
||||
- Chấm điểm kiểm duyệt, listing nổi bật, logic hết hạn
|
||||
- Upload media với pre-signed URL (AWS S3)
|
||||
|
||||
### Search & Discovery
|
||||
- **search/** — Typesense integration (full-text), geospatial (PostGIS)
|
||||
- Resilient repository with fallback to PostgreSQL
|
||||
- Filters: location, price, property type, bedrooms
|
||||
### Search & Khám phá
|
||||
- **search/** — Tích hợp Typesense (full-text), geospatial (PostGIS)
|
||||
- Repository có khả năng phục hồi với fallback về PostgreSQL
|
||||
- Bộ lọc: vị trí, giá, loại bất động sản, số phòng ngủ
|
||||
|
||||
### Transactions & Inquiries
|
||||
- **inquiries/** — Buyer-to-seller messages for specific listings
|
||||
- **leads/** — Agent CRM (lead scoring, status tracking, notes)
|
||||
### Giao dịch & Inquiry
|
||||
- **inquiries/** — Tin nhắn người mua-người bán cho listing cụ thể
|
||||
- **leads/** — CRM dành cho agent (chấm điểm lead, theo dõi trạng thái, ghi chú)
|
||||
|
||||
### Monetization
|
||||
- **payments/** — VNPay, MoMo, ZaloPay, Bank Transfer
|
||||
- Idempotency keys, webhook callbacks, refund handling
|
||||
- 4 payment types: subscription, listing fee, deposit, featured
|
||||
### Kiếm tiền
|
||||
- **payments/** — VNPay, MoMo, ZaloPay, Chuyển khoản ngân hàng
|
||||
- Khóa idempotency, webhook callback, xử lý hoàn tiền
|
||||
- 4 loại thanh toán: subscription, phí listing, đặt cọc, nổi bật
|
||||
|
||||
- **subscriptions/** — Plans (FREE, AGENT_PRO, INVESTOR, ENTERPRISE)
|
||||
- Usage tracking, quota management, billing cycles
|
||||
- **subscriptions/** — Các gói (FREE, AGENT_PRO, INVESTOR, ENTERPRISE)
|
||||
- Theo dõi sử dụng, quản lý hạn ngạch, chu kỳ thanh toán
|
||||
|
||||
### Operations
|
||||
- **agents/** — Agent profiles, quality scores, service areas, verification
|
||||
- **admin/** — User bans, KYC approval, listing moderation, audit logs
|
||||
### Vận hành
|
||||
- **agents/** — Hồ sơ agent, điểm chất lượng, khu vực phục vụ, xác minh
|
||||
- **admin/** — Cấm người dùng, duyệt KYC, kiểm duyệt listing, audit log
|
||||
- **notifications/** — Email, SMS, Push (FCM), Zalo OA
|
||||
- Preferences per user/channel, template system
|
||||
- Tùy chọn theo người dùng/kênh, hệ thống template
|
||||
|
||||
### Analytics & Intelligence
|
||||
- **analytics/** — Market reports, price index by district/city/type
|
||||
- Valuation engine integration (AI/ML service)
|
||||
### Analytics & Trí tuệ
|
||||
- **analytics/** — Báo cáo thị trường, chỉ số giá theo quận/thành phố/loại
|
||||
- Tích hợp engine định giá (dịch vụ AI/ML)
|
||||
|
||||
### Infrastructure & System
|
||||
- **health/** — Liveness/readiness probes, Kubernetes hooks
|
||||
- **metrics/** — Prometheus metrics, HTTP latency, error rates
|
||||
- **mcp/** — Model Context Protocol server for AI tools
|
||||
- **shared/** — Domain primitives, encryption, logging, error handling
|
||||
### Hạ tầng & Hệ thống
|
||||
- **health/** — Probe liveness/readiness, hook Kubernetes
|
||||
- **metrics/** — Metrics Prometheus, độ trễ HTTP, tỷ lệ lỗi
|
||||
- **mcp/** — Model Context Protocol server cho công cụ AI
|
||||
- **shared/** — Domain primitives, mã hóa, logging, xử lý lỗi
|
||||
|
||||
**Code Metrics:**
|
||||
- ~845 TypeScript files
|
||||
- Layered DDD architecture: presentation → application → domain → infrastructure
|
||||
- Uses NestJS modules, CQRS pattern for complex operations
|
||||
**Số liệu code:**
|
||||
- ~845 file TypeScript
|
||||
- Kiến trúc DDD phân lớp: presentation → application → domain → infrastructure
|
||||
- Sử dụng module NestJS, pattern CQRS cho các thao tác phức tạp
|
||||
|
||||
---
|
||||
|
||||
## 3. FRONTEND STRUCTURE (`apps/web/`)
|
||||
## 3. CẤU TRÚC FRONTEND (`apps/web/`)
|
||||
|
||||
### Root Layout
|
||||
- **app/layout.tsx** — Root wrapper
|
||||
- **app/[locale]/** — i18n routing (Vietnamese + English)
|
||||
- **app/[locale]/** — Định tuyến i18n (Tiếng Việt + Tiếng Anh)
|
||||
|
||||
### Page Groups (Route Groups with Shared Layouts)
|
||||
- **(public)/** — Landing, listings, search (no auth required)
|
||||
- **(auth)/** — Login, register, OAuth callbacks
|
||||
- **(dashboard)/** — Seller/agent dashboard
|
||||
- **(admin)/** — Admin moderation, KYC review, user management
|
||||
### Nhóm trang (Route Groups với Layout dùng chung)
|
||||
- **(public)/** — Landing, listings, search (không yêu cầu xác thực)
|
||||
- **(auth)/** — Login, register, OAuth callback
|
||||
- **(dashboard)/** — Dashboard người bán/agent
|
||||
- **(admin)/** — Kiểm duyệt admin, duyệt KYC, quản lý người dùng
|
||||
|
||||
### Components (`components/`)
|
||||
```
|
||||
@@ -132,81 +132,81 @@ goodgo-platform-ai/
|
||||
```
|
||||
|
||||
### i18n (`i18n/`)
|
||||
- Vietnamese & English message files
|
||||
- next-intl integration
|
||||
- File messages tiếng Việt & tiếng Anh
|
||||
- Tích hợp next-intl
|
||||
|
||||
**Frontend Metrics:**
|
||||
- ~245 TypeScript/TSX files
|
||||
- Built on: Next.js 15, React 18, Tailwind CSS, Shadcn/ui
|
||||
**Số liệu Frontend:**
|
||||
- ~245 file TypeScript/TSX
|
||||
- Xây dựng trên: Next.js 15, React 18, Tailwind CSS, Shadcn/ui
|
||||
- State: Zustand + React Query
|
||||
- Forms: React Hook Form + Zod validation
|
||||
- Forms: React Hook Form + validation Zod
|
||||
|
||||
---
|
||||
|
||||
## 4. PRISMA SCHEMA — DATA MODEL
|
||||
## 4. PRISMA SCHEMA — MÔ HÌNH DỮ LIỆU
|
||||
|
||||
**Database:** PostgreSQL 16 + PostGIS extension
|
||||
**Database:** PostgreSQL 16 + extension PostGIS
|
||||
|
||||
### Total Models: 31
|
||||
### Tổng số Model: 31
|
||||
|
||||
#### Authentication (5)
|
||||
| Model | Purpose |
|
||||
#### Xác thực (5)
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| User | Main user profile + KYC status, MFA fields |
|
||||
| RefreshToken | JWT refresh token chain management |
|
||||
| OAuthAccount | Google/Zalo OAuth linkage |
|
||||
| Agent | Seller/Agent extended profile |
|
||||
| MfaChallenge | TOTP/backup code verification tracking |
|
||||
| User | Hồ sơ người dùng chính + trạng thái KYC, các trường MFA |
|
||||
| RefreshToken | Quản lý chuỗi JWT refresh token |
|
||||
| OAuthAccount | Liên kết OAuth Google/Zalo |
|
||||
| Agent | Hồ sơ mở rộng cho người bán/Agent |
|
||||
| MfaChallenge | Theo dõi xác minh TOTP/mã dự phòng |
|
||||
|
||||
#### Listings & Properties (4)
|
||||
| Model | Purpose |
|
||||
#### Listings & Bất động sản (4)
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| Property | Physical property details + geolocation |
|
||||
| PropertyMedia | Images/videos per property |
|
||||
| Listing | Listing instance (sale/rent) + status |
|
||||
| SavedSearch | User's saved search preferences |
|
||||
| Property | Chi tiết bất động sản vật lý + định vị địa lý |
|
||||
| PropertyMedia | Hình ảnh/video cho mỗi bất động sản |
|
||||
| Listing | Phiên bản listing (bán/cho thuê) + trạng thái |
|
||||
| SavedSearch | Tùy chọn tìm kiếm đã lưu của người dùng |
|
||||
|
||||
#### Transactions (4)
|
||||
| Model | Purpose |
|
||||
#### Giao dịch (4)
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| Transaction | Buyer-seller transaction flow (inquiry → completed) |
|
||||
| Inquiry | Buyer questions on specific listings |
|
||||
| Lead | Agent CRM lead records |
|
||||
| Review | User reviews of agents/transactions |
|
||||
| Transaction | Luồng giao dịch người mua-người bán (inquiry → hoàn thành) |
|
||||
| Inquiry | Câu hỏi người mua về listing cụ thể |
|
||||
| Lead | Bản ghi lead CRM của agent |
|
||||
| Review | Đánh giá người dùng về agent/giao dịch |
|
||||
|
||||
#### Payments (2)
|
||||
| Model | Purpose |
|
||||
#### Thanh toán (2)
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| Payment | Payment records (all providers) |
|
||||
| Plan | Subscription tier definitions |
|
||||
| Payment | Bản ghi thanh toán (tất cả nhà cung cấp) |
|
||||
| Plan | Định nghĩa cấp subscription |
|
||||
|
||||
#### Orders & Escrow (3)
|
||||
| Model | Purpose |
|
||||
#### Đơn hàng & Escrow (3)
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| Order | Auction settlement order |
|
||||
| Escrow | Escrow holding for transactions |
|
||||
| Subscription | User's active subscription |
|
||||
| Order | Lệnh thanh toán đấu giá |
|
||||
| Escrow | Giữ ký quỹ cho giao dịch |
|
||||
| Subscription | Subscription đang hoạt động của người dùng |
|
||||
|
||||
#### Analytics (2)
|
||||
| Model | Purpose |
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| Valuation | AI-generated property valuations |
|
||||
| MarketIndex | Market statistics per district/city |
|
||||
| Valuation | Định giá bất động sản do AI tạo |
|
||||
| MarketIndex | Thống kê thị trường theo quận/thành phố |
|
||||
|
||||
#### Operations (6)
|
||||
| Model | Purpose |
|
||||
#### Vận hành (6)
|
||||
| Model | Mục đích |
|
||||
|-------|---------|
|
||||
| NotificationLog | Sent notification records |
|
||||
| NotificationPreference | User notification opt-in/out |
|
||||
| AdminAuditLog | Admin action audit trail |
|
||||
| UsageRecord | Subscription usage tracking |
|
||||
| NotificationLog | Bản ghi thông báo đã gửi |
|
||||
| NotificationPreference | Tùy chọn nhận thông báo của người dùng |
|
||||
| AdminAuditLog | Audit trail hành động admin |
|
||||
| UsageRecord | Theo dõi sử dụng subscription |
|
||||
|
||||
**Index Strategy:**
|
||||
- Single-column indexes on foreign keys, status fields, dates
|
||||
- Compound indexes for common query patterns (e.g., `[role, isActive, createdAt DESC]`)
|
||||
- GIST index on PostGIS location geometry
|
||||
**Chiến lược Index:**
|
||||
- Index một cột trên foreign key, các trường trạng thái, ngày tháng
|
||||
- Index ghép cho các pattern truy vấn phổ biến (ví dụ: `[role, isActive, createdAt DESC]`)
|
||||
- Index GIST trên hình học vị trí PostGIS
|
||||
|
||||
**Key Enums:**
|
||||
**Các Enum chính:**
|
||||
- UserRole: BUYER, SELLER, AGENT, ADMIN
|
||||
- PropertyType: APARTMENT, VILLA, TOWNHOUSE, LAND, OFFICE, SHOPHOUSE
|
||||
- TransactionType: SALE, RENT
|
||||
@@ -215,32 +215,32 @@ goodgo-platform-ai/
|
||||
|
||||
---
|
||||
|
||||
## 5. DOCUMENTATION & TRACKING
|
||||
## 5. TÀI LIỆU & THEO DÕI
|
||||
|
||||
### Root-Level Planning Docs
|
||||
- **PROJECT_TRACKER.md** — 7 phases, 40+ issues, current status (Phase 7 Wave 14)
|
||||
- **IMPLEMENTATION_PLAN.md** — Feature roadmap with priority/status
|
||||
- **COMPREHENSIVE_AUDIT_2026-04-12.md** — Full system audit with implementation notes
|
||||
### Tài liệu lập kế hoạch ở cấp Root
|
||||
- **PROJECT_TRACKER.md** — 7 phase, 40+ issue, trạng thái hiện tại (Phase 7 Wave 14)
|
||||
- **IMPLEMENTATION_PLAN.md** — Lộ trình tính năng với ưu tiên/trạng thái
|
||||
- **COMPREHENSIVE_AUDIT_2026-04-12.md** — Audit toàn hệ thống với ghi chú triển khai
|
||||
|
||||
### Technical Docs (`docs/`)
|
||||
- **architecture.md** — DDD layering, CQRS, module boundaries
|
||||
- **api-endpoints.md** — Swagger-generated endpoint reference
|
||||
- **api-error-codes.md** — Structured error code taxonomy
|
||||
- **deployment.md** — Docker, K8s, CI/CD pipeline steps
|
||||
- **RUNBOOK.md** — Operational procedures, troubleshooting
|
||||
- **PRODUCTION_READINESS.md** — Security, compliance, performance checklist
|
||||
### Tài liệu kỹ thuật (`docs/`)
|
||||
- **architecture.md** — Phân lớp DDD, CQRS, ranh giới module
|
||||
- **api-endpoints.md** — Tham chiếu endpoint do Swagger tạo
|
||||
- **api-error-codes.md** — Phân loại mã lỗi có cấu trúc
|
||||
- **deployment.md** — Docker, K8s, các bước CI/CD
|
||||
- **RUNBOOK.md** — Quy trình vận hành, xử lý sự cố
|
||||
- **PRODUCTION_READINESS.md** — Checklist bảo mật, tuân thủ, hiệu năng
|
||||
|
||||
### Audit Directory (`docs/audits/`)
|
||||
- 80+ audit files documenting feature implementations
|
||||
- Pricing audit, checkout flow, KYC, payment gateway testing
|
||||
### Thư mục Audit (`docs/audits/`)
|
||||
- 80+ file audit tài liệu hóa các triển khai tính năng
|
||||
- Audit pricing, luồng checkout, KYC, test cổng thanh toán
|
||||
|
||||
---
|
||||
|
||||
## 6. DEPENDENCIES & TOOLING
|
||||
## 6. PHỤ THUỘC & CÔNG CỤ
|
||||
|
||||
### Monorepo Setup
|
||||
- **pnpm** v10.27.0 (workspace) — faster, strict peer deps
|
||||
- **Turbo** v2.9.4 — task orchestration & caching
|
||||
### Thiết lập Monorepo
|
||||
- **pnpm** v10.27.0 (workspace) — nhanh hơn, peer deps nghiêm ngặt
|
||||
- **Turbo** v2.9.4 — điều phối tác vụ & cache
|
||||
- **Node** ≥22.0.0
|
||||
|
||||
### Backend (NestJS)
|
||||
@@ -269,7 +269,7 @@ Maps: mapbox-gl ^3.21
|
||||
Monitoring: @sentry/nextjs
|
||||
```
|
||||
|
||||
### Testing & Quality
|
||||
### Testing & Chất lượng
|
||||
```
|
||||
Test: vitest ^4.1.3, @playwright/test ^1.59
|
||||
Lint: eslint ^9.39, prettier ^3.8, typescript-eslint
|
||||
@@ -278,20 +278,20 @@ Dependencies: dependency-cruiser (architecture validation)
|
||||
|
||||
---
|
||||
|
||||
## 7. TEST COVERAGE & QUALITY
|
||||
## 7. ĐỘ BAO PHỦ TEST & CHẤT LƯỢNG
|
||||
|
||||
### Test Files: 242 total
|
||||
### Tổng số file Test: 242
|
||||
|
||||
#### API Tests
|
||||
- **Unit tests:** Payment gateways (VNPay, MoMo, ZaloPay), Money value objects, Platform fee logic
|
||||
- **Integration tests:** Auth flows, health checks, notifications
|
||||
- Located in `__tests__` subdirs within each module
|
||||
- **Unit tests:** Cổng thanh toán (VNPay, MoMo, ZaloPay), Money value objects, logic phí nền tảng
|
||||
- **Integration tests:** Luồng auth, health check, notifications
|
||||
- Nằm trong các thư mục con `__tests__` trong từng module
|
||||
|
||||
#### Frontend Tests
|
||||
- **Unit tests:** Auth store, comparison store, currency formatting, validations
|
||||
- **E2E tests (Playwright):** 15+ web tests, 16+ API tests
|
||||
- **Unit tests:** Auth store, comparison store, định dạng tiền tệ, validation
|
||||
- **E2E tests (Playwright):** 15+ web test, 16+ API test
|
||||
|
||||
#### E2E Test Coverage
|
||||
#### Độ bao phủ E2E Test
|
||||
**Web Tests (15):**
|
||||
- auth-login, auth-register, auth-oauth-callback
|
||||
- homepage, navigation, responsive
|
||||
@@ -310,57 +310,57 @@ Dependencies: dependency-cruiser (architecture validation)
|
||||
- mcp, admin
|
||||
|
||||
**Load Tests (K6):**
|
||||
- Baseline benchmarks for search, listings, auth endpoints
|
||||
- Concurrency testing up to 1000 virtual users
|
||||
- Benchmark cơ sở cho các endpoint search, listings, auth
|
||||
- Test đồng thời lên đến 1000 virtual users
|
||||
|
||||
---
|
||||
|
||||
## 8. IMPLEMENTATION STATUS
|
||||
## 8. TRẠNG THÁI TRIỂN KHAI
|
||||
|
||||
### ✅ COMPLETE (Phase 7 MVP)
|
||||
1. **Foundation** — Monorepo, Docker, Prisma schema, CI/CD
|
||||
2. **Auth** — JWT, OAuth, MFA/TOTP, session management
|
||||
3. **Listings** — Full CRUD, media upload, status workflow
|
||||
4. **Search** — Typesense + PostGIS geo-search
|
||||
5. **Payments** — 3 VN payment gateways, webhook handling
|
||||
6. **Subscriptions** — 4 tiers, quota tracking
|
||||
### ✅ HOÀN THÀNH (Phase 7 MVP)
|
||||
1. **Foundation** — Monorepo, Docker, schema Prisma, CI/CD
|
||||
2. **Auth** — JWT, OAuth, MFA/TOTP, quản lý phiên
|
||||
3. **Listings** — CRUD đầy đủ, upload media, workflow trạng thái
|
||||
4. **Search** — Typesense + tìm kiếm địa lý PostGIS
|
||||
5. **Payments** — 3 cổng thanh toán VN, xử lý webhook
|
||||
6. **Subscriptions** — 4 cấp, theo dõi quota
|
||||
7. **Notifications** — Email, SMS, Push, Zalo OA
|
||||
8. **Admin Panel** — Moderation, user management, audit logs
|
||||
9. **Agents** — Portal, inquiries, lead CRM, quality metrics
|
||||
10. **Analytics** — Market reports, AI valuation service
|
||||
11. **Security** — Rate limiting, CSRF, field encryption, PII masking
|
||||
12. **Monitoring** — Prometheus, Grafana, Sentry, log aggregation
|
||||
13. **Testing** — Unit tests, E2E tests (Playwright), load tests (K6)
|
||||
8. **Admin Panel** — Kiểm duyệt, quản lý người dùng, audit log
|
||||
9. **Agents** — Portal, inquiries, lead CRM, chỉ số chất lượng
|
||||
10. **Analytics** — Báo cáo thị trường, dịch vụ định giá AI
|
||||
11. **Security** — Rate limiting, CSRF, mã hóa trường, che PII
|
||||
12. **Monitoring** — Prometheus, Grafana, Sentry, tổng hợp log
|
||||
13. **Testing** — Unit test, E2E test (Playwright), load test (K6)
|
||||
|
||||
### 🔄 IN PROGRESS / REMAINING
|
||||
- Per Wave 14:
|
||||
- TEC-1650: Listing detail non-existent ID error handling
|
||||
- TEC-1652: Full E2E test suite validation
|
||||
- TEC-1657: Comprehensive audit logging
|
||||
### 🔄 ĐANG TIẾN HÀNH / CÒN LẠI
|
||||
- Theo Wave 14:
|
||||
- TEC-1650: Xử lý lỗi ID không tồn tại trên trang chi tiết listing
|
||||
- TEC-1652: Xác thực bộ test E2E đầy đủ
|
||||
- TEC-1657: Audit logging toàn diện
|
||||
|
||||
### Database Migrations
|
||||
- 7+ migrations applied
|
||||
### Migration Database
|
||||
- 7+ migration đã được áp dụng
|
||||
- Connection pooling (PgBouncer)
|
||||
- PostGIS extension enabled
|
||||
- Đã bật extension PostGIS
|
||||
|
||||
---
|
||||
|
||||
## 9. PROJECT MATURITY INDICATORS
|
||||
## 9. CHỈ SỐ TRƯỞNG THÀNH DỰ ÁN
|
||||
|
||||
| Dimension | Status | Evidence |
|
||||
| Khía cạnh | Trạng thái | Bằng chứng |
|
||||
|-----------|--------|----------|
|
||||
| **Architecture** | Production-Ready | DDD, CQRS, layered modules, clear boundaries |
|
||||
| **Code Quality** | High | 242 tests, ESLint enforcement, module cruiser |
|
||||
| **Security** | Hardened | JWT, MFA, encryption, rate limiting, CSRF, PII masking |
|
||||
| **Documentation** | Comprehensive | 80+ audit files, runbooks, error codes, architecture |
|
||||
| **Performance** | Optimized | Redis caching, Typesense search, query optimization, load tests |
|
||||
| **Monitoring** | Complete | Prometheus, Grafana, Sentry, structured logging |
|
||||
| **DevOps** | Mature | Docker, Kubernetes config, CI/CD pipelines, smoke tests |
|
||||
| **Scaling** | Prepared | Connection pooling, caching layer, resilient services |
|
||||
| **Kiến trúc** | Sẵn sàng Production | DDD, CQRS, các module phân lớp, ranh giới rõ ràng |
|
||||
| **Chất lượng code** | Cao | 242 test, ESLint thực thi, module cruiser |
|
||||
| **Bảo mật** | Đã được củng cố | JWT, MFA, mã hóa, rate limiting, CSRF, che PII |
|
||||
| **Tài liệu** | Toàn diện | 80+ file audit, runbook, mã lỗi, kiến trúc |
|
||||
| **Hiệu năng** | Đã tối ưu | Cache Redis, tìm kiếm Typesense, tối ưu truy vấn, load test |
|
||||
| **Monitoring** | Hoàn chỉnh | Prometheus, Grafana, Sentry, structured logging |
|
||||
| **DevOps** | Trưởng thành | Docker, cấu hình Kubernetes, pipeline CI/CD, smoke test |
|
||||
| **Khả năng mở rộng** | Đã chuẩn bị | Connection pooling, lớp cache, dịch vụ có khả năng phục hồi |
|
||||
|
||||
---
|
||||
|
||||
## 10. KEY STATISTICS
|
||||
## 10. THỐNG KÊ CHÍNH
|
||||
|
||||
```
|
||||
Backend Files: ~845 TypeScript files
|
||||
@@ -378,9 +378,9 @@ Lines of Code: ~50,000+ (excluding node_modules)
|
||||
|
||||
---
|
||||
|
||||
## 11. TECH STACK SUMMARY
|
||||
## 11. TÓM TẮT TECH STACK
|
||||
|
||||
| Layer | Technology |
|
||||
| Lớp | Công nghệ |
|
||||
|-------|-----------|
|
||||
| **Frontend** | Next.js 15, React 18, Tailwind CSS, Shadcn/ui |
|
||||
| **Backend** | NestJS 11, TypeScript 6 |
|
||||
@@ -397,16 +397,15 @@ Lines of Code: ~50,000+ (excluding node_modules)
|
||||
| **Package Manager** | pnpm 10.27 |
|
||||
| **Orchestration** | Turbo |
|
||||
| **Containerization** | Docker + Docker Compose |
|
||||
| **i18n** | next-intl (Vietnamese + English) |
|
||||
| **i18n** | next-intl (Tiếng Việt + Tiếng Anh) |
|
||||
|
||||
---
|
||||
|
||||
## 12. NEXT STEPS FOR DEVELOPERS
|
||||
|
||||
1. **Local Setup:** `docker-compose up` → database + API + frontend
|
||||
2. **Run Tests:** `pnpm test` (unit), `pnpm test:e2e` (E2E)
|
||||
3. **Check Status:** Review PROJECT_TRACKER.md for ongoing issues
|
||||
4. **Architecture:** Read docs/architecture.md for module boundaries
|
||||
5. **API:** Browse docs/api-endpoints.md (Swagger-generated)
|
||||
6. **Deploy:** Follow docs/deployment.md for production setup
|
||||
## 12. CÁC BƯỚC TIẾP THEO CHO LẬP TRÌNH VIÊN
|
||||
|
||||
1. **Thiết lập cục bộ:** `docker-compose up` → database + API + frontend
|
||||
2. **Chạy Test:** `pnpm test` (unit), `pnpm test:e2e` (E2E)
|
||||
3. **Kiểm tra trạng thái:** Xem PROJECT_TRACKER.md để biết các issue đang diễn ra
|
||||
4. **Kiến trúc:** Đọc docs/architecture.md để biết ranh giới module
|
||||
5. **API:** Duyệt docs/api-endpoints.md (do Swagger tạo)
|
||||
6. **Deploy:** Theo dõi docs/deployment.md để thiết lập production
|
||||
|
||||
@@ -1,16 +1,16 @@
|
||||
# GoodGo Frontend: File-by-File i18n & A11y Implementation Guide
|
||||
# GoodGo Frontend: Hướng dẫn triển khai i18n & A11y theo từng file
|
||||
|
||||
## 📋 Complete File Mapping
|
||||
## 📋 Ánh xạ file đầy đủ
|
||||
|
||||
### PHASE 1: INFRASTRUCTURE SETUP
|
||||
### GIAI ĐOẠN 1: THIẾT LẬP HẠ TẦNG
|
||||
|
||||
#### 1. `middleware.ts` (CRITICAL)
|
||||
**Current:** Auth routing only
|
||||
**Changes:**
|
||||
- Add locale detection from URL pathname
|
||||
- Add cookie-based locale storage
|
||||
- Redirect `/en/*` and `/vi/*` paths appropriately
|
||||
- Add Accept-Language header fallback
|
||||
#### 1. `middleware.ts` (QUAN TRỌNG)
|
||||
**Hiện tại:** Chỉ định tuyến xác thực
|
||||
**Thay đổi:**
|
||||
- Thêm phát hiện locale từ pathname URL
|
||||
- Thêm lưu trữ locale dựa trên cookie
|
||||
- Chuyển hướng các đường dẫn `/en/*` và `/vi/*` một cách phù hợp
|
||||
- Thêm dự phòng dựa trên header Accept-Language
|
||||
|
||||
**Pseudo-code:**
|
||||
```typescript
|
||||
@@ -32,15 +32,15 @@ export function middleware(request: NextRequest) {
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. `app/layout.tsx` (CRITICAL)
|
||||
**Current:** Thai providers, hardcoded Vietnamese metadata
|
||||
**Changes:**
|
||||
- Change `lang="vi"` to dynamic locale
|
||||
- Update metadata to be i18n-aware
|
||||
- Wrap with `NextIntlClientProvider` from next-intl
|
||||
- Keep existing providers (ThemeProvider, QueryProvider, AuthProvider)
|
||||
#### 2. `app/layout.tsx` (QUAN TRỌNG)
|
||||
**Hiện tại:** Các provider chính, metadata tiếng Việt được hardcode
|
||||
**Thay đổi:**
|
||||
- Thay đổi `lang="vi"` thành locale động
|
||||
- Cập nhật metadata để hỗ trợ i18n
|
||||
- Bao bọc bằng `NextIntlClientProvider` từ next-intl
|
||||
- Giữ nguyên các provider hiện có (ThemeProvider, QueryProvider, AuthProvider)
|
||||
|
||||
**Key changes:**
|
||||
**Các thay đổi chính:**
|
||||
```typescript
|
||||
import { getLocale, getTranslations } from 'next-intl/server';
|
||||
|
||||
@@ -59,8 +59,8 @@ export async function generateMetadata(): Promise<Metadata> {
|
||||
}
|
||||
```
|
||||
|
||||
#### 3. `i18n/config.ts` (NEW)
|
||||
**Create new file** with i18n configuration:
|
||||
#### 3. `i18n/config.ts` (MỚI)
|
||||
**Tạo file mới** với cấu hình i18n:
|
||||
```typescript
|
||||
export const locales = ['en', 'vi'] as const;
|
||||
export const defaultLocale = 'vi';
|
||||
@@ -68,8 +68,8 @@ export const defaultLocale = 'vi';
|
||||
export const timeZone = 'Asia/Ho_Chi_Minh';
|
||||
```
|
||||
|
||||
#### 4. `public/locales/en.json` (NEW - LARGE FILE)
|
||||
**Structure:**
|
||||
#### 4. `public/locales/en.json` (MỚI - FILE LỚN)
|
||||
**Cấu trúc:**
|
||||
```json
|
||||
{
|
||||
"common": {
|
||||
@@ -179,16 +179,16 @@ export const timeZone = 'Asia/Ho_Chi_Minh';
|
||||
}
|
||||
```
|
||||
|
||||
#### 5. `public/locales/vi.json` (NEW - LARGE FILE)
|
||||
Same structure as en.json but with Vietnamese translations.
|
||||
#### 5. `public/locales/vi.json` (MỚI - FILE LỚN)
|
||||
Cấu trúc giống en.json nhưng với bản dịch tiếng Việt.
|
||||
|
||||
---
|
||||
|
||||
### PHASE 2: CORE COMPONENT UPDATES
|
||||
### GIAI ĐOẠN 2: CẬP NHẬT COMPONENT CỐT LÕI
|
||||
|
||||
#### Files Requiring Translation Hook Integration
|
||||
#### Các file cần tích hợp Translation Hook
|
||||
|
||||
##### Layout Files
|
||||
##### Các file Layout
|
||||
|
||||
1. **`app/(public)/layout.tsx`**
|
||||
```typescript
|
||||
@@ -220,20 +220,20 @@ const toggleLabel = theme === 'light'
|
||||
```
|
||||
|
||||
3. **`app/(auth)/layout.tsx`**
|
||||
Update any error messages or labels to use translations.
|
||||
Cập nhật mọi thông báo lỗi hoặc nhãn để sử dụng bản dịch.
|
||||
|
||||
##### Page Files
|
||||
##### Các file Page
|
||||
|
||||
1. **`app/(public)/page.tsx` (LARGE FILE)**
|
||||
**Areas to update:**
|
||||
- Hero section (title, subtitle)
|
||||
- Search form (placeholder)
|
||||
- Property type badges
|
||||
- Price ranges
|
||||
- City options
|
||||
- Section headings
|
||||
- Stats labels
|
||||
- CTA buttons
|
||||
1. **`app/(public)/page.tsx` (FILE LỚN)**
|
||||
**Các phần cần cập nhật:**
|
||||
- Phần hero (tiêu đề, phụ đề)
|
||||
- Form tìm kiếm (placeholder)
|
||||
- Các badge loại bất động sản
|
||||
- Các khoảng giá
|
||||
- Tùy chọn thành phố
|
||||
- Tiêu đề các phần
|
||||
- Nhãn thống kê
|
||||
- Các nút CTA
|
||||
|
||||
```typescript
|
||||
export default function LandingPage() {
|
||||
@@ -268,32 +268,32 @@ const OAUTH_ERROR_MESSAGES = {
|
||||
```
|
||||
|
||||
3. **`app/(auth)/register/page.tsx`**
|
||||
Same pattern as login page.
|
||||
Tương tự như trang login.
|
||||
|
||||
4. **`app/(dashboard)/dashboard/page.tsx`** and all other dashboard pages
|
||||
Update section titles, empty states, button labels.
|
||||
4. **`app/(dashboard)/dashboard/page.tsx`** và tất cả các trang dashboard khác
|
||||
Cập nhật tiêu đề các phần, trạng thái rỗng, nhãn các nút.
|
||||
|
||||
##### Search & Listing Pages
|
||||
##### Các trang Search & Listing
|
||||
|
||||
1. **`app/(public)/search/page.tsx`**
|
||||
Update search results headings, empty states, filter labels.
|
||||
Cập nhật tiêu đề kết quả tìm kiếm, trạng thái rỗng, nhãn bộ lọc.
|
||||
|
||||
2. **`app/(public)/listings/[id]/page.tsx`**
|
||||
Update property detail labels.
|
||||
Cập nhật nhãn chi tiết bất động sản.
|
||||
|
||||
3. **`app/(dashboard)/listings/page.tsx`**
|
||||
Update table headers, status labels, action labels.
|
||||
Cập nhật tiêu đề bảng, nhãn trạng thái, nhãn hành động.
|
||||
|
||||
4. **`app/(dashboard)/listings/new/page.tsx`**
|
||||
Uses listing-form-steps component (see below).
|
||||
Sử dụng component listing-form-steps (xem bên dưới).
|
||||
|
||||
---
|
||||
|
||||
#### Component Files
|
||||
#### Các file Component
|
||||
|
||||
##### Critical Components (Do First)
|
||||
##### Các component quan trọng (Làm trước)
|
||||
|
||||
1. **`components/search/filter-bar.tsx` (HIGH PRIORITY)**
|
||||
1. **`components/search/filter-bar.tsx` (ƯU TIÊN CAO)**
|
||||
```typescript
|
||||
// Current: Hardcoded arrays
|
||||
const CITIES = ['Hồ Chí Minh', 'Hà Nội', 'Đà Nẵng', ...];
|
||||
@@ -310,14 +310,14 @@ const PRICE_RANGES = [
|
||||
];
|
||||
```
|
||||
|
||||
2. **`components/listings/listing-form-steps.tsx` (HIGH PRIORITY - LARGE FILE)**
|
||||
This multi-step form has many labels to translate:
|
||||
- Step 1: Transaction type, property type, title, description
|
||||
- Step 2: Address fields, location
|
||||
- Step 3: Area, rooms, bathrooms, direction, year built, etc.
|
||||
- Step 4: Pricing
|
||||
2. **`components/listings/listing-form-steps.tsx` (ƯU TIÊN CAO - FILE LỚN)**
|
||||
Form đa bước này có nhiều nhãn cần dịch:
|
||||
- Bước 1: Loại giao dịch, loại bất động sản, tiêu đề, mô tả
|
||||
- Bước 2: Các trường địa chỉ, vị trí
|
||||
- Bước 3: Diện tích, phòng, phòng tắm, hướng, năm xây dựng, v.v.
|
||||
- Bước 4: Giá
|
||||
|
||||
All field labels should use `t('form.field_name')` pattern.
|
||||
Tất cả nhãn các trường nên sử dụng pattern `t('form.field_name')`.
|
||||
|
||||
3. **`components/auth/oauth-buttons.tsx`**
|
||||
```typescript
|
||||
@@ -330,7 +330,7 @@ All field labels should use `t('form.field_name')` pattern.
|
||||
</Button>
|
||||
```
|
||||
|
||||
##### Medium Priority Components
|
||||
##### Các component ưu tiên trung bình
|
||||
|
||||
1. **`components/search/property-card.tsx`**
|
||||
```typescript
|
||||
@@ -361,21 +361,21 @@ const LISTING_STATUSES = {
|
||||
```
|
||||
|
||||
3. **`components/valuation/valuation-form.tsx`**
|
||||
Update form labels and buttons.
|
||||
Cập nhật nhãn form và các nút.
|
||||
|
||||
4. **`components/listings/image-upload.tsx`**
|
||||
Update button text and error messages.
|
||||
Cập nhật văn bản nút và thông báo lỗi.
|
||||
|
||||
5. **All `components/ui/*.tsx` files with text**
|
||||
- Button: any default text
|
||||
- Dialog: Close button aria-label
|
||||
- Input: placeholder attrs if hardcoded
|
||||
- Label: any default text
|
||||
- Others: similar
|
||||
5. **Tất cả các file `components/ui/*.tsx` có văn bản**
|
||||
- Button: bất kỳ văn bản mặc định nào
|
||||
- Dialog: aria-label nút Đóng
|
||||
- Input: thuộc tính placeholder nếu được hardcode
|
||||
- Label: bất kỳ văn bản mặc định nào
|
||||
- Khác: tương tự
|
||||
|
||||
---
|
||||
|
||||
### PHASE 3: VALIDATION & ERROR MESSAGES
|
||||
### GIAI ĐOẠN 3: VALIDATION & THÔNG BÁO LỖI
|
||||
|
||||
#### 1. `lib/validations/auth.ts`
|
||||
```typescript
|
||||
@@ -394,21 +394,21 @@ const schema = z.object({
|
||||
});
|
||||
```
|
||||
|
||||
#### 2. `lib/validations/listings.ts` (LARGE FILE)
|
||||
Update all Zod validation error messages:
|
||||
#### 2. `lib/validations/listings.ts` (FILE LỚN)
|
||||
Cập nhật tất cả thông báo lỗi validation Zod:
|
||||
- "Vui lòng chọn loại giao dịch" → `t('validation.transaction_required')`
|
||||
- "Tiêu đề tối thiểu 5 ký tự" → `t('validation.title_min_length')`
|
||||
- All other validation messages
|
||||
- Tất cả các thông báo validation khác
|
||||
|
||||
#### 3. `lib/validations/valuation.ts`
|
||||
Similar pattern to listings.
|
||||
Mẫu tương tự như listings.
|
||||
|
||||
---
|
||||
|
||||
### PHASE 4: UTILITY UPDATES
|
||||
### GIAI ĐOẠN 4: CẬP NHẬT TIỆN ÍCH
|
||||
|
||||
#### 1. `lib/utils.ts`
|
||||
No changes (already minimal).
|
||||
Không thay đổi (đã tối giản).
|
||||
|
||||
#### 2. `lib/auth-store.ts`
|
||||
```typescript
|
||||
@@ -417,17 +417,17 @@ No changes (already minimal).
|
||||
```
|
||||
|
||||
#### 3. `lib/api-client.ts`
|
||||
Check if error messages from API need i18n wrapping.
|
||||
Kiểm tra xem các thông báo lỗi từ API có cần bao bọc i18n hay không.
|
||||
|
||||
#### 4. All `lib/*-api.ts` files
|
||||
Update error message handling if needed.
|
||||
#### 4. Tất cả các file `lib/*-api.ts`
|
||||
Cập nhật xử lý thông báo lỗi nếu cần.
|
||||
|
||||
---
|
||||
|
||||
### PHASE 5: ACCESSIBILITY UPDATES
|
||||
### GIAI ĐOẠN 5: CẬP NHẬT KHẢ NĂNG TIẾP CẬN
|
||||
|
||||
#### 1. `components/ui/dialog.tsx` (CRITICAL A11y)
|
||||
**Add focus management:**
|
||||
#### 1. `components/ui/dialog.tsx` (A11y QUAN TRỌNG)
|
||||
**Thêm quản lý focus:**
|
||||
```typescript
|
||||
// Add focus trap
|
||||
// Save initial focus element
|
||||
@@ -466,7 +466,7 @@ function Dialog() {
|
||||
```
|
||||
|
||||
#### 2. `components/ui/input.tsx`
|
||||
Add aria-describedby for error messages:
|
||||
Thêm aria-describedby cho thông báo lỗi:
|
||||
```typescript
|
||||
export function Input({ error, ...props }) {
|
||||
const errorId = `${props.id}-error`;
|
||||
@@ -484,8 +484,8 @@ export function Input({ error, ...props }) {
|
||||
```
|
||||
|
||||
#### 3. `components/ui/button.tsx`
|
||||
Ensure all buttons have visible focus indicator (already in CSS likely).
|
||||
Add aria-busy for loading state if used:
|
||||
Đảm bảo tất cả các nút có chỉ báo focus rõ ràng (có thể đã có trong CSS).
|
||||
Thêm aria-busy cho trạng thái loading nếu được sử dụng:
|
||||
```typescript
|
||||
export function Button({ disabled, isLoading, ...props }) {
|
||||
return (
|
||||
@@ -500,15 +500,15 @@ export function Button({ disabled, isLoading, ...props }) {
|
||||
}
|
||||
```
|
||||
|
||||
#### 4. Form Components
|
||||
Update all forms to use aria-describedby for error messages:
|
||||
- `app/(auth)/login/page.tsx` — Already has role="alert" ✓ but could use aria-describedby
|
||||
- `app/(auth)/register/page.tsx` — Same
|
||||
- `components/listings/listing-form-steps.tsx` — Add aria-describedby
|
||||
- `components/search/filter-bar.tsx` — Ensure accessible labels
|
||||
#### 4. Các component Form
|
||||
Cập nhật tất cả các form để sử dụng aria-describedby cho thông báo lỗi:
|
||||
- `app/(auth)/login/page.tsx` — Đã có role="alert" ✓ nhưng có thể dùng aria-describedby
|
||||
- `app/(auth)/register/page.tsx` — Tương tự
|
||||
- `components/listings/listing-form-steps.tsx` — Thêm aria-describedby
|
||||
- `components/search/filter-bar.tsx` — Đảm bảo nhãn dễ tiếp cận
|
||||
|
||||
#### 5. All Icon-Only Buttons
|
||||
Find all buttons with only icons and add aria-label:
|
||||
#### 5. Tất cả các nút chỉ có biểu tượng
|
||||
Tìm tất cả các nút chỉ có biểu tượng và thêm aria-label:
|
||||
```typescript
|
||||
// Search in components for: <Button> with only SVG children
|
||||
// Add aria-label={t('...')}
|
||||
@@ -524,7 +524,7 @@ Find all buttons with only icons and add aria-label:
|
||||
```
|
||||
|
||||
#### 6. Loading Spinners
|
||||
Add aria-busy and aria-label:
|
||||
Thêm aria-busy và aria-label:
|
||||
```typescript
|
||||
// In app/(public)/page.tsx and similar:
|
||||
<div aria-busy={loadingFeatured} aria-label={t('common.loading')}>
|
||||
@@ -533,7 +533,7 @@ Add aria-busy and aria-label:
|
||||
```
|
||||
|
||||
#### 7. `components/listings/image-gallery.tsx`
|
||||
Add keyboard navigation (arrow keys):
|
||||
Thêm điều hướng bằng bàn phím (phím mũi tên):
|
||||
```typescript
|
||||
// Add keyboard event handler for arrow keys
|
||||
// Left/Right arrows to navigate images
|
||||
@@ -541,7 +541,7 @@ Add keyboard navigation (arrow keys):
|
||||
|
||||
---
|
||||
|
||||
### PHASE 6: TEST SETUP UPDATES
|
||||
### GIAI ĐOẠN 6: CẬP NHẬT THIẾT LẬP TEST
|
||||
|
||||
#### 1. `vitest.setup.ts`
|
||||
```typescript
|
||||
@@ -564,35 +564,35 @@ vi.mock('next-intl', () => ({
|
||||
```
|
||||
|
||||
#### 2. `vitest.config.ts`
|
||||
May need to add path aliases or test environment setup.
|
||||
Có thể cần thêm path alias hoặc thiết lập môi trường test.
|
||||
|
||||
#### 3. Update all test files in `__tests__/` folders
|
||||
- Add locale prop to component renders
|
||||
- Test both English and Vietnamese if applicable
|
||||
- Mock i18n translations
|
||||
#### 3. Cập nhật tất cả các file test trong thư mục `__tests__/`
|
||||
- Thêm prop locale khi render component
|
||||
- Test cả tiếng Anh và tiếng Việt nếu có thể
|
||||
- Mock các bản dịch i18n
|
||||
|
||||
---
|
||||
|
||||
## 📊 Summary: Files by Update Complexity
|
||||
## 📊 Tóm tắt: Các file theo độ phức tạp cập nhật
|
||||
|
||||
### Trivial (5 min each)
|
||||
### Đơn giản (5 phút mỗi file)
|
||||
- `app/robots.ts`
|
||||
- `app/sitemap.ts`
|
||||
- `components/ui/badge.tsx`
|
||||
- `components/ui/card.tsx`
|
||||
- `components/ui/tabs.tsx`
|
||||
|
||||
### Simple (15-30 min each)
|
||||
- `app/(admin)/*.tsx` files (3 files)
|
||||
### Đơn giản (15-30 phút mỗi file)
|
||||
- Các file `app/(admin)/*.tsx` (3 file)
|
||||
- `app/(dashboard)/analytics/page.tsx`
|
||||
- `app/(dashboard)/profile/page.tsx`
|
||||
- `app/(dashboard)/subscription/page.tsx`
|
||||
- `app/(dashboard)/payments/page.tsx`
|
||||
- `components/ui/*.tsx` (8 files)
|
||||
- `components/ui/*.tsx` (8 file)
|
||||
- `components/auth/oauth-buttons.tsx`
|
||||
- `components/listings/listing-status-badge.tsx`
|
||||
|
||||
### Medium (30-60 min each)
|
||||
### Trung bình (30-60 phút mỗi file)
|
||||
- `app/(public)/layout.tsx`
|
||||
- `app/(auth)/login/page.tsx`
|
||||
- `app/(auth)/register/page.tsx`
|
||||
@@ -602,47 +602,47 @@ May need to add path aliases or test environment setup.
|
||||
- `components/search/property-card.tsx`
|
||||
- `components/search/filter-bar.tsx`
|
||||
- `components/listings/image-upload.tsx`
|
||||
- `components/valuation/*.tsx` (3 files)
|
||||
- `components/valuation/*.tsx` (3 file)
|
||||
|
||||
### Complex (1-2 hours each)
|
||||
- `app/(public)/page.tsx` (landing page - many sections)
|
||||
- `components/listings/listing-form-steps.tsx` (multi-step form)
|
||||
- `components/map/listing-map.tsx` (if has labels)
|
||||
- `components/charts/*.tsx` (3 files - chart labels)
|
||||
### Phức tạp (1-2 giờ mỗi file)
|
||||
- `app/(public)/page.tsx` (trang landing - nhiều phần)
|
||||
- `components/listings/listing-form-steps.tsx` (form đa bước)
|
||||
- `components/map/listing-map.tsx` (nếu có nhãn)
|
||||
- `components/charts/*.tsx` (3 file - nhãn biểu đồ)
|
||||
|
||||
### Critical Infrastructure
|
||||
- `middleware.ts` (30-45 min)
|
||||
- `app/layout.tsx` (30 min)
|
||||
- `lib/validations/*.ts` (3 files - 45 min)
|
||||
### Hạ tầng quan trọng
|
||||
- `middleware.ts` (30-45 phút)
|
||||
- `app/layout.tsx` (30 phút)
|
||||
- `lib/validations/*.ts` (3 file - 45 phút)
|
||||
|
||||
---
|
||||
|
||||
## ✅ Validation Checklist
|
||||
## ✅ Checklist xác minh
|
||||
|
||||
Before considering i18n + A11y complete:
|
||||
Trước khi xem xét i18n + A11y hoàn tất:
|
||||
|
||||
### i18n Verification
|
||||
- [ ] Both `/en/*` and `/vi/*` routes work
|
||||
- [ ] All text from messages files, not hardcoded
|
||||
- [ ] Metadata changes with locale
|
||||
- [ ] Cookies/headers work for locale selection
|
||||
- [ ] Validation messages use i18n
|
||||
- [ ] All enums use translations
|
||||
- [ ] Tests mock i18n correctly
|
||||
### Xác minh i18n
|
||||
- [ ] Cả route `/en/*` và `/vi/*` đều hoạt động
|
||||
- [ ] Tất cả văn bản từ file messages, không hardcode
|
||||
- [ ] Metadata thay đổi theo locale
|
||||
- [ ] Cookie/header hoạt động cho việc chọn locale
|
||||
- [ ] Thông báo validation sử dụng i18n
|
||||
- [ ] Tất cả các enum sử dụng bản dịch
|
||||
- [ ] Test mock i18n đúng cách
|
||||
|
||||
### A11y Verification
|
||||
- [ ] Focus trap works in dialogs
|
||||
- [ ] Focus indicator visible on all inputs
|
||||
- [ ] Form errors linked with aria-describedby
|
||||
- [ ] Icon buttons all have aria-labels
|
||||
- [ ] Color contrast >= 4.5:1 for text (AA standard)
|
||||
- [ ] Keyboard navigation works everywhere
|
||||
- [ ] Screen reader testing (NVDA/JAWS)
|
||||
- [ ] Loading spinners have aria-busy
|
||||
- [ ] All tables have proper headers
|
||||
### Xác minh A11y
|
||||
- [ ] Focus trap hoạt động trong dialog
|
||||
- [ ] Chỉ báo focus hiển thị trên tất cả input
|
||||
- [ ] Lỗi form được liên kết với aria-describedby
|
||||
- [ ] Tất cả nút biểu tượng có aria-label
|
||||
- [ ] Tỷ lệ tương phản màu >= 4.5:1 cho văn bản (chuẩn AA)
|
||||
- [ ] Điều hướng bàn phím hoạt động ở mọi nơi
|
||||
- [ ] Test với screen reader (NVDA/JAWS)
|
||||
- [ ] Loading spinner có aria-busy
|
||||
- [ ] Tất cả các bảng có header phù hợp
|
||||
|
||||
---
|
||||
|
||||
**Generated:** April 9, 2026
|
||||
**Confidence:** High
|
||||
**Total Estimated Files to Update:** 50-60 files
|
||||
**Được tạo:** Ngày 9 tháng 4 năm 2026
|
||||
**Độ tin cậy:** Cao
|
||||
**Tổng số file ước tính cần cập nhật:** 50-60 file
|
||||
|
||||
@@ -1,22 +1,22 @@
|
||||
# GoodGo Platform AI — Implementation Plan
|
||||
# Nền tảng GoodGo AI — Kế hoạch triển khai
|
||||
|
||||
**Last Updated:** 2026-04-12
|
||||
**Cập nhật lần cuối:** 2026-04-12
|
||||
|
||||
---
|
||||
|
||||
## Milestones
|
||||
## Các Milestone
|
||||
|
||||
### Milestone 1: Walking Skeleton (Phase 0)
|
||||
|
||||
**Goal:** Any engineer can clone, install, and start developing.
|
||||
**Mục tiêu:** Bất kỳ kỹ sư nào cũng có thể clone, cài đặt và bắt đầu phát triển.
|
||||
|
||||
**Execution Order:**
|
||||
**Thứ tự thực hiện:**
|
||||
|
||||
1. **[TEC-1415] Monorepo Scaffolding** + **[TEC-1416] Docker Compose** (parallel — no deps)
|
||||
2. **[TEC-1420] ESLint/Prettier** (after F1)
|
||||
3. **[TEC-1417] Prisma Schema** (after F1 + F2)
|
||||
4. **[TEC-1418] Shared Module** (after F1)
|
||||
5. **[TEC-1419] CI/CD Pipeline** (after F1)
|
||||
1. **[TEC-1415] Monorepo Scaffolding** + **[TEC-1416] Docker Compose** (song song — không có dependency)
|
||||
2. **[TEC-1420] ESLint/Prettier** (sau F1)
|
||||
3. **[TEC-1417] Prisma Schema** (sau F1 + F2)
|
||||
4. **[TEC-1418] Shared Module** (sau F1)
|
||||
5. **[TEC-1419] CI/CD Pipeline** (sau F1)
|
||||
|
||||
```
|
||||
F1 (Monorepo) ──┬── F6 (Lint/Prettier)
|
||||
@@ -28,17 +28,17 @@ F2 (Docker) ─────┘
|
||||
|
||||
### Milestone 2: Core Product (Phase 1)
|
||||
|
||||
**Goal:** Users can register, post listings, and search properties.
|
||||
**Mục tiêu:** Người dùng có thể đăng ký, đăng tin và tìm kiếm bất động sản.
|
||||
|
||||
**Execution Order:**
|
||||
**Thứ tự thực hiện:**
|
||||
|
||||
1. **[TEC-1421] Auth Backend** (after F3, F4)
|
||||
2. **[TEC-1425] Security Hardening** + **[TEC-1426] Error Handling** (parallel, after F1/F4)
|
||||
3. **[TEC-1422] Auth Frontend** (after C1)
|
||||
4. **[TEC-1423] Listings Backend** (after C1)
|
||||
5. **[TEC-1424] Search Backend** (after C3)
|
||||
6. **[TEC-1427] Listings Frontend** (after C3)
|
||||
7. **[TEC-1428] Search + Landing Frontend** (after C5)
|
||||
1. **[TEC-1421] Auth Backend** (sau F3, F4)
|
||||
2. **[TEC-1425] Security Hardening** + **[TEC-1426] Error Handling** (song song, sau F1/F4)
|
||||
3. **[TEC-1422] Auth Frontend** (sau C1)
|
||||
4. **[TEC-1423] Listings Backend** (sau C1)
|
||||
5. **[TEC-1424] Search Backend** (sau C3)
|
||||
6. **[TEC-1427] Listings Frontend** (sau C3)
|
||||
7. **[TEC-1428] Search + Landing Frontend** (sau C5)
|
||||
|
||||
```
|
||||
F3 + F4 ──→ C1 (Auth BE) ──┬── C2 (Auth FE)
|
||||
@@ -50,7 +50,7 @@ F3 + F4 ──→ C1 (Auth BE) ──┬── C2 (Auth FE)
|
||||
|
||||
### Milestone 3: Monetization (Phase 2)
|
||||
|
||||
**Goal:** Revenue-generating MVP with payments, subscriptions, and admin tools.
|
||||
**Mục tiêu:** MVP tạo doanh thu với thanh toán, subscription và công cụ admin.
|
||||
|
||||
```
|
||||
C1 ──→ M1 (Payments) ──→ M2 (Subscriptions)
|
||||
@@ -61,7 +61,7 @@ Phase 1 ──→ X4 (E2E Tests)
|
||||
|
||||
### Milestone 4: AI-Powered (Phase 3)
|
||||
|
||||
**Goal:** Differentiated product with AI features.
|
||||
**Mục tiêu:** Sản phẩm khác biệt với các tính năng AI.
|
||||
|
||||
```
|
||||
F2 ──→ A1 (AI/ML Container) ──→ A2 (Analytics)
|
||||
@@ -70,12 +70,12 @@ C5 + A2 ──→ A3 (MCP Servers)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map
|
||||
## Bản đồ phụ thuộc
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| ------------- | ---------- |
|
||||
| TEC-1415 (F1) | None |
|
||||
| TEC-1416 (F2) | None |
|
||||
| TEC-1415 (F1) | Không |
|
||||
| TEC-1416 (F2) | Không |
|
||||
| TEC-1417 (F3) | F1, F2 |
|
||||
| TEC-1418 (F4) | F1 |
|
||||
| TEC-1419 (F5) | F1 |
|
||||
@@ -96,15 +96,15 @@ C5 + A2 ──→ A3 (MCP Servers)
|
||||
|
||||
### Milestone 5: Production Hardening (Phase 4)
|
||||
|
||||
**Goal:** Fix all critical security issues. Establish production deployment capability.
|
||||
**Mục tiêu:** Sửa tất cả các vấn đề bảo mật quan trọng. Thiết lập khả năng triển khai production.
|
||||
|
||||
**Execution Order:**
|
||||
**Thứ tự thực hiện:**
|
||||
|
||||
1. **[TEC-1449] JWT Secret Fix** + **[TEC-1451] HMAC Timing Fix** + **[TEC-1452] MinIO Fix** + **[TEC-1453] CSRF** (parallel — no deps between them)
|
||||
2. **[TEC-1455] DB Index** (independent — can run parallel with above)
|
||||
3. **[TEC-1450] Deployment Pipeline** (after security fixes verified)
|
||||
4. **[TEC-1457] Backups + Logs** (after deployment infra exists)
|
||||
5. **[TEC-1456] Test Coverage** (parallel — independent of infra)
|
||||
1. **[TEC-1449] JWT Secret Fix** + **[TEC-1451] HMAC Timing Fix** + **[TEC-1452] MinIO Fix** + **[TEC-1453] CSRF** (song song — không có dependency giữa chúng)
|
||||
2. **[TEC-1455] DB Index** (độc lập — có thể chạy song song với các task trên)
|
||||
3. **[TEC-1450] Deployment Pipeline** (sau khi đã xác minh các bản sửa lỗi bảo mật)
|
||||
4. **[TEC-1457] Backups + Logs** (sau khi hạ tầng deployment đã có)
|
||||
5. **[TEC-1456] Test Coverage** (song song — độc lập với hạ tầng)
|
||||
|
||||
```
|
||||
TEC-1449 (JWT) ──────┐
|
||||
@@ -117,7 +117,7 @@ TEC-1456 (Tests) ─────────────────────
|
||||
|
||||
### Milestone 6: Quality & Polish (Phase 5)
|
||||
|
||||
**Goal:** Production-quality UX, documentation, and performance.
|
||||
**Mục tiêu:** UX, tài liệu và hiệu năng đạt chất lượng production.
|
||||
|
||||
```
|
||||
Phase 4 done ──→ TEC-1458 (Redis Caching)
|
||||
@@ -128,47 +128,47 @@ Phase 4 done ──→ TEC-1458 (Redis Caching)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map (Phase 4-5)
|
||||
## Bản đồ phụ thuộc (Phase 4-5)
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| --------------- | ----------------- |
|
||||
| TEC-1449 | None |
|
||||
| TEC-1450 | TEC-1449 (security first) |
|
||||
| TEC-1451 | None |
|
||||
| TEC-1452 | None |
|
||||
| TEC-1453 | None |
|
||||
| TEC-1455 | None |
|
||||
| TEC-1456 | None |
|
||||
| TEC-1449 | Không |
|
||||
| TEC-1450 | TEC-1449 (bảo mật trước) |
|
||||
| TEC-1451 | Không |
|
||||
| TEC-1452 | Không |
|
||||
| TEC-1453 | Không |
|
||||
| TEC-1455 | Không |
|
||||
| TEC-1456 | Không |
|
||||
| TEC-1457 | TEC-1450 |
|
||||
| TEC-1458 | Phase 4 |
|
||||
| TEC-1459 | None |
|
||||
| TEC-1460 | None |
|
||||
| TEC-1461 | None |
|
||||
| TEC-1459 | Không |
|
||||
| TEC-1460 | Không |
|
||||
| TEC-1461 | Không |
|
||||
|
||||
### Milestone 7: MVP Feature Completion & Audit (Phase 6)
|
||||
### Milestone 7: Hoàn thành tính năng MVP & Audit (Phase 6)
|
||||
|
||||
**Goal:** Complete remaining MVP features (Agent Portal, AI, Payments), clean up tech debt from audit.
|
||||
**Mục tiêu:** Hoàn thành các tính năng MVP còn lại (Agent Portal, AI, Payments), dọn dẹp tech debt từ audit.
|
||||
|
||||
**Sprint 1 — Stabilize (Week 1):**
|
||||
1. **[TEC-1592] Commit untracked files** (P0, no deps)
|
||||
2. **[TEC-1593] Fix Architect agent** (P0, no deps)
|
||||
3. **[TEC-1594] i18n consolidation** (P1, no deps)
|
||||
**Sprint 1 — Ổn định (Tuần 1):**
|
||||
1. **[TEC-1592] Commit các file chưa được track** (P0, không có dependency)
|
||||
2. **[TEC-1593] Sửa Architect agent** (P0, không có dependency)
|
||||
3. **[TEC-1594] Hợp nhất i18n** (P1, không có dependency)
|
||||
|
||||
**Sprint 2 — Agent Portal + Payments (Weeks 2-3):**
|
||||
4. **[TEC-1595] Agent Portal** (P1, after TEC-1592)
|
||||
5. **[TEC-1597] Payment flow** (P1, after TEC-1592)
|
||||
6. **[TEC-1598] Smoke tests** (P1, independent)
|
||||
**Sprint 2 — Agent Portal + Payments (Tuần 2-3):**
|
||||
4. **[TEC-1595] Agent Portal** (P1, sau TEC-1592)
|
||||
5. **[TEC-1597] Luồng thanh toán** (P1, sau TEC-1592)
|
||||
6. **[TEC-1598] Smoke test** (P1, độc lập)
|
||||
|
||||
**Sprint 3 — AI & Quality (Weeks 4-5):**
|
||||
7. **[TEC-1596] AI/ML integration** (P1, after TEC-1592)
|
||||
8. **[TEC-1599] Test coverage** (P2, independent)
|
||||
9. **[TEC-1600] OpenAPI docs** (P2, independent)
|
||||
**Sprint 3 — AI & Chất lượng (Tuần 4-5):**
|
||||
7. **[TEC-1596] Tích hợp AI/ML** (P1, sau TEC-1592)
|
||||
8. **[TEC-1599] Độ bao phủ test** (P2, độc lập)
|
||||
9. **[TEC-1600] Tài liệu OpenAPI** (P2, độc lập)
|
||||
|
||||
**Sprint 4 — Hardening (Weeks 5-6):**
|
||||
10. **[TEC-1601] K6 baselines** (P2, independent)
|
||||
11. **[TEC-1602] Security audit** (P2, after Phase 4 security fixes)
|
||||
12. **[TEC-1603] DB index optimization** (P2, independent)
|
||||
13. **[TEC-1604] Sentry integration** (P2, independent)
|
||||
**Sprint 4 — Củng cố (Tuần 5-6):**
|
||||
10. **[TEC-1601] Baseline K6** (P2, độc lập)
|
||||
11. **[TEC-1602] Audit bảo mật** (P2, sau các bản sửa bảo mật Phase 4)
|
||||
12. **[TEC-1603] Tối ưu DB index** (P2, độc lập)
|
||||
13. **[TEC-1604] Tích hợp Sentry** (P2, độc lập)
|
||||
|
||||
```
|
||||
TEC-1592 (Commit) ──┬── TEC-1595 (Agent Portal)
|
||||
@@ -182,51 +182,51 @@ TEC-1599..1604 (P2 quality) ── (all independent, parallel)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map (Phase 6)
|
||||
## Bản đồ phụ thuộc (Phase 6)
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| --------------- | ----------------- |
|
||||
| TEC-1592 | None |
|
||||
| TEC-1593 | None |
|
||||
| TEC-1594 | None |
|
||||
| TEC-1592 | Không |
|
||||
| TEC-1593 | Không |
|
||||
| TEC-1594 | Không |
|
||||
| TEC-1595 | TEC-1592 |
|
||||
| TEC-1596 | TEC-1592 |
|
||||
| TEC-1597 | TEC-1592 |
|
||||
| TEC-1598 | None |
|
||||
| TEC-1599 | None |
|
||||
| TEC-1600 | None |
|
||||
| TEC-1601 | None |
|
||||
| TEC-1602 | Phase 4 security |
|
||||
| TEC-1603 | None |
|
||||
| TEC-1604 | None |
|
||||
| TEC-1598 | Không |
|
||||
| TEC-1599 | Không |
|
||||
| TEC-1600 | Không |
|
||||
| TEC-1601 | Không |
|
||||
| TEC-1602 | Bảo mật Phase 4 |
|
||||
| TEC-1603 | Không |
|
||||
| TEC-1604 | Không |
|
||||
|
||||
### Milestone 8: Post-MVP Improvements (Phase 7)
|
||||
### Milestone 8: Cải tiến sau MVP (Phase 7)
|
||||
|
||||
**Goal:** Fix remaining bugs, harden for production, improve UX and DX.
|
||||
**Mục tiêu:** Sửa các bug còn lại, củng cố cho production, cải thiện UX và DX.
|
||||
|
||||
**Wave 1 — Critical Bug Fixes (1-2 days):**
|
||||
1. **[TEC-1647] Fix Reviews routing** (P0, no deps)
|
||||
2. **[TEC-1648] Fix Health endpoints** (P0, no deps)
|
||||
3. **[TEC-1649] Fix Login error handling** (P0, needs DB)
|
||||
4. **[TEC-1650] Fix Listing 404** (P1, needs DB)
|
||||
**Wave 1 — Sửa lỗi quan trọng (1-2 ngày):**
|
||||
1. **[TEC-1647] Sửa định tuyến Reviews** (P0, không có dependency)
|
||||
2. **[TEC-1648] Sửa các Health endpoint** (P0, không có dependency)
|
||||
3. **[TEC-1649] Sửa xử lý lỗi Login** (P0, cần DB)
|
||||
4. **[TEC-1650] Sửa Listing 404** (P1, cần DB)
|
||||
|
||||
**Wave 2 — Production Readiness (3-5 days):**
|
||||
5. **[TEC-1651] E2E CI environment** (P1, no deps)
|
||||
6. **[TEC-1652] Run E2E tests** (P1, after Wave 1 fixes)
|
||||
7. **[TEC-1653] Security headers audit** (P1, no deps)
|
||||
8. **[TEC-1658] PgBouncer pooling** (P1, no deps)
|
||||
**Wave 2 — Sẵn sàng Production (3-5 ngày):**
|
||||
5. **[TEC-1651] Môi trường E2E CI** (P1, không có dependency)
|
||||
6. **[TEC-1652] Chạy E2E test** (P1, sau các fix Wave 1)
|
||||
7. **[TEC-1653] Audit security header** (P1, không có dependency)
|
||||
8. **[TEC-1658] PgBouncer pooling** (P1, không có dependency)
|
||||
|
||||
**Wave 3 — User-Facing Quality (1-2 weeks):**
|
||||
9. **[TEC-1654] Mobile responsive** (P1, no deps)
|
||||
10. **[TEC-1655] SEO optimization** (P1, no deps)
|
||||
11. **[TEC-1656] Per-user rate limiting** (P1, no deps)
|
||||
12. **[TEC-1657] Admin audit logging** (P1, no deps)
|
||||
**Wave 3 — Chất lượng hướng tới người dùng (1-2 tuần):**
|
||||
9. **[TEC-1654] Mobile responsive** (P1, không có dependency)
|
||||
10. **[TEC-1655] Tối ưu SEO** (P1, không có dependency)
|
||||
11. **[TEC-1656] Rate limiting theo người dùng** (P1, không có dependency)
|
||||
12. **[TEC-1657] Audit logging cho admin** (P1, không có dependency)
|
||||
|
||||
**Wave 4 — Engineering Excellence (2-3 weeks):**
|
||||
13. **[TEC-1659] Graceful degradation** (P2, no deps)
|
||||
14. **[TEC-1660] Error codes documentation** (P2, no deps)
|
||||
15. **[TEC-1661] RUM + Web Vitals** (P2, no deps)
|
||||
16. **[TEC-1662] Update QA Tracker** (P2, after Wave 2)
|
||||
**Wave 4 — Xuất sắc về Engineering (2-3 tuần):**
|
||||
13. **[TEC-1659] Graceful degradation** (P2, không có dependency)
|
||||
14. **[TEC-1660] Tài liệu mã lỗi** (P2, không có dependency)
|
||||
15. **[TEC-1661] RUM + Web Vitals** (P2, không có dependency)
|
||||
16. **[TEC-1662] Cập nhật QA Tracker** (P2, sau Wave 2)
|
||||
|
||||
```
|
||||
TEC-1647 (Reviews) ──┐
|
||||
@@ -242,39 +242,39 @@ TEC-1659..1661 (Wave 4) ── (all independent, parallel)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map (Phase 7)
|
||||
## Bản đồ phụ thuộc (Phase 7)
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| --------------- | ----------------- |
|
||||
| TEC-1647 | None |
|
||||
| TEC-1648 | None |
|
||||
| TEC-1649 | None |
|
||||
| TEC-1650 | None |
|
||||
| TEC-1651 | None |
|
||||
| TEC-1647 | Không |
|
||||
| TEC-1648 | Không |
|
||||
| TEC-1649 | Không |
|
||||
| TEC-1650 | Không |
|
||||
| TEC-1651 | Không |
|
||||
| TEC-1652 | TEC-1647, TEC-1648 |
|
||||
| TEC-1653 | None |
|
||||
| TEC-1654 | None |
|
||||
| TEC-1655 | None |
|
||||
| TEC-1656 | None |
|
||||
| TEC-1657 | None |
|
||||
| TEC-1658 | None |
|
||||
| TEC-1659 | None |
|
||||
| TEC-1660 | None |
|
||||
| TEC-1661 | None |
|
||||
| TEC-1653 | Không |
|
||||
| TEC-1654 | Không |
|
||||
| TEC-1655 | Không |
|
||||
| TEC-1656 | Không |
|
||||
| TEC-1657 | Không |
|
||||
| TEC-1658 | Không |
|
||||
| TEC-1659 | Không |
|
||||
| TEC-1660 | Không |
|
||||
| TEC-1661 | Không |
|
||||
| TEC-1662 | TEC-1652 |
|
||||
|
||||
### Milestone 9: CEO Audit Wave 5 — Security & Features (Phase 7 continued)
|
||||
### Milestone 9: Audit của CEO Wave 5 — Bảo mật & Tính năng (Phase 7 tiếp)
|
||||
|
||||
**Goal:** Address security vulnerabilities, improve test coverage, implement missing Sprint 3 feature.
|
||||
**Mục tiêu:** Xử lý các lỗ hổng bảo mật, cải thiện độ bao phủ test, triển khai tính năng còn thiếu của Sprint 3.
|
||||
|
||||
**Wave 5a — Security (DAY 1-2, parallel):**
|
||||
1. **[TEC-1684] Fix npm vulnerabilities** (P0, Security Engineer)
|
||||
2. **[TEC-1685] Fix lint error** (P1, QA Engineer)
|
||||
**Wave 5a — Bảo mật (NGÀY 1-2, song song):**
|
||||
1. **[TEC-1684] Sửa lỗ hổng npm** (P0, Security Engineer)
|
||||
2. **[TEC-1685] Sửa lỗi lint** (P1, QA Engineer)
|
||||
|
||||
**Wave 5b — Quality & Features (WEEK 1-2):**
|
||||
3. **[TEC-1686] Test coverage push** (P1, QA Engineer, after 5a)
|
||||
**Wave 5b — Chất lượng & Tính năng (TUẦN 1-2):**
|
||||
3. **[TEC-1686] Đẩy mạnh độ bao phủ test** (P1, QA Engineer, sau 5a)
|
||||
4. **[TEC-1688] Saved Searches + Alerts** (P1, Architect)
|
||||
5. **[TEC-1687] Dependabot setup** (P2, DevOps Engineer)
|
||||
5. **[TEC-1687] Thiết lập Dependabot** (P2, DevOps Engineer)
|
||||
|
||||
```
|
||||
TEC-1684 (NPM Vuln) ─────── (independent, P0)
|
||||
@@ -285,43 +285,43 @@ TEC-1687 (Dependabot) ────── (independent, P2)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map (Wave 5)
|
||||
## Bản đồ phụ thuộc (Wave 5)
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| --------------- | ----------------- |
|
||||
| TEC-1684 | None |
|
||||
| TEC-1685 | None |
|
||||
| TEC-1684 | Không |
|
||||
| TEC-1685 | Không |
|
||||
| TEC-1686 | TEC-1685 |
|
||||
| TEC-1687 | None |
|
||||
| TEC-1688 | None |
|
||||
| TEC-1687 | Không |
|
||||
| TEC-1688 | Không |
|
||||
|
||||
---
|
||||
|
||||
## Rollout Notes
|
||||
## Ghi chú triển khai
|
||||
|
||||
- **Phase 0-6 complete** — 51/51 tasks done, MVP feature-complete
|
||||
- **Phase 7 is current priority** — bug fixes and production hardening
|
||||
- **Wave 13 is current sprint** — 6 tasks (TEC-1918 through TEC-1923)
|
||||
- **Total project status** (from Paperclip, 2026-04-12): 219 done / 3 in progress / 9 todo / 3 cancelled out of 234 issues
|
||||
- **Critical path:** TEC-1918 (TS errors) → TEC-1919 (E2E unblock) → production readiness checklist (TEC-1922)
|
||||
- **Priorities:** CI green (TEC-1918), E2E (TEC-1919), backlog grooming (TEC-1920), /pricing page (TEC-1921)
|
||||
- **Production path:** Wave 13 fixes → production readiness checklist → go-live decision
|
||||
- **Phase 0-6 đã hoàn thành** — 51/51 task xong, MVP hoàn chỉnh tính năng
|
||||
- **Phase 7 là ưu tiên hiện tại** — sửa bug và củng cố production
|
||||
- **Wave 13 là sprint hiện tại** — 6 task (TEC-1918 đến TEC-1923)
|
||||
- **Tổng trạng thái dự án** (từ Paperclip, 2026-04-12): 219 done / 3 in progress / 9 todo / 3 cancelled trên tổng số 234 issue
|
||||
- **Đường găng:** TEC-1918 (TS errors) → TEC-1919 (E2E unblock) → checklist sẵn sàng production (TEC-1922)
|
||||
- **Ưu tiên:** CI green (TEC-1918), E2E (TEC-1919), grooming backlog (TEC-1920), trang /pricing (TEC-1921)
|
||||
- **Lộ trình production:** Các fix Wave 13 → checklist sẵn sàng production → quyết định go-live
|
||||
|
||||
### Milestone 13: CEO Audit Wave 13 (Phase 7 continued)
|
||||
### Milestone 13: Audit của CEO Wave 13 (Phase 7 tiếp)
|
||||
|
||||
**Goal:** Fix remaining TS errors, unblock E2E, groom backlog, complete pricing page, production readiness checklist.
|
||||
**Mục tiêu:** Sửa các lỗi TS còn lại, gỡ chặn E2E, grooming backlog, hoàn thành trang pricing, checklist sẵn sàng production.
|
||||
|
||||
**Wave 13A — CI Fix (Day 1):**
|
||||
1. **[TEC-1918] Fix 7 TS compile errors in web test files** (P0, Senior Backend Engineer)
|
||||
**Wave 13A — Sửa CI (Ngày 1):**
|
||||
1. **[TEC-1918] Sửa 7 lỗi biên dịch TS trong các file test web** (P0, Senior Backend Engineer)
|
||||
|
||||
**Wave 13B — Features & Quality (Days 2-3):**
|
||||
2. **[TEC-1919] Unblock E2E test environment** (P1, DevOps Engineer)
|
||||
3. **[TEC-1920] Backlog grooming — deduplicate and close resolved** (P1, QA Engineer)
|
||||
4. **[TEC-1921] Complete /pricing page** (P1, Senior Frontend Engineer)
|
||||
**Wave 13B — Tính năng & Chất lượng (Ngày 2-3):**
|
||||
2. **[TEC-1919] Gỡ chặn môi trường E2E test** (P1, DevOps Engineer)
|
||||
3. **[TEC-1920] Grooming backlog — loại bỏ trùng lặp và đóng các task đã giải quyết** (P1, QA Engineer)
|
||||
4. **[TEC-1921] Hoàn thành trang /pricing** (P1, Senior Frontend Engineer)
|
||||
|
||||
**Wave 13C — Documentation & Readiness (Days 3-5):**
|
||||
5. **[TEC-1922] Production readiness checklist** (P2, SRE Engineer)
|
||||
6. **[TEC-1923] Update PROJECT_TRACKER.md** (P2, Technical Writer)
|
||||
**Wave 13C — Tài liệu & Sẵn sàng (Ngày 3-5):**
|
||||
5. **[TEC-1922] Checklist sẵn sàng production** (P2, SRE Engineer)
|
||||
6. **[TEC-1923] Cập nhật PROJECT_TRACKER.md** (P2, Technical Writer)
|
||||
|
||||
```
|
||||
TEC-1918 (TS Errors) ──→ TEC-1919 (E2E Unblock)
|
||||
@@ -333,31 +333,31 @@ TEC-1923 (Tracker) ────── (independent)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map (Wave 13)
|
||||
## Bản đồ phụ thuộc (Wave 13)
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| --------------- | ----------------- |
|
||||
| TEC-1918 | None |
|
||||
| TEC-1918 | Không |
|
||||
| TEC-1919 | TEC-1918 |
|
||||
| TEC-1920 | None |
|
||||
| TEC-1921 | None |
|
||||
| TEC-1920 | Không |
|
||||
| TEC-1921 | Không |
|
||||
| TEC-1922 | TEC-1918, TEC-1919|
|
||||
| TEC-1923 | None |
|
||||
| TEC-1923 | Không |
|
||||
|
||||
### Milestone 12: CEO Audit — CI Pipeline Fix (Phase 7 Wave 12)
|
||||
### Milestone 12: Audit của CEO — Sửa CI Pipeline (Phase 7 Wave 12)
|
||||
|
||||
**Goal:** Restore CI pipeline to green. Fix all TypeScript, ESLint, and test failures. Commit outstanding work.
|
||||
**Mục tiêu:** Khôi phục CI pipeline về trạng thái xanh. Sửa tất cả các lỗi TypeScript, ESLint và test. Commit công việc còn tồn đọng.
|
||||
|
||||
**Wave 12A — Fix CI (Day 1, parallel):**
|
||||
1. **[TEC-1898] Fix Prisma 7 migration** (P0, Senior Backend Engineer)
|
||||
2. **[TEC-1899] Fix 31 failing unit tests** (P0, QA Engineer)
|
||||
3. **[TEC-1900] Fix ESLint errors + commit files** (P0, Senior Backend Engineer, after TEC-1898)
|
||||
**Wave 12A — Sửa CI (Ngày 1, song song):**
|
||||
1. **[TEC-1898] Sửa migration Prisma 7** (P0, Senior Backend Engineer)
|
||||
2. **[TEC-1899] Sửa 31 unit test thất bại** (P0, QA Engineer)
|
||||
3. **[TEC-1900] Sửa lỗi ESLint + commit file** (P0, Senior Backend Engineer, sau TEC-1898)
|
||||
|
||||
**Wave 12B — Bug Fixes (Days 2-3):**
|
||||
4. **[TEC-1649] Login 500→401 fix** (P1, in progress)
|
||||
5. **[TEC-1657] Admin audit logging** (P1, todo)
|
||||
6. **[TEC-1878] E2E environment** (P1, DevOps Engineer)
|
||||
7. **[TEC-1847] React component tests** (P1, QA Engineer)
|
||||
**Wave 12B — Sửa lỗi (Ngày 2-3):**
|
||||
4. **[TEC-1649] Fix Login 500→401** (P1, đang tiến hành)
|
||||
5. **[TEC-1657] Audit logging cho admin** (P1, todo)
|
||||
6. **[TEC-1878] Môi trường E2E** (P1, DevOps Engineer)
|
||||
7. **[TEC-1847] Test component React** (P1, QA Engineer)
|
||||
|
||||
```
|
||||
TEC-1898 (Prisma Fix) ──┬── TEC-1900 (ESLint + Commit)
|
||||
@@ -370,14 +370,14 @@ TEC-1847 (RTL Tests) ──── (independent)
|
||||
|
||||
---
|
||||
|
||||
## Dependency Map (Wave 12)
|
||||
## Bản đồ phụ thuộc (Wave 12)
|
||||
|
||||
| Task | Depends On |
|
||||
| Task | Phụ thuộc vào |
|
||||
| --------------- | ----------------- |
|
||||
| TEC-1898 | None |
|
||||
| TEC-1899 | None |
|
||||
| TEC-1898 | Không |
|
||||
| TEC-1899 | Không |
|
||||
| TEC-1900 | TEC-1898 |
|
||||
| TEC-1649 | None |
|
||||
| TEC-1657 | None |
|
||||
| TEC-1878 | None |
|
||||
| TEC-1847 | None |
|
||||
| TEC-1649 | Không |
|
||||
| TEC-1657 | Không |
|
||||
| TEC-1878 | Không |
|
||||
| TEC-1847 | Không |
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
# GoodGo Frontend: i18n + A11y Implementation Quick Reference
|
||||
# GoodGo Frontend: Tham chiếu nhanh triển khai i18n + A11y
|
||||
|
||||
## 🎯 Key Findings at a Glance
|
||||
## 🎯 Những phát hiện chính trong nháy mắt
|
||||
|
||||
### Current State
|
||||
- ✅ **Next.js 15** with App Router (well-structured)
|
||||
- ✅ **React 18** + TypeScript (type-safe)
|
||||
- ✅ **Tailwind CSS** with dark mode support (HSL-based theme)
|
||||
- ✅ **Good component library** (~35 components)
|
||||
- ✅ **Some A11y basics** in place (semantic HTML, ARIA labels, skip link)
|
||||
- ❌ **NO i18n setup** (everything hardcoded Vietnamese)
|
||||
- ❌ **A11y gaps** (focus management, some ARIA missing, color contrast TBD)
|
||||
### Trạng thái hiện tại
|
||||
- ✅ **Next.js 15** với App Router (cấu trúc tốt)
|
||||
- ✅ **React 18** + TypeScript (an toàn kiểu)
|
||||
- ✅ **Tailwind CSS** với hỗ trợ dark mode (theme dựa trên HSL)
|
||||
- ✅ **Thư viện component tốt** (~35 component)
|
||||
- ✅ **Một số kiến thức cơ bản về A11y** đã có (HTML ngữ nghĩa, ARIA labels, skip link)
|
||||
- ❌ **CHƯA thiết lập i18n** (tất cả tiếng Việt được hardcode)
|
||||
- ❌ **Thiếu sót A11y** (quản lý focus, một số ARIA còn thiếu, tương phản màu chưa xác định)
|
||||
|
||||
### Strategic Entry Points for Implementation
|
||||
### Điểm vào chiến lược cho việc triển khai
|
||||
|
||||
#### 1. **i18n Entry Points** (Priority 1)
|
||||
#### 1. **Điểm vào i18n** (Ưu tiên 1)
|
||||
```
|
||||
Files to modify for i18n:
|
||||
├── app/layout.tsx → Add i18n provider
|
||||
@@ -29,7 +29,7 @@ Files to modify for i18n:
|
||||
Total files to update: ~25-30 files with hardcoded strings
|
||||
```
|
||||
|
||||
#### 2. **A11y Critical Fixes** (Priority 1.5)
|
||||
#### 2. **Sửa lỗi A11y quan trọng** (Ưu tiên 1.5)
|
||||
```
|
||||
Components needing A11y updates:
|
||||
├── components/ui/dialog.tsx → Focus trapping + focus restoration
|
||||
@@ -46,7 +46,7 @@ Tasks:
|
||||
- Link form errors to inputs with aria-describedby
|
||||
```
|
||||
|
||||
#### 3. **Message File Structure for i18n**
|
||||
#### 3. **Cấu trúc file Message cho i18n**
|
||||
```
|
||||
public/locales/
|
||||
├── en.json
|
||||
@@ -64,142 +64,142 @@ public/locales/
|
||||
|
||||
---
|
||||
|
||||
## 📋 Implementation Checklist
|
||||
## 📋 Checklist triển khai
|
||||
|
||||
### Phase 1: Setup (2-3 hours)
|
||||
- [ ] Install `next-intl` package
|
||||
- [ ] Create message files (en.json, vi.json)
|
||||
- [ ] Update next.config.js for i18n routing
|
||||
- [ ] Create i18n config (config.ts)
|
||||
- [ ] Update middleware.ts for locale detection
|
||||
- [ ] Wrap root layout with i18n provider
|
||||
### Giai đoạn 1: Thiết lập (2-3 giờ)
|
||||
- [ ] Cài đặt gói `next-intl`
|
||||
- [ ] Tạo các file message (en.json, vi.json)
|
||||
- [ ] Cập nhật next.config.js cho routing i18n
|
||||
- [ ] Tạo cấu hình i18n (config.ts)
|
||||
- [ ] Cập nhật middleware.ts để phát hiện locale
|
||||
- [ ] Bao bọc root layout bằng provider i18n
|
||||
|
||||
### Phase 2: Core Refactoring (6-8 hours)
|
||||
- [ ] Update root layout & metadata
|
||||
- [ ] Refactor all validations (Zod) to use messages
|
||||
- [ ] Extract component strings to useTranslations()
|
||||
- [ ] Update all enums (TRANSACTION_TYPES, PROPERTY_TYPES, etc.) to use i18n
|
||||
- [ ] Update page layouts (public, auth, dashboard)
|
||||
- [ ] Update all page content
|
||||
### Giai đoạn 2: Tái cấu trúc cốt lõi (6-8 giờ)
|
||||
- [ ] Cập nhật root layout & metadata
|
||||
- [ ] Tái cấu trúc tất cả validation (Zod) để sử dụng messages
|
||||
- [ ] Trích xuất chuỗi component sang useTranslations()
|
||||
- [ ] Cập nhật tất cả các enum (TRANSACTION_TYPES, PROPERTY_TYPES, v.v.) để sử dụng i18n
|
||||
- [ ] Cập nhật các page layout (public, auth, dashboard)
|
||||
- [ ] Cập nhật toàn bộ nội dung trang
|
||||
|
||||
### Phase 3: Component Updates (4-6 hours)
|
||||
- [ ] Update all UI components
|
||||
- [ ] Update form components
|
||||
- [ ] Update navigation components
|
||||
- [ ] Update search/filter components
|
||||
- [ ] Update listing form
|
||||
### Giai đoạn 3: Cập nhật component (4-6 giờ)
|
||||
- [ ] Cập nhật tất cả các component UI
|
||||
- [ ] Cập nhật các component form
|
||||
- [ ] Cập nhật các component navigation
|
||||
- [ ] Cập nhật các component search/filter
|
||||
- [ ] Cập nhật form đăng tin (listing form)
|
||||
|
||||
### Phase 4: A11y Fixes (4-6 hours)
|
||||
- [ ] Fix focus management in dialogs
|
||||
- [ ] Add focus trapping
|
||||
- [ ] Update form error linking (aria-describedby)
|
||||
- [ ] Add aria-busy to loading states
|
||||
- [ ] Add aria-labels to icon buttons
|
||||
- [ ] Verify color contrast
|
||||
- [ ] Update test setup for i18n
|
||||
### Giai đoạn 4: Sửa lỗi A11y (4-6 giờ)
|
||||
- [ ] Sửa quản lý focus trong dialog
|
||||
- [ ] Thêm focus trapping
|
||||
- [ ] Cập nhật liên kết lỗi form (aria-describedby)
|
||||
- [ ] Thêm aria-busy cho trạng thái loading
|
||||
- [ ] Thêm aria-label cho các nút biểu tượng
|
||||
- [ ] Xác minh tương phản màu
|
||||
- [ ] Cập nhật thiết lập test cho i18n
|
||||
|
||||
### Phase 5: Testing & QA (3-4 hours)
|
||||
- [ ] Test both locales on all pages
|
||||
- [ ] Run axe DevTools accessibility audit
|
||||
- [ ] Test keyboard navigation
|
||||
- [ ] Test screen reader compatibility
|
||||
- [ ] Update unit tests for i18n
|
||||
### Giai đoạn 5: Test & QA (3-4 giờ)
|
||||
- [ ] Test cả hai locale trên tất cả các trang
|
||||
- [ ] Chạy kiểm tra khả năng tiếp cận bằng axe DevTools
|
||||
- [ ] Test điều hướng bằng bàn phím
|
||||
- [ ] Test tương thích screen reader
|
||||
- [ ] Cập nhật unit test cho i18n
|
||||
|
||||
---
|
||||
|
||||
## 🗣️ Text Content Inventory
|
||||
## 🗣️ Kiểm kê nội dung văn bản
|
||||
|
||||
### Navigation & Layout (~15 items)
|
||||
| Location | Text | Status |
|
||||
### Navigation & Layout (~15 mục)
|
||||
| Vị trí | Văn bản | Trạng thái |
|
||||
|----------|------|--------|
|
||||
| Public header | Trang chủ, Tìm kiếm, Đăng nhập, Đăng ký | ❌ Hardcoded |
|
||||
| Dashboard nav | 8 nav items | ❌ Hardcoded |
|
||||
| Footer | 4 sections | ❌ Hardcoded |
|
||||
| Dashboard nav | 8 mục nav | ❌ Hardcoded |
|
||||
| Footer | 4 phần | ❌ Hardcoded |
|
||||
|
||||
### Forms & Validation (~40+ items)
|
||||
| Location | Type | Count | Status |
|
||||
### Forms & Validation (~40+ mục)
|
||||
| Vị trí | Loại | Số lượng | Trạng thái |
|
||||
|----------|------|-------|--------|
|
||||
| Login form | Labels + errors | 8 | ❌ Hardcoded |
|
||||
| Register form | Labels + errors | 10 | ❌ Hardcoded |
|
||||
| Listing form | Multi-step labels | 25+ | ❌ Hardcoded |
|
||||
| Search filters | Option labels | 30+ | ❌ Hardcoded |
|
||||
| Zod validation | Error messages | 20+ | ❌ Hardcoded |
|
||||
| Login form | Nhãn + lỗi | 8 | ❌ Hardcoded |
|
||||
| Register form | Nhãn + lỗi | 10 | ❌ Hardcoded |
|
||||
| Listing form | Nhãn đa bước | 25+ | ❌ Hardcoded |
|
||||
| Search filters | Nhãn tùy chọn | 30+ | ❌ Hardcoded |
|
||||
| Zod validation | Thông báo lỗi | 20+ | ❌ Hardcoded |
|
||||
|
||||
### Enums & Constants (~50+ items)
|
||||
| File | Items | Status |
|
||||
### Enum & Hằng số (~50+ mục)
|
||||
| File | Mục | Trạng thái |
|
||||
|------|-------|--------|
|
||||
| TRANSACTION_TYPES | 2 labels | ❌ Hardcoded |
|
||||
| PROPERTY_TYPES | 6 labels | ❌ Hardcoded |
|
||||
| LISTING_STATUSES | 8 labels | ❌ Hardcoded |
|
||||
| DIRECTIONS | 8 labels | ❌ Hardcoded |
|
||||
| CITIES | 13 names | ❌ Hardcoded |
|
||||
| PRICE_RANGES | 6 ranges | ❌ Hardcoded |
|
||||
| TRANSACTION_TYPES | 2 nhãn | ❌ Hardcoded |
|
||||
| PROPERTY_TYPES | 6 nhãn | ❌ Hardcoded |
|
||||
| LISTING_STATUSES | 8 nhãn | ❌ Hardcoded |
|
||||
| DIRECTIONS | 8 nhãn | ❌ Hardcoded |
|
||||
| CITIES | 13 tên | ❌ Hardcoded |
|
||||
| PRICE_RANGES | 6 khoảng | ❌ Hardcoded |
|
||||
|
||||
### Page Content (~30 items)
|
||||
| Page | Sections | Status |
|
||||
### Nội dung trang (~30 mục)
|
||||
| Trang | Phần | Trạng thái |
|
||||
|------|----------|--------|
|
||||
| Landing page | Hero, search, stats, CTA | ❌ Hardcoded |
|
||||
| Search results | No results, loading, headers | ❌ Hardcoded |
|
||||
| Dashboard | Section titles, empty states | ❌ Hardcoded |
|
||||
| Trang landing | Hero, search, stats, CTA | ❌ Hardcoded |
|
||||
| Kết quả tìm kiếm | Không có kết quả, loading, header | ❌ Hardcoded |
|
||||
| Dashboard | Tiêu đề phần, trạng thái rỗng | ❌ Hardcoded |
|
||||
|
||||
---
|
||||
|
||||
## 🔑 Critical Files for i18n
|
||||
## 🔑 Các file quan trọng cho i18n
|
||||
|
||||
### Must-Update Files (Blockers)
|
||||
1. **middleware.ts** — Locale routing
|
||||
2. **app/layout.tsx** — i18n provider setup
|
||||
3. **lib/validations/*.ts** — Message integration
|
||||
4. **lib/*.ts** — Any API error message handling
|
||||
### Các file phải cập nhật (Blocker)
|
||||
1. **middleware.ts** — Định tuyến locale
|
||||
2. **app/layout.tsx** — Thiết lập provider i18n
|
||||
3. **lib/validations/*.ts** — Tích hợp messages
|
||||
4. **lib/*.ts** — Bất kỳ xử lý thông báo lỗi API nào
|
||||
|
||||
### High-Priority Files
|
||||
### Các file ưu tiên cao
|
||||
1. **app/(public)/layout.tsx** — Navigation
|
||||
2. **app/(auth)/login/page.tsx** — Auth forms
|
||||
2. **app/(auth)/login/page.tsx** — Form xác thực
|
||||
3. **components/listings/listing-form-steps.tsx** — Forms
|
||||
4. **components/search/filter-bar.tsx** — Filters
|
||||
4. **components/search/filter-bar.tsx** — Bộ lọc
|
||||
|
||||
### Medium-Priority Files
|
||||
1. All page components
|
||||
2. All UI components with text
|
||||
3. Error boundary components
|
||||
### Các file ưu tiên trung bình
|
||||
1. Tất cả các component trang
|
||||
2. Tất cả các component UI có văn bản
|
||||
3. Các component error boundary
|
||||
|
||||
---
|
||||
|
||||
## ♿ A11y Implementation Priority
|
||||
## ♿ Ưu tiên triển khai A11y
|
||||
|
||||
### WCAG 2.1 AA Critical Fixes
|
||||
1. **Focus Management** (Level A)
|
||||
- Add focus trap in `dialog.tsx`
|
||||
- Restore focus on dialog close
|
||||
- Visible focus indicator on all buttons
|
||||
### Sửa lỗi quan trọng WCAG 2.1 AA
|
||||
1. **Quản lý focus** (Cấp A)
|
||||
- Thêm focus trap trong `dialog.tsx`
|
||||
- Khôi phục focus khi đóng dialog
|
||||
- Chỉ báo focus rõ ràng trên tất cả các nút
|
||||
|
||||
2. **Color Contrast** (Level AA)
|
||||
- Run axe DevTools audit
|
||||
- Fix any < 4.5:1 ratio text
|
||||
- Fix < 3:1 ratio graphics
|
||||
2. **Tương phản màu** (Cấp AA)
|
||||
- Chạy kiểm tra axe DevTools
|
||||
- Sửa văn bản có tỷ lệ < 4.5:1
|
||||
- Sửa đồ họa có tỷ lệ < 3:1
|
||||
|
||||
3. **Form Accessibility** (Level A)
|
||||
- Link all error messages with aria-describedby
|
||||
- Proper labeling with htmlFor
|
||||
- Fieldset grouping for complex forms
|
||||
3. **Khả năng tiếp cận form** (Cấp A)
|
||||
- Liên kết tất cả thông báo lỗi với aria-describedby
|
||||
- Gắn nhãn đúng cách với htmlFor
|
||||
- Nhóm fieldset cho các form phức tạp
|
||||
|
||||
4. **Loading States** (Level A)
|
||||
- Add aria-busy to spinners
|
||||
- Add aria-label with context
|
||||
4. **Trạng thái Loading** (Cấp A)
|
||||
- Thêm aria-busy cho spinner
|
||||
- Thêm aria-label kèm ngữ cảnh
|
||||
|
||||
5. **Icon Buttons** (Level A)
|
||||
- All icon-only buttons need aria-label
|
||||
- Theme toggle button already has label ✓
|
||||
5. **Nút biểu tượng** (Cấp A)
|
||||
- Tất cả các nút chỉ có biểu tượng cần aria-label
|
||||
- Nút bật/tắt theme đã có nhãn ✓
|
||||
|
||||
### Nice-to-Have A11y Enhancements
|
||||
- Skip link already present ✓
|
||||
- Semantic HTML already used ✓
|
||||
- Role="alert" on errors ✓
|
||||
- aria-invalid on form fields ✓
|
||||
### Các cải tiến A11y nên có
|
||||
- Skip link đã có sẵn ✓
|
||||
- HTML ngữ nghĩa đã được sử dụng ✓
|
||||
- Role="alert" trên lỗi ✓
|
||||
- aria-invalid trên các trường form ✓
|
||||
|
||||
---
|
||||
|
||||
## 📦 Dependencies to Add
|
||||
## 📦 Các phụ thuộc cần thêm
|
||||
|
||||
```bash
|
||||
npm install next-intl
|
||||
@@ -208,11 +208,11 @@ npm install next-intl
|
||||
# Testing with mocked i18n available
|
||||
```
|
||||
|
||||
**Total installation footprint:** ~500KB minified
|
||||
**Tổng kích thước cài đặt:** ~500KB đã minify
|
||||
|
||||
---
|
||||
|
||||
## 🧪 Testing Strategy
|
||||
## 🧪 Chiến lược test
|
||||
|
||||
### Unit Tests
|
||||
```typescript
|
||||
@@ -241,43 +241,43 @@ describe('LoginForm', () => {
|
||||
|
||||
---
|
||||
|
||||
## 📊 Estimated Timeline
|
||||
## 📊 Lộ trình ước tính
|
||||
|
||||
| Phase | Duration | Effort |
|
||||
| Giai đoạn | Thời gian | Công sức |
|
||||
|-------|----------|--------|
|
||||
| Setup | 2-3h | Low |
|
||||
| Core Refactoring | 6-8h | Medium |
|
||||
| Components | 4-6h | Medium |
|
||||
| A11y Fixes | 4-6h | Low-Medium |
|
||||
| Testing | 3-4h | Medium |
|
||||
| **Total** | **19-27h** | **~3-4 days** |
|
||||
| Thiết lập | 2-3h | Thấp |
|
||||
| Tái cấu trúc cốt lõi | 6-8h | Trung bình |
|
||||
| Components | 4-6h | Trung bình |
|
||||
| Sửa lỗi A11y | 4-6h | Thấp-Trung bình |
|
||||
| Testing | 3-4h | Trung bình |
|
||||
| **Tổng** | **19-27h** | **~3-4 ngày** |
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Implementation Order (Recommended)
|
||||
## 🚀 Thứ tự triển khai (Khuyến nghị)
|
||||
|
||||
1. **Setup i18n infrastructure** (creates foundation)
|
||||
2. **Update middleware + root layout** (enables routing)
|
||||
3. **Extract & centralize all text** (main work)
|
||||
4. **Fix A11y issues** (parallelize with #3)
|
||||
5. **Test thoroughly** (final verification)
|
||||
1. **Thiết lập hạ tầng i18n** (tạo nền tảng)
|
||||
2. **Cập nhật middleware + root layout** (kích hoạt routing)
|
||||
3. **Trích xuất & tập trung tất cả văn bản** (công việc chính)
|
||||
4. **Sửa các vấn đề A11y** (song song với #3)
|
||||
5. **Test kỹ lưỡng** (xác minh cuối cùng)
|
||||
|
||||
---
|
||||
|
||||
## 💡 Quick Win Opportunities
|
||||
## 💡 Cơ hội thắng nhanh
|
||||
|
||||
These can be done immediately:
|
||||
1. Create message file structure (30 min)
|
||||
2. Add focus trap to dialog (30 min)
|
||||
3. Add aria-busy to spinners (20 min)
|
||||
4. Color contrast audit (1 hour)
|
||||
5. Icon button aria-labels (30 min)
|
||||
Những việc có thể làm ngay:
|
||||
1. Tạo cấu trúc file message (30 phút)
|
||||
2. Thêm focus trap cho dialog (30 phút)
|
||||
3. Thêm aria-busy cho spinner (20 phút)
|
||||
4. Kiểm tra tương phản màu (1 giờ)
|
||||
5. Aria-label cho nút biểu tượng (30 phút)
|
||||
|
||||
---
|
||||
|
||||
## 📝 Notes for Implementation
|
||||
## 📝 Ghi chú khi triển khai
|
||||
|
||||
### Locale Detection (middleware)
|
||||
### Phát hiện locale (middleware)
|
||||
```typescript
|
||||
// Check in order: URL > cookie > header > default
|
||||
function getLocale(request) {
|
||||
@@ -288,19 +288,19 @@ function getLocale(request) {
|
||||
}
|
||||
```
|
||||
|
||||
### Message Fallback Strategy
|
||||
### Chiến lược dự phòng Message
|
||||
```typescript
|
||||
// If translation missing, use English as fallback
|
||||
// Otherwise fallback to Vietnamese (primary)
|
||||
```
|
||||
|
||||
### Performance Considerations
|
||||
- Keep message files < 100KB each
|
||||
- Lazy load per-page messages if needed
|
||||
- Static generation for SEO-critical pages
|
||||
### Cân nhắc về hiệu năng
|
||||
- Giữ các file message < 100KB mỗi file
|
||||
- Lazy load message theo trang nếu cần
|
||||
- Static generation cho các trang quan trọng về SEO
|
||||
|
||||
---
|
||||
|
||||
**Last Updated:** April 9, 2026
|
||||
**Version:** 1.0 - Pre-Implementation
|
||||
**Confidence:** High
|
||||
**Cập nhật lần cuối:** Ngày 9 tháng 4 năm 2026
|
||||
**Phiên bản:** 1.0 - Trước triển khai
|
||||
**Độ tin cậy:** Cao
|
||||
|
||||
Reference in New Issue
Block a user