riseup-squad18/src/App.tsx

import {
  BrowserRouter as Router,
  Routes,
  Route,
  Navigate,
  useLocation,
} from "react-router-dom";
import { Toaster } from "react-hot-toast";
import Header from "./components/Header";
import AccessibilityMenu from "./components/AccessibilityMenu";
import { CommandPalette } from "./components/ui/CommandPalette";
import { InstallPWA } from "./components/pwa/InstallPWA";
import { useCommandPalette } from "./hooks/useCommandPalette";
import ProtectedRoute from "./components/auth/ProtectedRoute";
import Home from "./pages/Home";
import Login from "./pages/Login";
import LoginPaciente from "./pages/LoginPaciente";
import LoginSecretaria from "./pages/LoginSecretaria";
import LoginMedico from "./pages/LoginMedico";
import AgendamentoPaciente from "./pages/AgendamentoPaciente";
import AcompanhamentoPaciente from "./pages/AcompanhamentoPaciente";
import PainelMedico from "./pages/PainelMedico";
import PainelSecretaria from "./pages/PainelSecretaria";
import MensagensMedico from "./pages/MensagensMedico";
import ProntuarioPaciente from "./pages/ProntuarioPaciente";
import TokenInspector from "./pages/TokenInspector";
import AdminDiagnostico from "./pages/AdminDiagnostico";
// import TesteCadastroSquad18 from "./pages/TesteCadastroSquad18"; // Arquivo removido
import PainelAdmin from "./pages/PainelAdmin";
import CentralAjudaRouter from "./pages/CentralAjudaRouter";
import PerfilMedico from "./pages/PerfilMedico";
import PerfilPaciente from "./pages/PerfilPaciente";
import ClearCache from "./pages/ClearCache";
import AuthCallback from "./pages/AuthCallback";
import ResetPassword from "./pages/ResetPassword";
import LandingPage from "./pages/LandingPage";

function AppLayout() {
  const location = useLocation();
  const isLandingPage = location.pathname === "/";

  return (
    <div className="app-root min-h-screen bg-gray-50 dark:bg-slate-900 dark:bg-gradient-to-br dark:from-slate-900 dark:to-slate-800 transition-colors duration-300">
      <a
        href="#main-content"
        className="fixed -top-20 left-4 z-50 px-3 py-2 bg-blue-600 text-white rounded shadow transition-all focus:top-4 focus:outline-none focus-visual:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue-500"
      >
        Pular para o conteúdo
      </a>
      {!isLandingPage && <Header />}
      <main
        id="main-content"
        className={isLandingPage ? "" : "container mx-auto px-4 py-6 max-w-7xl"}
      >
        <Routes>
          <Route path="/" element={<LandingPage />} />
          <Route path="/home" element={<Home />} />
          <Route path="/clear-cache" element={<ClearCache />} />
          <Route path="/auth/callback" element={<AuthCallback />} />
          <Route path="/reset-password" element={<ResetPassword />} />
          <Route path="/login" element={<Login />} />
          <Route path="/paciente" element={<LoginPaciente />} />
          <Route path="/login-secretaria" element={<LoginSecretaria />} />
          <Route path="/login-medico" element={<LoginMedico />} />
          <Route path="/dev/token" element={<TokenInspector />} />
          <Route path="/admin/diagnostico" element={<AdminDiagnostico />} />
          {/* <Route path="/teste-squad18" element={<TesteCadastroSquad18 />} /> */}
          <Route path="/ajuda" element={<CentralAjudaRouter />} />
          <Route element={<ProtectedRoute roles={["admin", "gestor"]} />}>
            <Route path="/admin" element={<PainelAdmin />} />
          </Route>
          <Route
            element={
              <ProtectedRoute
                roles={["medico", "gestor", "secretaria", "admin"]}
              />
            }
          >
            <Route path="/painel-medico" element={<PainelMedico />} />
            <Route path="/mensagens" element={<MensagensMedico />} />
            <Route path="/perfil-medico" element={<PerfilMedico />} />
          </Route>
          <Route
            element={
              <ProtectedRoute roles={["secretaria", "gestor", "admin"]} />
            }
          >
            <Route path="/painel-secretaria" element={<PainelSecretaria />} />
            <Route path="/pacientes/:id" element={<ProntuarioPaciente />} />
          </Route>
          <Route
            element={
              <ProtectedRoute roles={["paciente", "user", "admin", "gestor"]} />
            }
          >
            <Route
              path="/acompanhamento"
              element={<AcompanhamentoPaciente />}
            />
            <Route path="/agendamento" element={<AgendamentoPaciente />} />
            <Route path="/perfil-paciente" element={<PerfilPaciente />} />
          </Route>
          <Route path="*" element={<Navigate to="/" replace />} />
        </Routes>
      </main>
      <Toaster position="top-right" />
      <AccessibilityMenu />
    </div>
  );
}

function App() {
  const { isOpen, close } = useCommandPalette();

  return (
    <Router
      future={{
        v7_startTransition: true,
        v7_relativeSplatPath: true,
      }}
    >
      <AppLayout />

      {/* Command Palette Global (Ctrl+K) */}
      {isOpen && <CommandPalette onClose={close} />}

      {/* PWA Install Prompt */}
      <InstallPWA />
    </Router>
  );
}

export default App;