From 7090adbb281e240644728c403ecb27d7ad075655 Mon Sep 17 00:00:00 2001
From: Randall Stillwell <me@randallstillwell.com>
Date: Fri, 25 Jul 2025 23:11:27 -0500
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=8D=20Added=20Debug=20Logging=20for=20?=
 =?UTF-8?q?TCG=20Tags=20and=20CollaboratorFacepile?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Made gameStats calculation dynamic to show all games present
- Added console logging to debug missing TCG tags
- Added debug logging to CollaboratorFacepile component
- Added fallback display for missing creator email
- This will help identify why the facepile and tags aren't showing
---
 components/CollaboratorFacepile.js |  8 ++++++++
 pages/collection/[id].js           | 32 ++++++++++++++++++++----------
 2 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/components/CollaboratorFacepile.js b/components/CollaboratorFacepile.js
index a89fb75..9291f3a 100644
--- a/components/CollaboratorFacepile.js
+++ b/components/CollaboratorFacepile.js
@@ -73,6 +73,14 @@ export default function CollaboratorFacepile({ collectionId, creatorEmail }) {
     }
   };
 
+  console.log('CollaboratorFacepile render:', { 
+    collectionId, 
+    creatorEmail, 
+    collaborators: collaborators.length, 
+    allUsers: allUsers.length,
+    loading 
+  });
+
   return (
     <div className="flex items-center space-x-2">
       <span className="text-sm" style={{ color: 'var(--text-secondary)' }}>
diff --git a/pages/collection/[id].js b/pages/collection/[id].js
index 082d164..8b1a3e7 100644
--- a/pages/collection/[id].js
+++ b/pages/collection/[id].js
@@ -299,12 +299,17 @@ export default function CollectionView() {
     return acc;
   }, {});
 
-  // Get game display names and counts
-  const gameStats = {
-    'MTG': groupedCards['MTG']?.length || 0,
-    'Lorcana': groupedCards['Lorcana']?.length || 0,
-    'Pokemon': groupedCards['Pokemon']?.length || 0
-  };
+  // Debug: Log the grouped cards to see what games we have
+  console.log('Grouped cards:', groupedCards);
+  console.log('Available games:', Object.keys(groupedCards));
+
+  // Get game display names and counts - make it more flexible
+  const gameStats = {};
+  Object.keys(groupedCards).forEach(game => {
+    if (game && game !== 'Other') {
+      gameStats[game] = groupedCards[game].length;
+    }
+  });
 
   if (loading) {
     return (
@@ -393,10 +398,17 @@ export default function CollectionView() {
             
             {/* Creator and Stats */}
             <div className="flex items-center space-x-6 text-sm" style={{ color: 'var(--text-secondary)' }}>
-              <CollaboratorFacepile 
-                collectionId={id} 
-                creatorEmail={collection.creator_email} 
-              />
+              {console.log('Collection data for facepile:', { id, creator_email: collection.creator_email, collection })}
+              {collection.creator_email ? (
+                <CollaboratorFacepile 
+                  collectionId={id} 
+                  creatorEmail={collection.creator_email} 
+                />
+              ) : (
+                <span className="text-sm" style={{ color: 'var(--text-secondary)' }}>
+                  Crafted by Unknown User
+                </span>
+              )}
               <div>Cards: <span className="font-medium">{cards.length}</span></div>
               <div>Cost: <span className="font-medium">${collection.totalValue || '0'}</span></div>
             </div>