import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
import { AuthProvider } from './context/AuthContext';
import { useAuth } from './context/useAuth';
import { SystemSettingsProvider } from './context/SystemSettingsContext';
import { NotificationProvider } from './contexts/NotificationContext';
import { Layout } from './components/Layout';
import { ProtectedRoute } from './components/ProtectedRoute';
import { ToastProvider } from './components/Toast';
import { ProjectList } from './pages/ProjectList';
import { ProjectDetails } from './pages/ProjectDetails';
import { SchemesList } from './pages/SchemesList';
import { InspectionsList } from './pages/InspectionsList';
import { DataSheetLibrary } from './pages/DataSheetLibrary';
import { YieldStudyDashboard } from './pages/YieldStudyDashboard';
import { AdminDashboard } from './pages/AdminDashboard';
import { DeveloperDashboard } from './pages/DeveloperDashboard';
import { CalculatorDashboard } from './pages/CalculatorDashboard';
import { StockDashboard } from './pages/StockDashboard';
import { GuestDashboard } from './pages/GuestDashboard';
import { Login } from './pages/Login';
import { Callback } from './pages/Callback';
import InstrumentList from './pages/InstrumentList';

const DeveloperRoute: React.FC<{ children: React.ReactNode }> = ({ children }) => {
  const { isDeveloper, isLoading } = useAuth();

  if (isLoading) return null;
  if (!isDeveloper()) return <Navigate to="/" replace />;

  return <>{children}</>;
};

const AppContent: React.FC = () => {
  return (
    <ToastProvider>
      <AuthProvider>
        <SystemSettingsProvider>
          <NotificationProvider>
            <Layout>
              <Routes>
                <Route path="/" element={<ProjectList />} />
                <Route path="/login" element={<Login />} />
                <Route path="/callback" element={<Callback />} />
                <Route path="/guest-dashboard" element={<GuestDashboard />} />
                <Route path="/projects" element={<ProjectList />} />
                <Route path="/project/:id" element={<ProjectDetails />} />
                <Route path="/schemes" element={<SchemesList />} />
                <Route path="/inspections" element={<InspectionsList />} />
                <Route path="/library" element={
                  <ProtectedRoute allowedRoles={['user', 'admin']}>
                    <DataSheetLibrary />
                  </ProtectedRoute>
                } />
                <Route path="/instruments" element={
                  <ProtectedRoute allowedRoles={['user', 'admin', 'guest']}>
                    <InstrumentList />
                  </ProtectedRoute>
                } />
                <Route path="/yield-study" element={
                  <ProtectedRoute allowedRoles={['user', 'admin']}>
                    <YieldStudyDashboard />
                  </ProtectedRoute>
                } />
                <Route path="/calculators" element={<CalculatorDashboard />} />
                <Route
                  path="/admin"
                  element={
                    <ProtectedRoute allowedRoles={['admin']}>
                      <AdminDashboard />
                    </ProtectedRoute>
                  }
                />
                <Route
                  path="/stock"
                  element={
                    <ProtectedRoute allowedRoles={['user', 'admin', 'guest']}>
                      <StockDashboard />
                    </ProtectedRoute>
                  }
                />
                <Route
                  path="/developer"
                  element={
                    <DeveloperRoute>
                      <DeveloperDashboard />
                    </DeveloperRoute>
                  }
                />
              </Routes>
            </Layout>
          </NotificationProvider>
        </SystemSettingsProvider>
      </AuthProvider>
    </ToastProvider>
  );
};

function App() {
  return (
    <Router>
      <AppContent />
    </Router>
  );
}

export default App;
