import { type ReactNode } from 'react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
import { AuthProvider, useAuth, Toaster, ForgotPasswordPage, ResetPasswordPage, RegistrationWithOtp } from '@ump/shared';

import { LoginPage } from './pages/LoginPage';
import { DashboardPage } from './pages/DashboardPage';
import ApplicationReviewPage from './pages/ApplicationReviewPage';
import TemplatesFillPage from './pages/TemplatesFillPage';
import { ComingSoonPage } from './pages/ComingSoonPage';
import { DashboardLayout } from './layouts/DashboardLayout';

const queryClient = new QueryClient();

function RequireAuth({ children }: { children: ReactNode }) {
  const { isAuthenticated, loading } = useAuth();
  if (loading) return <div style={{ padding: 24 }}>Đang tải…</div>;
  return isAuthenticated ? <>{children}</> : <Navigate to="/login" replace />;
}

export default function App() {
  return (
    <QueryClientProvider client={queryClient}>
      <AuthProvider>
        <BrowserRouter>
          <Routes>
            <Route path="/login" element={<LoginPage />} />
            <Route path="/forgot-password" element={<ForgotPasswordPage />} />
            <Route path="/reset-password" element={<ResetPasswordPage />} />
            <Route path="/register" element={<RegistrationWithOtp variant="applicant" loginPath="/login" />} />

            {/* Authed applicant shell: sidebar + header wrap the routed content. */}
            <Route
              element={
                <RequireAuth>
                  <DashboardLayout />
                </RequireAuth>
              }
            >
              <Route path="/dashboard" element={<DashboardPage />} />
              {/* ImageHub team datasets — deferred (team-membership model not built yet). */}
              <Route path="/dashboard/datasets" element={<ComingSoonPage />} />
              {/* Lịch sử đăng ký — applicant documents workspace (history list + read-only review). */}
              <Route path="/dashboard/documents" element={<ApplicationReviewPage />} />
              <Route path="/dashboard/documents/review" element={<ApplicationReviewPage />} />
              <Route path="/dashboard/templates" element={<TemplatesFillPage />} />
              {/* Sidebar targets whose feature pages are not migrated yet → ComingSoon. */}
              <Route path="/dashboard/notifications" element={<ComingSoonPage />} />
              <Route path="/dashboard/settings" element={<ComingSoonPage />} />
              <Route path="/dashboard/help" element={<ComingSoonPage />} />
              <Route path="/applicant/profile" element={<ComingSoonPage />} />
            </Route>

            <Route path="/" element={<Navigate to="/dashboard" replace />} />
            <Route path="*" element={<Navigate to="/dashboard" replace />} />
          </Routes>
        </BrowserRouter>
        <Toaster />
      </AuthProvider>
    </QueryClientProvider>
  );
}
