From eeee1c1f6b0f57e91495af146881087ccfc77049 Mon Sep 17 00:00:00 2001
From: Randall Stillwell <me@randallstillwell.com>
Date: Sun, 27 Jul 2025 21:30:32 -0500
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Fix=20'All=20My=20Cards'=20Colle?=
 =?UTF-8?q?ction=20Access=20Issue?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🐛 Root Cause:
- Collection detail page was not sending auth token in API requests
- This caused the API to fallback to admin user authentication
- Bob's 'All My Cards' collection was inaccessible to admin user

✅ Solution:
- Added Authorization header to fetchCollectionData() function
- Added Authorization header to collection cards fetch request
- Both requests now properly authenticate as the logged-in user

🔍 Debug Results:
- Token verification was working correctly for other API calls
- Only the main collection fetch was missing authentication
- This explains the 404 error for system collections

The 'All My Cards' collection should now be accessible! 🚀
---
 lib/permission-middleware.js     |  3 ---
 pages/collection/[identifier].js | 12 ++++++++++--
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/lib/permission-middleware.js b/lib/permission-middleware.js
index 423c6e3..53e1cad 100644
--- a/lib/permission-middleware.js
+++ b/lib/permission-middleware.js
@@ -13,14 +13,11 @@ export async function getUserFromRequest(req) {
     if (!authHeader || !authHeader.startsWith('Bearer ')) {
       // For development, return user ID 1 if no token (should be removed in production)
       console.warn('⚠️  Development mode: Using fallback user authentication');
-      console.warn('⚠️  No auth header found:', authHeader);
       return { userId: 1, email: 'admin@tcgvault.com', role: 'admin' };
     }
 
     const token = authHeader.substring(7);
-    console.log('🔍 Attempting to verify token:', token.substring(0, 20) + '...');
     const decoded = jwt.verify(token, JWT_SECRET);
-    console.log('✅ Token decoded successfully:', decoded);
     
     // Get user data from database
     const result = await sql`
diff --git a/pages/collection/[identifier].js b/pages/collection/[identifier].js
index e088526..af2f39d 100644
--- a/pages/collection/[identifier].js
+++ b/pages/collection/[identifier].js
@@ -64,7 +64,11 @@ export default function CollectionView() {
 
   const fetchCollectionData = async () => {
     try {
-      const response = await fetch(`/api/collections/${identifier}`);
+      const response = await fetch(`/api/collections/${identifier}`, {
+        headers: {
+          'Authorization': `Bearer ${localStorage.getItem('auth_token')}`
+        }
+      });
       if (response.ok) {
         const data = await response.json();
         
@@ -85,7 +89,11 @@ export default function CollectionView() {
         });
         
         // Fetch collection cards
-        const cardsResponse = await fetch(`/api/collections/${identifier}/cards`);
+        const cardsResponse = await fetch(`/api/collections/${identifier}/cards`, {
+          headers: {
+            'Authorization': `Bearer ${localStorage.getItem('auth_token')}`
+          }
+        });
         if (cardsResponse.ok) {
           const cardsData = await cardsResponse.json();
           setCards(cardsData.cards || []);