main: add many things to app :)

Signed-off-by: nfel <nfilsaraee@gmail.com>

app/album/[id]/page.tsx

@@ -32,25 +32,42 @@ export default function AlbumDetailPage() {
     const foundAlbum = albums.find((a) => a.id === params.id);
     setAlbum(foundAlbum || null);
 
-    // Load purchases
+    // Load purchases from localStorage (legacy)
     const savedPurchases = localStorage.getItem('purchases');
     if (savedPurchases) {
       const parsedPurchases = JSON.parse(savedPurchases);
       setPurchases(parsedPurchases);
-      setPurchasedAlbums(parsedPurchases.map((p: Purchase) => p.albumId));
     }
-  }, [params.id]);
+
+    // Fetch approved purchases from API
+    const fetchPurchases = async () => {
+      try {
+        const response = await fetch('/api/purchases');
+        if (response.ok) {
+          const apiPurchases = await response.json();
+          // Only include approved purchases for determining access
+          const approvedPurchases = apiPurchases.filter((p: Purchase) => p.approvalStatus === 'approved');
+          setPurchasedAlbums(approvedPurchases.map((p: Purchase) => p.albumId));
+        }
+      } catch (error) {
+        console.error('Error fetching purchases:', error);
+      }
+    };
+
+    fetchPurchases();
+  }, [params.id, albums]);
 
   const handlePurchaseSuccess = (albumId: string, transactionId: string) => {
     const purchase: Purchase = {
       albumId,
       transactionId,
       purchaseDate: new Date(),
+      approvalStatus: 'pending',
     };
 
     const updatedPurchases = [...purchases, purchase];
     setPurchases(updatedPurchases);
-    setPurchasedAlbums([...purchasedAlbums, albumId]);
+    // Don't add to purchasedAlbums yet - wait for approval
     setLatestPurchase(purchase);
 
     localStorage.setItem('purchases', JSON.stringify(updatedPurchases));