import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import HomeLayout from "./layouts/HomeLayout";
import ChatLayout from "./layouts/ChatLayout";

import Downloader from "./pages/downloader/Downloader";
import Home from "./pages/home/home";
import DroneServisSection from "./pages/home/components/Services/droneServis";


import PrivateRoute from "./routes/PrivateRoute";

// Pages
import PortfolioPage from "./pages/portfolio/PortfolioPage";
import ContactPage from "./pages/contact/ContactPage";
import ScrollToTop from "./components/common/ScrollToTop";


import AuthLayout from "./layouts/AuthLayout";
import LogoutPage from "./pages/account/Logout";
import LoginPage from "./pages/account/Login";
import RegisterPage from "./pages/account/Register";


export default function App() {
  return (
    <Router>
      <ScrollToTop />
      <Routes>
        {/* Public routes */}
        <Route path="/" element={<HomeLayout />}>
          <Route index element={<Home />} />
          <Route path="portfolio" element={<PortfolioPage />} />
          <Route path="contact" element={<ContactPage />} />

          {/* APPS */}
          <Route path="apps/downloader" element={<Downloader />} />

          {/* SERVICES */}
          <Route path="services/drone" element={< DroneServisSection />} />
          <Route path="services/web" element={<Downloader />} />

        </Route>

        <Route path="auth/" element={<AuthLayout />}>
          <Route path="login" element={<LoginPage />} />
          <Route path="register" element={<RegisterPage />} />
          <Route path="logout" element={<LogoutPage />} />
          </Route>

          {/* Example protected route group (kept for future use) */}
          <Route element={<PrivateRoute />}>
            <Route path="/" element={<ChatLayout />}>
              
            </Route>
          </Route>
        </Routes>
    </Router>
  );
}