Phase 0: Fix AppLayout to only load sites when authenticated

- Added isAuthenticated check before loading active site
- Prevents 403 errors when user is not logged in
- Only loads sites when user is authenticated
- Silently handles 403 errors (expected when not authenticated)

frontend/src/layout/AppLayout.tsx

@@ -24,8 +24,11 @@ const LayoutContent: React.FC = () => {
   const [debugEnabled, setDebugEnabled] = useState(false);
   const lastUserRefresh = useRef<number>(0);
 
-  // Initialize site store on mount - only once
+  // Initialize site store on mount - only once, but only if authenticated
   useEffect(() => {
+    // Only load sites if user is authenticated
+    if (!isAuthenticated) return;
+    
     if (!hasLoadedSite.current && !isLoadingSite.current) {
       hasLoadedSite.current = true;
       isLoadingSite.current = true;
@@ -44,8 +47,11 @@ const LayoutContent: React.FC = () => {
       
       loadActiveSite()
         .catch((error) => {
-          console.error('AppLayout: Error loading active site:', error);
+          // Don't log 403 errors as they're expected when not authenticated
-          addError(error, 'AppLayout.loadActiveSite');
+          if (error.status !== 403) {
+            console.error('AppLayout: Error loading active site:', error);
+            addError(error, 'AppLayout.loadActiveSite');
+          }
         })
         .finally(() => {
           clearTimeout(timeoutId);
@@ -53,7 +59,7 @@ const LayoutContent: React.FC = () => {
           isLoadingSite.current = false;
         });
     }
-  }, []); // Empty deps - only run once on mount
+  }, [isAuthenticated]); // Run when authentication state changes
 
   // Load sectors when active site changes (by ID, not object reference)
   useEffect(() => {