Fix: App not rendering any pages

The app was not rendering any pages.

src/App.tsx

@@ -1,5 +1,5 @@
 import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
-import { Suspense, lazy, useEffect } from 'react';
+import { Suspense, lazy } from 'react';
 import { Toaster } from "@/components/ui/sonner";
 import Auth from './pages/Auth';
 import ProtectedRoute from './components/auth/ProtectedRoute';
@@ -19,14 +19,7 @@ const Configuracoes = lazy(() => import('./pages/Configuracoes'));
 
 function App() {
   const isLoggedIn = authStore((state) => state.isLoggedIn);
-  const setLoggedIn = authStore((state) => state.setLoggedIn);
   
-  // Initialize authStore state once at mount time
-  useEffect(() => {
-    const storedAuth = localStorage.getItem('autenticado') === 'true';
-    setLoggedIn(storedAuth);
-  }, [setLoggedIn]);
-
   return (
     <Router>
       <Toaster />

src/components/auth/ProtectedRoute.tsx

@@ -11,20 +11,18 @@ interface ProtectedRouteProps {
 }
 
 const ProtectedRoute = ({ children }: ProtectedRouteProps) => {
+  // We use local state here to avoid re-renders of the whole app
   const [session, setSession] = useState<Session | null>(null);
   const [isLoading, setIsLoading] = useState(true);
   const location = useLocation();
+
+  // We still update the global store for other components to use
   const setLoggedIn = authStore((state) => state.setLoggedIn);
   const setUser = authStore((state) => state.setUser);
   
   useEffect(() => {
-    // Checa a sessão ao carregar o componente
-    supabase.auth.getSession().then(({ data: { session } }) => {
-      setSession(session);
-      setIsLoading(false);
-    });
-    
-    // Escuta por mudanças no estado de autenticação (login/logout)
+    // onAuthStateChange fires once on initial load with the current session,
+    // and then every time the auth state changes.
     const { data: { subscription } } = supabase.auth.onAuthStateChange(
       (_event, session) => {
         setSession(session);
@@ -48,11 +46,11 @@ const ProtectedRoute = ({ children }: ProtectedRouteProps) => {
   }
   
   if (!session) {
-    // Redireciona para a página de login se não houver sessão
+    // Redirect to the login page if there is no session
     return <Navigate to="/auth" state={{ from: location }} replace />;
   }
   
-  // Renderiza o conteúdo protegido se houver sessão
+  // Render the protected content if a session exists
   return <>{children}</>;
 };
 

src/components/layout/Header.tsx

@@ -1,4 +1,3 @@
-
 import { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { Button } from "@/components/ui/button";
@@ -20,15 +19,6 @@ const Header = () => {
   const [userName, setUserName] = useState('Usuário');
 
   useEffect(() => {
-    const fetchUser = async () => {
-      const { data: { user } } = await supabase.auth.getUser();
-      if (user) {
-        setUserName(user.email || 'Usuário');
-      }
-    };
-    
-    fetchUser();
-    
     const { data: { subscription } } = supabase.auth.onAuthStateChange((_event, session) => {
       setUserName(session?.user?.email || 'Usuário');
     });

src/stores/authStore.ts

@@ -8,27 +8,9 @@ interface AuthState {
   setUser: (user: { id: string } | null) => void;
 }
 
-// Função para recuperar o userId inicial (se existir)
-const getInitialUser = (): { id: string } | null => {
-  try {
-    const id = localStorage.getItem('userId');
-    return id ? { id } : null;
-  } catch (e) {
-    return null;
-  }
-};
-
-const getInitialState = (): boolean => {
-  try {
-    return localStorage.getItem('autenticado') === 'true';
-  } catch (e) {
-    return false;
-  }
-};
-
 export const authStore = create<AuthState>((set) => ({
-  isLoggedIn: getInitialState(),
-  user: getInitialUser(),
+  isLoggedIn: false,
+  user: null,
   setLoggedIn: (status) => set({ isLoggedIn: status }),
   setUser: (user) => set({ user }),
 }));