auth system consolidation
This commit is contained in:
		
							parent
							
								
									209f173d7a
								
							
						
					
					
						commit
						1f33ad1b16
					
				@ -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;
 | 
			
		||||
@ -69,33 +69,4 @@ const iconSize = variant === 'small' ? '14' : '16';
 | 
			
		||||
    <Fragment set:html={icon} />
 | 
			
		||||
  </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>
 | 
			
		||||
</a>
 | 
			
		||||
@ -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>
 | 
			
		||||
@ -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;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
    
 | 
			
		||||
    // FIXED: AI Query Button Handler using global client-side auth function
 | 
			
		||||
    // OPTIMIZED: AI Query Button Handler using consolidated auth system
 | 
			
		||||
    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');
 | 
			
		||||
          // Fallback - try switching anyway
 | 
			
		||||
          // Better fallback logging
 | 
			
		||||
          console.warn('[AUTH] requireClientAuth not available - client-auth.js may not be loaded properly');
 | 
			
		||||
          switchToView('ai');
 | 
			
		||||
        }
 | 
			
		||||
      });
 | 
			
		||||
 | 
			
		||||
@ -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]');
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user