Fix review system: display real names and check approval status

Changes:
- ProductReviews.tsx: Use LEFT JOIN and fetch reviewer_name field
- ReviewModal.tsx: Store reviewer_name at submission time
- ProductDetail.tsx: Check is_approved=true in checkUserReview()
- Add migration for reviewer_name column and approval index

This fixes two issues:
1. Reviews now show real account names instead of "Anonymous"
2. Members no longer see "menunggu moderasi" after approval

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

src/components/reviews/ProductReviews.tsx

@@ -9,6 +9,7 @@ interface Review {
   title: string;
   body: string;
   created_at: string;
+  reviewer_name: string | null;
   profiles: { name: string | null } | null;
 }
 
@@ -29,7 +30,7 @@ export function ProductReviews({ productId, type }: ProductReviewsProps) {
   const fetchReviews = async () => {
     let query = supabase
       .from('reviews')
-      .select('id, rating, title, body, created_at, profiles:user_id (name)')
+      .select('id, rating, title, body, created_at, reviewer_name, profiles!user_id (name)')
       .eq('is_approved', true);
 
     if (productId) {
@@ -74,7 +75,7 @@ export function ProductReviews({ productId, type }: ProductReviewsProps) {
             rating={review.rating}
             title={review.title}
             body={review.body}
-            authorName={review.profiles?.name || 'Anonymous'}
+            authorName={review.reviewer_name || review.profiles?.name || 'Anonymous'}
             date={review.created_at}
           />
         ))}