@jmruthers/pace-core 0.5.21 → 0.5.22

package/docs/api/interfaces/UsePublicEventLogoReturn.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UsePublicEventLogoReturn
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UsePublicEventLogoReturn
 
 # Interface: UsePublicEventLogoReturn
 

package/docs/api/interfaces/UsePublicEventOptions.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UsePublicEventOptions
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UsePublicEventOptions
 
 # Interface: UsePublicEventOptions
 

package/docs/api/interfaces/UsePublicEventReturn.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UsePublicEventReturn
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UsePublicEventReturn
 
 # Interface: UsePublicEventReturn
 

package/docs/api/interfaces/UsePublicRouteParamsReturn.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UsePublicRouteParamsReturn
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UsePublicRouteParamsReturn
 
 # Interface: UsePublicRouteParamsReturn
 

package/docs/api/interfaces/UserEventAccess.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UserEventAccess
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UserEventAccess
 
 # Interface: UserEventAccess
 

package/docs/api/interfaces/UserMenuProps.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UserMenuProps
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UserMenuProps
 
 # Interface: UserMenuProps
 

package/docs/api/interfaces/UserProfile.md

@@ -1,4 +1,4 @@
-[@jmruthers/pace-core - v0.5.21](../README.md) / [Exports](../modules.md) / UserProfile
+[@jmruthers/pace-core - v0.5.22](../README.md) / [Exports](../modules.md) / UserProfile
 
 # Interface: UserProfile
 

package/docs/api/modules.md

@@ -1,6 +1,6 @@
-[@jmruthers/pace-core - v0.5.21](README.md) / Exports
+[@jmruthers/pace-core - v0.5.22](README.md) / Exports
 
-# @jmruthers/pace-core - v0.5.21
+# @jmruthers/pace-core - v0.5.22
 
 **`File`**
 
@@ -5058,7 +5058,7 @@ React element with permission enforcement
 
 #### Defined in
 
-[packages/core/src/rbac/components/PagePermissionGuard.tsx:508](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/rbac/components/PagePermissionGuard.tsx#L508)
+[packages/core/src/rbac/components/PagePermissionGuard.tsx:602](https://github.com/jmruthers/pace-core/blob/main/packages/core/src/rbac/components/PagePermissionGuard.tsx#L602)
 
 ___
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jmruthers/pace-core",
-  "version": "0.5.21",
+  "version": "0.5.22",
   "description": "Clean, modern React component library with Tailwind v4 styling and native utilities",
   "private": false,
   "publishConfig": {

package/src/rbac/components/PagePermissionGuard.tsx

@@ -131,6 +131,23 @@ const PagePermissionGuardComponent = ({
   // Generate a unique instance ID for debugging
   const instanceId = useMemo(() => Math.random().toString(36).substr(2, 9), []);
   
+  // Track render count for debugging
+  const renderCountRef = useRef(0);
+  renderCountRef.current += 1;
+  
+  console.log(`[PagePermissionGuard] RENDER #${renderCountRef.current} for ${pageName}:${operation}`, {
+    instanceId,
+    timestamp: new Date().toISOString()
+  });
+  
+  // Track component lifecycle
+  useEffect(() => {
+    console.log(`[PagePermissionGuard] MOUNTED: ${pageName}:${operation}`, { instanceId });
+    return () => {
+      console.log(`[PagePermissionGuard] UNMOUNTED: ${pageName}:${operation}`, { instanceId });
+    };
+  }, [pageName, operation, instanceId]);
+  
   const { user, selectedOrganisationId, selectedEventId, supabase } = useUnifiedAuth();
   const [hasChecked, setHasChecked] = useState(false);
   const [checkError, setCheckError] = useState<Error | null>(null);
@@ -358,6 +375,18 @@ const PagePermissionGuardComponent = ({
     true // Use cache
   );
   
+  // Debug useCan results
+  console.log(`[PagePermissionGuard] useCan result for ${pageName}:${operation}`, {
+    instanceId,
+    can,
+    canIsLoading,
+    canError: !!canError,
+    userId: user?.id,
+    stableScope,
+    permission,
+    effectivePageId
+  });
+  
   // Combine loading states - we're loading if either scope is resolving OR permission check is loading
   const isLoading = !resolvedScope || canIsLoading;
   const error = checkError || canError;
@@ -432,29 +461,92 @@ const PagePermissionGuardComponent = ({
     });
   }, [isLoading, hasChecked, resolvedScope, checkError, can, shouldShowAccessDenied, shouldShowContent, permissionKey, instanceId]);
   
+  // CRITICAL DEBUG: Log every render decision with full context
+  const renderDecision = {
+    instanceId,
+    timestamp: new Date().toISOString(),
+    renderCount: renderCountRef.current,
+    // State values
+    isLoading,
+    hasValidScope,
+    hasValidUser,
+    hasChecked,
+    checkError: !!checkError,
+    can,
+    // Calculated values
+    shouldShowAccessDenied,
+    shouldShowContent,
+    // Render conditions
+    willShowLoading: isLoading || !hasValidScope || !hasValidUser || !hasChecked,
+    willShowError: checkError && !can,
+    willShowDenied: shouldShowAccessDenied,
+    willShowContent: shouldShowContent,
+    // Raw data for debugging
+    resolvedScope: resolvedScope ? {
+      organisationId: resolvedScope.organisationId,
+      eventId: resolvedScope.eventId,
+      appId: resolvedScope.appId
+    } : null,
+    user: user ? { id: user.id, email: user.email } : null
+  };
+  
+  console.log('[PagePermissionGuard] RENDER DECISION:', renderDecision);
+  
+  // CRITICAL: If we have permission but shouldShowContent is false, this is the bug!
+  if (can && !shouldShowContent) {
+    console.error('[PagePermissionGuard] CRITICAL BUG DETECTED: Has permission but shouldShowContent is false!', {
+      ...renderDecision,
+      bug: 'PERMISSION_GRANTED_BUT_CONTENT_NOT_SHOWING'
+    });
+  }
+  
+  // CRITICAL: If shouldShowContent is true but we're not rendering content, this is the bug!
+  if (shouldShowContent && !(isLoading || !hasValidScope || !hasValidUser || !hasChecked) && !(checkError && !can) && !shouldShowAccessDenied) {
+    console.log('[PagePermissionGuard] SHOULD RENDER CONTENT - This is the correct path!', {
+      ...renderDecision,
+      status: 'CONTENT_SHOULD_BE_RENDERED'
+    });
+  }
+
   // Show loading state - if we're still loading or don't have valid state
   if (isLoading || !hasValidScope || !hasValidUser || !hasChecked) {
+    console.log('[PagePermissionGuard] RENDERING: LOADING STATE');
     return <div key={`loading-${permissionKey}`}>{loading}</div>;
   }
 
   // Show error state - only if we have an error AND no permission
   if (checkError && !can) {
+    console.log('[PagePermissionGuard] RENDERING: ERROR STATE');
     return <div key={`error-${permissionKey}`}>{fallback}</div>;
   }
 
   // Show access denied - if permission check is complete and user doesn't have permission
   if (shouldShowAccessDenied) {
+    console.log('[PagePermissionGuard] RENDERING: ACCESS DENIED STATE');
     return <div key={`denied-${permissionKey}`}>{fallback}</div>;
   }
 
   // Show protected content - if permission check is complete and user has permission
   if (shouldShowContent) {
-    return <div key={`content-${permissionKey}`}>{children}</div>;
+    console.log('[PagePermissionGuard] RENDERING: CONTENT STATE - SHOWING CHILDREN');
+    console.log('[PagePermissionGuard] CONTENT RENDER SUCCESS - This should fix the Access Denied issue!');
+    
+    // Add a visual indicator in development to confirm content is rendering
+    const contentWithDebug = process.env.NODE_ENV === 'development' ? (
+      <div style={{ border: '2px solid green', padding: '4px', margin: '4px' }}>
+        <div style={{ background: 'lightgreen', padding: '2px', fontSize: '12px', marginBottom: '4px' }}>
+          ✅ PagePermissionGuard: Content Rendered Successfully
+        </div>
+        {children}
+      </div>
+    ) : children;
+    
+    return <div key={`content-${permissionKey}`}>{contentWithDebug}</div>;
   }
 
   // Fallback: This should never happen, but just in case
   // If we get here, something went wrong with our state logic
-  console.warn('[PagePermissionGuard] Unexpected state - falling back to loading', {
+  console.error('[PagePermissionGuard] CRITICAL: UNEXPECTED STATE - FALLING BACK TO LOADING', {
     instanceId,
     isLoading,
     hasValidScope,
@@ -463,7 +555,9 @@ const PagePermissionGuardComponent = ({
     checkError: !!checkError,
     can,
     shouldShowAccessDenied,
-    shouldShowContent
+    shouldShowContent,
+    resolvedScope,
+    user: user ? { id: user.id, email: user.email } : null
   });
   return <div key={`fallback-${permissionKey}`}>{loading}</div>;
 }