import { Routes, Route } from "react-router-dom";
import { globalStyle } from "./theme";
import { MainLayout } from "./layouts/MainLayout";
import { ProtectedRoute } from "./pages/LoginPage";
import { DashboardPage } from "./pages/DashboardPage";
import { DomainsPage } from "./pages/DomainsPage";
import { MonitoringPage } from "./pages/MonitoringPage";
import { SuperAdminsPage } from "./pages/SuperAdminsPage";
import { TenantsPage } from "./pages/TenantsPage";
import { UsersPage } from "./pages/UsersPage";
import { LicensePage } from "./pages/LicensePage";
import { FetchLogsPage } from "./pages/FetchLogsPage";
import { LoginPage } from "./pages/LoginPage";

function GlobalStyle() { return <style>{globalStyle}</style>; }

function App() {
  return (
    <>
      <GlobalStyle />
      <Routes>
        <Route path="/login" element={<LoginPage />} />
        <Route element={<ProtectedRoute />}>
          <Route element={<MainLayout />}>
            <Route path="/" element={<DashboardPage />} />
            <Route path="/domains" element={<DomainsPage />} />
            <Route path="/monitoring" element={<MonitoringPage />} />
            <Route path="/super-admins" element={<SuperAdminsPage />} />
            <Route path="/tenants" element={<TenantsPage />} />
            <Route path="/users" element={<UsersPage />} />
            <Route path="/license" element={<LicensePage />} />
            <Route path="/fetch-logs" element={<FetchLogsPage />} />
          </Route>
        </Route>
      </Routes>
    </>
  );
}

export default App;