chore: update project documentation, audit reports, and initialize IDE configuration files

docs/audits/ACCESSIBILITY_FIXES_REPORT.md

@@ -1,25 +1,25 @@
-# GoodGo Frontend Accessibility Issues - Code Fixes Required
+# GoodGo Frontend - Các Vấn Đề Trợ Năng - Yêu Cầu Sửa Code
 
-**Date**: 2026-04-10  
-**Scope**: apps/web (GoodGo Frontend)  
-**Status**: ACTIONABLE ITEMS - Ready for Implementation
+**Ngày**: 2026-04-10  
+**Phạm vi**: apps/web (GoodGo Frontend)  
+**Trạng thái**: CÁC MỤC CÓ THỂ THỰC HIỆN - Sẵn sàng triển khai
 
 ---
 
-## Summary
+## Tóm tắt
 
-Found **4 specific accessibility issues** that require code fixes across the GoodGo frontend. Below are the exact file paths, line numbers, problematic code snippets, and required fixes.
+Tìm thấy **4 vấn đề trợ năng cụ thể** cần sửa code trên toàn bộ giao diện frontend GoodGo. Dưới đây là các đường dẫn file chính xác, số dòng, đoạn code có vấn đề và các sửa đổi cần thiết.
 
 ---
 
-## ISSUE 1: Form Inputs Missing aria-label or Associated Labels
+## VẤN ĐỀ 1: Các Input Form Thiếu aria-label hoặc Label Liên Kết
 
-### 1.1 File Upload Input Without aria-label
+### 1.1 Input Tải File Không Có aria-label
 **File**: `apps/web/components/listings/image-upload.tsx`  
-**Line**: 118  
-**Problem**: Hidden file input has no aria-label or associated label element
+**Dòng**: 118  
+**Vấn đề**: Input file ẩn không có aria-label hoặc phần tử label liên kết
 
-**Current Code**:
+**Code hiện tại**:
 ```tsx
 <input
   ref={inputRef}
@@ -34,7 +34,7 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 />
 ```
 
-**Fix Required**: Add `aria-label`
+**Sửa đổi cần thiết**: Thêm `aria-label`
 ```tsx
 <input
   ref={inputRef}
@@ -52,12 +52,12 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 
 ---
 
-### 1.2 Search Save Dialog - Text Input Without aria-label
+### 1.2 Dialog Lưu Tìm Kiếm - Input Văn Bản Không Có aria-label
 **File**: `apps/web/app/[locale]/(public)/search/page.tsx`  
-**Line**: 189  
-**Problem**: Text input for saving search name has no associated label or aria-label
+**Dòng**: 189  
+**Vấn đề**: Input văn bản để lưu tên tìm kiếm không có label liên kết hoặc aria-label
 
-**Current Code**:
+**Code hiện tại**:
 ```tsx
 <input
   type="text"
@@ -70,7 +70,7 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 />
 ```
 
-**Fix Required**: Add `aria-label`
+**Sửa đổi cần thiết**: Thêm `aria-label`
 ```tsx
 <input
   type="text"
@@ -86,12 +86,12 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 
 ---
 
-### 1.3 Admin Moderation - Select All Checkbox Without aria-label
+### 1.3 Quản Trị Kiểm Duyệt - Checkbox Chọn Tất Cả Không Có aria-label
 **File**: `apps/web/app/[locale]/(admin)/admin/moderation/page.tsx`  
-**Line**: 222  
-**Problem**: Table header checkbox for "select all" has no aria-label
+**Dòng**: 222  
+**Vấn đề**: Checkbox trong tiêu đề bảng để "chọn tất cả" không có aria-label
 
-**Current Code**:
+**Code hiện tại**:
 ```tsx
 <TableHead className="w-10">
   <input
@@ -103,7 +103,7 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 </TableHead>
 ```
 
-**Fix Required**: Add `aria-label`
+**Sửa đổi cần thiết**: Thêm `aria-label`
 ```tsx
 <TableHead className="w-10">
   <input
@@ -118,12 +118,12 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 
 ---
 
-### 1.4 Admin Moderation - Row Checkboxes Without aria-label
+### 1.4 Quản Trị Kiểm Duyệt - Checkbox Từng Dòng Không Có aria-label
 **File**: `apps/web/app/[locale]/(admin)/admin/moderation/page.tsx`  
-**Line**: 242  
-**Problem**: Individual row checkboxes in table have no aria-label
+**Dòng**: 242  
+**Vấn đề**: Checkbox từng dòng trong bảng không có aria-label
 
-**Current Code**:
+**Code hiện tại**:
 ```tsx
 <TableCell>
   <input
@@ -135,7 +135,7 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 </TableCell>
 ```
 
-**Fix Required**: Add `aria-label` with dynamic content
+**Sửa đổi cần thiết**: Thêm `aria-label` với nội dung động
 ```tsx
 <TableCell>
   <input
@@ -150,24 +150,24 @@ Found **4 specific accessibility issues** that require code fixes across the Goo
 
 ---
 
-## ISSUE 2: Mock Image Component Missing alt Attribute
+## VẤN ĐỀ 2: Component Ảnh Mock Thiếu Thuộc Tính alt
 
-### 2.1 Test Mock Image Component
+### 2.1 Component Ảnh Mock Trong Test
 **File**: `apps/web/app/[locale]/(public)/search/__tests__/search.spec.tsx`  
-**Line**: 46  
-**Problem**: Mock Image component spreads all props including missing alt attribute
+**Dòng**: 46  
+**Vấn đề**: Component Image mock trải tất cả props nhưng thiếu thuộc tính alt
 
-**Current Code**:
+**Code hiện tại**:
 ```tsx
 default: (props: Record<string, unknown>) => <img {...props} />,
 ```
 
-**Fix Required**: Ensure alt is always included in mock or add default
+**Sửa đổi cần thiết**: Đảm bảo alt luôn có trong mock hoặc thêm giá trị mặc định
 ```tsx
 default: (props: Record<string, unknown>) => <img {...props} alt={props.alt || ''} />,
 ```
 
-OR better approach - require alt in mock setup:
+HOẶC cách tiếp cận tốt hơn - yêu cầu alt trong cấu hình mock:
 ```tsx
 default: (props: Record<string, unknown>) => {
   if (!props.alt) {
@@ -179,14 +179,14 @@ default: (props: Record<string, unknown>) => {
 
 ---
 
-## ISSUE 3: Hidden File Input Needs Better Accessibility
+## VẤN ĐỀ 3: Input File Ẩn Cần Trợ Năng Tốt Hơn
 
-### 3.1 Image Upload Drag-Drop Area Needs Better Labeling
+### 3.1 Khu Vực Kéo Thả Tải Ảnh Cần Gán Nhãn Tốt Hơn
 **File**: `apps/web/components/listings/image-upload.tsx`  
-**Lines**: 86-128  
-**Problem**: The clickable div that triggers file input has descriptive text but no label element linking to the hidden input
+**Dòng**: 86-128  
+**Vấn đề**: Div có thể nhấp để kích hoạt input file có văn bản mô tả nhưng không có phần tử label liên kết đến input ẩn
 
-**Current Implementation**:
+**Cách triển khai hiện tại**:
 ```tsx
 <div
   onDragOver={handleDragOver}
@@ -211,7 +211,7 @@ default: (props: Record<string, unknown>) => {
 </div>
 ```
 
-**Recommended Enhancement**: Add proper label or role
+**Cải tiến đề xuất**: Thêm label hoặc role phù hợp
 ```tsx
 <div
   onDragOver={handleDragOver}
@@ -234,55 +234,54 @@ default: (props: Record<string, unknown>) => {
 
 ---
 
-## ISSUE 4: Verification of Properly Implemented Accessibility
+## VẤN ĐỀ 4: Xác Minh Các Tính Năng Trợ Năng Đã Triển Khai Đúng
 
-### ✅ CORRECT - Image Components with alt attributes
-The following files already have proper alt attributes and require NO changes:
-- `apps/web/components/listings/image-gallery.tsx` - All Image components have alt (lines 34, 77)
-- `apps/web/components/listings/image-upload.tsx` - All img tags have alt (line 135-138)
-- `apps/web/components/search/property-card.tsx` - Image has alt (line 44)
-- `apps/web/app/[locale]/(dashboard)/listings/page.tsx` - All Images have alt (lines 192, 272)
-- `apps/web/app/[locale]/(dashboard)/dashboard/page.tsx` - Image has alt (line 252)
-- `apps/web/app/[locale]/(admin)/admin/kyc/page.tsx` - All Images have alt (lines 102, 116, 130)
+### ✅ ĐÚNG - Các Component Ảnh Có Thuộc Tính alt
+Các file sau đã có thuộc tính alt đúng và KHÔNG cần thay đổi:
+- `apps/web/components/listings/image-gallery.tsx` - Tất cả component Image có alt (dòng 34, 77)
+- `apps/web/components/listings/image-upload.tsx` - Tất cả thẻ img có alt (dòng 135-138)
+- `apps/web/components/search/property-card.tsx` - Image có alt (dòng 44)
+- `apps/web/app/[locale]/(dashboard)/listings/page.tsx` - Tất cả Image có alt (dòng 192, 272)
+- `apps/web/app/[locale]/(dashboard)/dashboard/page.tsx` - Image có alt (dòng 252)
+- `apps/web/app/[locale]/(admin)/admin/kyc/page.tsx` - Tất cả Image có alt (dòng 102, 116, 130)
 
-### ✅ CORRECT - Icon-only Buttons with aria-label
-The following files already have proper aria-labels and require NO changes:
-- `apps/web/components/listings/image-gallery.tsx` - Navigation buttons have aria-labels (lines 47, 54)
-- `apps/web/app/[locale]/(public)/layout.tsx` - Mobile menu button has aria-label (line 91)
+### ✅ ĐÚNG - Nút Chỉ Có Icon Với aria-label
+Các file sau đã có aria-label đúng và KHÔNG cần thay đổi:
+- `apps/web/components/listings/image-gallery.tsx` - Các nút điều hướng có aria-label (dòng 47, 54)
+- `apps/web/app/[locale]/(public)/layout.tsx` - Nút menu di động có aria-label (dòng 91)
 
-### ✅ CORRECT - Dialogs with Semantic Titles
-The following dialogs already have proper DialogTitle elements and require NO changes:
-- `apps/web/app/[locale]/(dashboard)/dashboard/subscription/page.tsx` - DialogTitle present (line 327-329)
-- `apps/web/app/[locale]/(admin)/admin/kyc/page.tsx` - Both dialogs have DialogTitle (approval and rejection dialogs)
+### ✅ ĐÚNG - Các Dialog Có Tiêu Đề Ngữ Nghĩa
+Các dialog sau đã có phần tử DialogTitle đúng và KHÔNG cần thay đổi:
+- `apps/web/app/[locale]/(dashboard)/dashboard/subscription/page.tsx` - DialogTitle có mặt (dòng 327-329)
+- `apps/web/app/[locale]/(admin)/admin/kyc/page.tsx` - Cả hai dialog đều có DialogTitle (dialog duyệt và từ chối)
 
-### ✅ CORRECT - Checkbox with Associated Label
-- `apps/web/app/[locale]/(public)/search/page.tsx` (line 199) - Checkbox has associated `<label>` element
+### ✅ ĐÚNG - Checkbox Có Label Liên Kết
+- `apps/web/app/[locale]/(public)/search/page.tsx` (dòng 199) - Checkbox có phần tử `<label>` liên kết
 
 ---
 
-## Implementation Priority
+## Thứ Tự Ưu Tiên Triển Khai
 
-**Priority 1 (High Impact)**:
-1. Add aria-label to file input (image-upload.tsx:118)
-2. Add aria-label to search name input (search/page.tsx:189)
+**Ưu tiên 1 (Tác động cao)**:
+1. Thêm aria-label vào input file (image-upload.tsx:118)
+2. Thêm aria-label vào input tên tìm kiếm (search/page.tsx:189)
 
-**Priority 2 (High Impact)**:
-3. Add aria-label to table checkboxes (moderation/page.tsx:222, 242)
-4. Fix mock Image component to require alt (search.spec.tsx:46)
+**Ưu tiên 2 (Tác động cao)**:
+3. Thêm aria-label vào checkbox bảng (moderation/page.tsx:222, 242)
+4. Sửa component Image mock để yêu cầu alt (search.spec.tsx:46)
 
-**Priority 3 (Enhancement)**:
-5. Improve image upload drag-drop area accessibility with role and keyboard support (image-upload.tsx:86-128)
+**Ưu tiên 3 (Cải tiến)**:
+5. Cải thiện trợ năng khu vực kéo thả tải ảnh với role và hỗ trợ bàn phím (image-upload.tsx:86-128)
 
 ---
 
-## Testing Checklist
-
-After implementing fixes, verify:
-- [ ] Screen readers announce all form inputs correctly
-- [ ] File input has meaningful aria-label when focused
-- [ ] Search dialog inputs are accessible via keyboard
-- [ ] Table checkboxes have descriptive labels for each row
-- [ ] No console warnings about missing alt attributes in tests
-- [ ] Keyboard navigation works for all interactive elements
-- [ ] WCAG 2.1 Level AA compliance verified with automated tools
+## Danh Sách Kiểm Tra Sau Khi Triển Khai
 
+Sau khi triển khai các sửa đổi, hãy xác minh:
+- [ ] Trình đọc màn hình thông báo đúng tất cả các input form
+- [ ] Input file có aria-label có ý nghĩa khi được focus
+- [ ] Các input trong dialog tìm kiếm có thể truy cập qua bàn phím
+- [ ] Checkbox bảng có nhãn mô tả cho từng dòng
+- [ ] Không có cảnh báo console về thiếu thuộc tính alt trong các test
+- [ ] Điều hướng bàn phím hoạt động với tất cả các phần tử tương tác
+- [ ] Tuân thủ WCAG 2.1 Level AA được xác minh bằng các công cụ tự động