import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
import Layout from "./components/Layout";
import AboutPage from "./pages/AboutPage";
import BlogDetailPage from "./pages/BlogDetailPage";
import BlogListPage from "./pages/BlogListPage";
import BrandDetailPage from "./pages/BrandDetailPage";
import BrandListPage from "./pages/BrandListPage";
import ContactPage from "./pages/ContactPage";
import HomePage from "./pages/HomePage";
import ReportageDetailPage from "./pages/ReportageDetailPage";
import ReportageListPage from "./pages/ReportageListPage";
import "./App.css";

export default function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route element={<Layout />}>
          <Route index element={<HomePage />} />
          <Route path="about" element={<AboutPage />} />
          <Route path="contact" element={<ContactPage />} />
          <Route path="blog" element={<BlogListPage />} />
          <Route path="blog/:slug" element={<BlogDetailPage />} />
          <Route path="reportages" element={<ReportageListPage />} />
          <Route path="reportages/:slug" element={<ReportageDetailPage />} />
          <Route path="brands" element={<BrandListPage />} />
          <Route path="brands/:slug" element={<BrandDetailPage />} />
          <Route path="*" element={<Navigate to="/" replace />} />
        </Route>
      </Routes>
    </BrowserRouter>
  );
}