auth system consolidation

src/components/ContributionButton.astro

@@ -1,5 +1,5 @@
 ---
-// src/components/ContributionButton.astro
+// src/components/ContributionButton.astro - CLEANED: Removed duplicate auth script
 export interface Props {
   type: 'edit' | 'new' | 'write';
   toolName?: string;
@@ -70,32 +70,3 @@ const iconSize = variant === 'small' ? '14' : '16';
   </svg>
   {displayText}
 </a>
-
-<script>
-  // Check authentication status and redirect if needed
-  document.addEventListener('DOMContentLoaded', () => {
-    const contributeButtons = document.querySelectorAll('[data-contribute-button]');
-    
-    contributeButtons.forEach(button => {
-      button.addEventListener('click', async (e) => {
-        e.preventDefault();
-        
-        try {
-          const response = await fetch('/api/auth/status');
-          const data = await response.json();
-          
-          if (data.authRequired && !data.authenticated) {
-            const returnUrl = (button as HTMLAnchorElement).href;
-            window.location.href = `/api/auth/login?returnTo=${encodeURIComponent(returnUrl)}`;
-          } else {
-            window.location.href = (button as HTMLAnchorElement).href;
-          }
-        } catch (error) {
-          console.error('Auth check failed:', error);
-          // Fallback - proceed anyway
-          window.location.href = (button as HTMLAnchorElement).href;
-        }
-      });
-    });
-  });
-</script>

src/components/ToolMatrix.astro

@@ -852,32 +852,5 @@ domains.forEach((domain: any) => {
       }
     }
   });
-  document.addEventListener('DOMContentLoaded', () => {
-  // Auth check for contribution buttons (similar to existing auth checking pattern)
-  function setupContributionButtonAuth() {
-    document.addEventListener('click', async (e) => {
-      const contributeButton = e.target.closest('[data-contribute-button]');
-      if (!contributeButton) return;
-      
-      e.preventDefault();
-      
-      try {
-        const response = await fetch('/api/auth/status');
-        const data = await response.json();
-        
-        if (data.authRequired && !data.authenticated) {
-          const returnUrl = contributeButton.href;
-          window.location.href = `/api/auth/login?returnTo=${encodeURIComponent(returnUrl)}`;
-        } else {
-          window.location.href = contributeButton.href;
-        }
-      } catch (error) {
-        console.error('Auth check failed:', error);
-        window.location.href = contributeButton.href;
-      }
-    });
-  }
-  
   setupContributionButtonAuth();
-  });
 </script>

src/pages/index.astro

@@ -53,7 +53,7 @@ const tools = data.tools;
       </button>
       
       <!-- Contribution Button - FIXED: Use data-contribute-button -->
-      <a href="/contribute" class="btn" style="padding: 0.75rem 1.5rem; background-color: var(--color-warning); color: white; border-color: var(--color-warning);" data-contribute-button>
+      <a href="/contribute" class="btn" style="padding: 0.75rem 1.5rem; background-color: var(--color-warning); color: white; border-color: var(--color-warning);" data-contribute-button="new">
         <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="margin-right: 0.5rem;">
           <path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>
           <circle cx="8.5" cy="7" r="4"/>
@@ -143,16 +143,15 @@ const tools = data.tools;
           return sorted;
       }
     }
-    
+    // OPTIMIZED: AI Query Button Handler using consolidated auth system
-    // FIXED: AI Query Button Handler using global client-side auth function
     if (aiQueryBtn) {
       aiQueryBtn.addEventListener('click', async () => {
-        // Wait for client-side auth functions to be available
+        // Use the global auth system consistently
         if (typeof window.requireClientAuth === 'function') {
           await window.requireClientAuth(() => switchToView('ai'), `${window.location.pathname}?view=ai`);
         } else {
-          console.error('requireClientAuth not available - client-auth.js may not be loaded');
+          // Better fallback logging
-          // Fallback - try switching anyway
+          console.warn('[AUTH] requireClientAuth not available - client-auth.js may not be loaded properly');
           switchToView('ai');
         }
       });

src/scripts/client-auth.js

@@ -53,23 +53,25 @@ async function showIfAuthenticated(selector) {
       : 'none';
   }
 }
-
-/**
- * Handle contribute button clicks with auth check
- */
 function setupAuthButtons(selector = '[data-contribute-button]') {
+  // Use event delegation on document for dynamic content support
   document.addEventListener('click', async (e) => {
     const button = e.target.closest(selector);
     if (!button) return;
     
     e.preventDefault();
+    
+    // Enhanced error handling and debugging
+    console.log('[AUTH] Contribute button clicked:', button.getAttribute('data-contribute-button'));
+    
     await requireClientAuth(() => {
+      console.log('[AUTH] Navigation approved, redirecting to:', button.href);
       window.location.href = button.href;
     }, button.href);
   });
 }
 
-// Make functions available globally
+// Make functions available globally for dynamic content
 window.checkClientAuth = checkClientAuth;
 window.requireClientAuth = requireClientAuth;
 window.showIfAuthenticated = showIfAuthenticated;
@@ -77,6 +79,7 @@ window.setupAuthButtons = setupAuthButtons;
 
 // Auto-setup contribute buttons when DOM is ready
 document.addEventListener('DOMContentLoaded', () => {
+  console.log('[AUTH] Setting up global auth handlers for contribute buttons');
   setupAuthButtons('[data-contribute-button]');
 });