import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
import OrdersPage from './pages/OrdersPage';
import VehiclesPage from './pages/VehiclesPage';
import VehicleDetailPage from './pages/VehicleDetailPage';
import 'bootstrap/dist/css/bootstrap.min.css';
import './App.css';

const App = () => {
  return (
    <Router>
      <div className="App">

        <nav className="navbar navbar-dark bg-primary">
          <div className="container">

            <Link className="navbar-brand" to="/">
              Логистическая компания
            </Link>
            <div className="d-flex">
              <Link className="nav-link text-white me-3" to="/orders">
                Заказы
              </Link>
              <Link className="nav-link text-white" to="/vehicles">
                Машины
              </Link>
            </div>
          </div>
        </nav>

        <main className="container mt-4">
          <Routes>
            <Route path="/" element={<OrdersPage />} />
            <Route path="/orders" element={<OrdersPage />} />
            <Route path="/vehicles" element={<VehiclesPage />} />
            <Route path="/vehicles/:id" element={<VehicleDetailPage />} />
          </Routes>
        </main>
      </div>
    </Router>
  );
};

export default App;