feat: comprehensive dashboard refactor and performance stabilization

src/App.tsx

@@ -0,0 +1,209 @@
+import React, { useState, useEffect } from "react";
+import {
+  HashRouter as Router,
+  Routes,
+  Route,
+  Navigate,
+  useLocation,
+} from "react-router-dom";
+import { Layout } from "./components/Layout";
+import { Dashboard } from "./pages/Dashboard";
+import { UserDetail } from "./pages/UserDetail";
+import { AttendanceDetail } from "./pages/AttendanceDetail";
+import { SuperAdmin } from "./pages/SuperAdmin";
+import { ApiKeys } from "./pages/ApiKeys";
+import { TeamManagement } from "./pages/TeamManagement";
+import { Teams } from "./pages/Teams";
+import { Funnels } from "./pages/Funnels";
+import { Origins } from "./pages/Origins";
+import { Login } from "./pages/Login";
+import { ForgotPassword } from "./pages/ForgotPassword";
+import { ResetPassword } from "./pages/ResetPassword";
+import { SetupAccount } from "./pages/SetupAccount";
+import { UserProfile } from "./pages/UserProfile";
+import { Ranking } from "./pages/Ranking";
+import { getUserById, logout } from "./services/dataService";
+import { User } from "./types";
+
+const AuthGuard: React.FC<{ children: React.ReactNode; roles?: string[] }> = ({
+  children,
+  roles,
+}) => {
+  const [user, setUser] = useState<User | null>(null);
+  const [loading, setLoading] = useState(true);
+  const location = useLocation();
+
+  useEffect(() => {
+    const checkAuth = async () => {
+      const storedUserId = localStorage.getItem("ctms_user_id");
+      const storedToken = localStorage.getItem("ctms_token");
+
+      if (
+        !storedUserId ||
+        !storedToken ||
+        storedToken === "undefined" ||
+        storedToken === "null"
+      ) {
+        if (storedToken) logout(); // Limpar se for "undefined" string
+        setLoading(false);
+        return;
+      }
+
+      try {
+        const fetchedUser = await getUserById(storedUserId);
+        if (fetchedUser) {
+          if (fetchedUser.status === "active") {
+            setUser(fetchedUser);
+          } else {
+            // User explicitly marked inactive or deleted
+            logout();
+            setUser(null);
+          }
+        } else {
+          // If fetchedUser is undefined but didn't throw, it usually means a 401/403/404 (invalid token or user missing).
+          // However, to be safe against random failures, we should only clear if we are sure it's invalid.
+          // For now, if the token is completely rejected, we log out.
+          logout();
+          setUser(null);
+        }
+      } catch (err) {
+        console.error("Auth check failed (network/server error):", err);
+        // DO NOT logout() here. If the server is offline or restarting,
+        // we shouldn't wipe the user's local storage tokens.
+        // We just leave the user as null, which will redirect them to login,
+        // but their tokens remain so they can auto-login when the server is back.
+        setUser(null);
+      } finally {
+        setLoading(false);
+      }
+    };
+    checkAuth();
+  }, [location.pathname]);
+
+  if (loading) {
+    return (
+      <div className="flex h-screen items-center justify-center bg-zinc-50 dark:bg-zinc-950 text-zinc-400">
+        Carregando...
+      </div>
+    );
+  }
+
+  if (!user) {
+    return <Navigate to="/login" replace />;
+  }
+
+  if (roles && !roles.includes(user.role)) {
+    return <Navigate to="/" replace />;
+  }
+
+  // Auto-redirect Super Admins away from the standard dashboard to their specific panel
+  if (location.pathname === "/" && user.role === "super_admin") {
+    return <Navigate to="/super-admin" replace />;
+  }
+
+  return <Layout>{children}</Layout>;
+};
+
+const App: React.FC = () => {
+  return (
+    <Router>
+      <Routes>
+        <Route path="/login" element={<Login />} />
+        <Route path="/forgot-password" element={<ForgotPassword />} />
+        <Route path="/reset-password" element={<ResetPassword />} />
+        <Route path="/setup-account" element={<SetupAccount />} />
+        <Route
+          path="/"
+          element={
+            <AuthGuard>
+              <Dashboard />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/admin/users"
+          element={
+            <AuthGuard roles={["super_admin", "admin", "manager"]}>
+              <TeamManagement />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/ranking"
+          element={
+            <AuthGuard roles={["super_admin", "admin", "manager"]}>
+              <Ranking />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/admin/teams"
+          element={
+            <AuthGuard roles={["super_admin", "admin", "manager"]}>
+              <Teams />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/admin/funnels"
+          element={
+            <AuthGuard roles={["super_admin", "admin"]}>
+              <Funnels />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/admin/origins"
+          element={
+            <AuthGuard roles={["super_admin", "admin"]}>
+              <Origins />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/users/:id"
+          element={
+            <AuthGuard>
+              <UserDetail />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/attendances/:id"
+          element={
+            <AuthGuard>
+              <AttendanceDetail />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/super-admin"
+          element={
+            <AuthGuard roles={["super_admin"]}>
+              <SuperAdmin />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/super-admin/api-keys"
+          element={
+            <AuthGuard roles={["super_admin"]}>
+              <ApiKeys />
+            </AuthGuard>
+          }
+        />
+        <Route
+          path="/profile"
+          element={
+            <AuthGuard>
+              <UserProfile />
+            </AuthGuard>
+          }
+        />
+        <Route path="*" element={<Navigate to="/" replace />} />
+      </Routes>
+    </Router>
+  );
+};
+
+export default App;