import React, { Suspense, lazy } from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import Home from './pages/Home';

const MediaAdmin = lazy(() => import('./pages/admin/MediaAdmin'));
const ProtocolListAdmin = lazy(() => import('./pages/admin/ProtocolListAdmin'));

const App: React.FC = () => {
  return (
    <Router>
      <Suspense fallback={<div className="font-mono p-10 text-orange-500">CARGANDO SISTEMA...</div>}>
        <Routes>
          <Route path="/" element={<Home />} />
          <Route path="/admin" element={<ProtocolListAdmin />} />
          <Route path="/admin/protocols" element={<ProtocolListAdmin />} />
          <Route path="/admin/media" element={<MediaAdmin />} />
        </Routes>
      </Suspense>
    </Router>
  );
};

export default App;
