Tôi thấy trang admin review queue đang hiển thị "Báo cáo không tên" cho tất cả các báo cáo, thiếu thông tin user và thời gian. Để tôi tìm và cải thiện component này:

Tôi đã thấy vấn đề. Component ReportCard đang hiển thị report.file_name thay vì product_name từ AI, và thiếu thông tin user. Cần kiểm tra API lấy reports để xem có join với user không:

Giờ tôi hiểu rõ vấn đề:

1. Query không lấy product_name và brand_name (các field này có thể là cột riêng hoặc nằm trong JSON)
2. Không join với bảng auth.users hoặc profiles để lấy thông tin user
3. ReportCard chỉ hiển thị file_name thay vì product_name

Để tôi kiểm tra schema audit_reports:

Checked audit_reports schema

Tốt! product_name và brand_name là columns riêng trong audit_reports. Giờ tôi sẽ:

1. Cập nhật query trong admin/page.tsx để join với user profiles
2. Cập nhật ReportCard để hiển thị product_name, user email, và thời gian chi tiết hơn

Bây giờ cập nhật ReportCard component trong admin-dashboard.tsx:

Cần thêm import Clock vào lucide-react (nếu chưa có):

Tốt! Clock đã được import sẵn ở dòng 9. Giờ cần kiểm tra xem có bảng profiles không, nếu không có thì cần query trực tiếp từ auth.users:

Không có bảng profiles. Cần thay đổi cách tiếp cận - tạo một API để lấy user info hoặc sử dụng admin API. Để đơn giản, tôi sẽ tạo một lookup trong server component:

Vì không có bảng profiles, tôi sẽ sử dụng service role client để lấy user email từ auth.users. Cần cập nhật lại query:

Giờ cập nhật ReportCard để sử dụng user_email thay vì profiles:

Hoàn thành! Tôi đã cập nhật trang admin review queue với các cải thiện:

1. Tên sản phẩm: Hiển thị product_name (AI extracted) thay vì "Báo cáo không tên", fallback theo thứ tự: product_name > brand_name > file_name
2. Thông tin user: Fetch email từ auth.users qua service role client và hiển thị kèm icon User
3. Thời gian chi tiết: Hiển thị đầy đủ ngày/tháng/năm + giờ:phút, kèm badge "> 24h" nếu report chờ quá lâu (highlight viền amber cho urgent)
4. Risk score badge: Hiển thị màu theo mức độ (đỏ >= 7, amber >= 4, xanh < 4)

Để tôi kiểm tra xem code có đang được sử dụng đúng không và debug vấn đề:

Checked audit_reports data

Code đã được cập nhật đúng. Vấn đề có thể là:

1. Các reports cũ trong database chưa có product_name (đang là NULL)
2. Fallback text khác nhau: Code mới dùng "Sản phẩm không tên" nhưng UI hiện đang show "Báo cáo không tên"

Tôi thấy trong screenshot vẫn hiển thị "Báo cáo không tên" - đây là text cũ. Có thể có 2 issues:

1. Component chưa được refresh/build lại
2. Hoặc có component khác đang render

Để tôi kiểm tra xem có component nào khác đang dùng "Báo cáo không tên":

Không có text "Báo cáo không tên" trong code. Có vẻ như:

1. Code mới đã được deploy nhưng browser cache cũ
2. Hoặc database thực sự không có product_name

Vấn đề chính có khả năng là database không có data trong cột product_name. Để tôi kiểm tra xem cột này có trong SQL schema không và xem các reports cũ có được populate không:

Tốt, cột product_name và brand_name đã có trong schema. Vấn đề là các reports cũ có thể không có giá trị trong các cột này.

Để giải quyết, tôi sẽ thêm fallback đọc từ JSON findings hoặc từ cột khác nếu product_name là null. Đồng thời cần kiểm tra xem khi analyze thì có save product_name không:

product_name đang được save từ visionResult.textElements?.productName?.text. Vấn đề có thể là:

1. Các reports cũ chưa có AI extract product name
2. Hoặc vision extraction không trả về productName

Để fix ngay, tôi sẽ cập nhật fallback trong ReportCard để cố gắng parse từ file_name hoặc hiển thị tốt hơn:

Giờ thêm hiển thị tốt hơn cho card - nếu có brand_name riêng thì show cả hai:

Cần đóng div đúng cách:

Code đã đúng cấu trúc. Tuy nhiên vấn đề chính là screenshot vẫn hiển thị "Báo cáo không tên" - có thể là do các báo cáo trong database thực sự không có product_name.

Để chắc chắn, tôi sẽ tạo một script SQL để update các reports cũ, lấy product_name từ field khác nếu có: