import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
import { useEffect, useState } from "react";
import { Spin } from "antd";
import { api, getToken } from "./api";
import LoginPage from "./pages/LoginPage";
import MainLayout from "./layout/MainLayout";
import ScoreQueryPage from "./pages/ScoreQueryPage";
import AttemptReviewPage from "./pages/AttemptReviewPage";
import AdminImportPage from "./pages/AdminImportPage";
import AdminGradersPage from "./pages/AdminGradersPage";
import AdminSystemSettingsPage from "./pages/AdminSystemSettingsPage";
import AdminRoute from "./AdminRoute";

export type UserMe = { id: number; username: string; display_name: string; role: string };

function App() {
  const [user, setUser] = useState<UserMe | null>(null);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    if (!getToken()) {
      setLoading(false);
      return;
    }
    api
      .get<UserMe>("/api/auth/me")
      .then((r) => setUser(r.data))
      .catch(() => setUser(null))
      .finally(() => setLoading(false));
  }, []);

  if (loading) {
    return (
      <div style={{ display: "flex", height: "100vh", alignItems: "center", justifyContent: "center" }}>
        <Spin size="large" />
      </div>
    );
  }

  return (
    <BrowserRouter>
      <Routes>
        <Route path="/login" element={<LoginPage onLogin={setUser} />} />
        <Route
          path="/"
          element={user ? <MainLayout user={user} onLogout={() => setUser(null)} /> : <Navigate to="/login" />}
        >
          <Route index element={<Navigate to="/scores" replace />} />
          <Route path="scores" element={<ScoreQueryPage />} />
          <Route path="attempts/:attemptId" element={<AttemptReviewPage />} />
          <Route
            path="admin/import"
            element={<AdminRoute user={user}><AdminImportPage /></AdminRoute>}
          />
          <Route
            path="admin/graders"
            element={<AdminRoute user={user}><AdminGradersPage /></AdminRoute>}
          />
          <Route
            path="admin/settings"
            element={<AdminRoute user={user}><AdminSystemSettingsPage /></AdminRoute>}
          />
        </Route>
      </Routes>
    </BrowserRouter>
  );
}

export default App;