import { useEffect } from 'react';
import { useAuth } from './useAuth';
import { useUserRole } from './useUserRole';

/**
 * Preloads admin route chunks for authenticated moderators/admins
 * This reduces chunk load failures by warming up the browser cache
 */
export function useAdminRoutePreload() {
  const { user } = useAuth();
  const { isModerator, isAdmin } = useUserRole();

  useEffect(() => {
    // Only preload if user has admin access
    if (!user || (!isModerator && !isAdmin)) {
      return;
    }

    // Preload admin chunks after a short delay to avoid blocking initial page load
    const preloadTimer = setTimeout(() => {
      // Preload critical admin routes
      const adminRoutes = [
        () => import('../pages/AdminDashboard'),
        () => import('../pages/AdminModeration'),
        () => import('../pages/AdminReports'),
      ];

      // Start preloading (but don't await - let it happen in background)
      adminRoutes.forEach(route => {
        route().catch(err => {
          // Silently fail - preloading is a performance optimization
          console.debug('Admin route preload failed:', err);
        });
      });
    }, 2000); // Wait 2 seconds after auth to avoid blocking initial render

    return () => clearTimeout(preloadTimer);
  }, [user, isModerator, isAdmin]);
}