import { createBrowserRouter } from 'react-router-dom';
import { App } from './App';
import { DashboardLayout } from './components/layout/DashboardLayout';
import { RequireAuth } from './components/layout/RequireAuth';
import { HomePage } from './pages/HomePage';
import { LoginPage } from './pages/LoginPage';
import { SignUpPage } from './pages/SignUpPage';
import { SellItemPage } from './pages/SellItemPage';
import { ProductDetailPage } from './pages/ProductDetailPage';
import { CreateProfilePage } from './pages/CreateProfilePage';
import { UpdateProfilePage } from './pages/UpdateProfilePage';
import { ChatPage } from './pages/ChatPage';
import { MyOffersPage } from './pages/MyOffersPage';
import { NotificationsPage } from './pages/NotificationsPage';
import { SoldItemsPage } from './pages/SoldItemsPage';
import { SettingsPage } from './pages/SettingsPage';

export const router = createBrowserRouter([
  {
    path: '/',
    element: <App />,
    children: [
      { index: true, element: <HomePage /> },
      { path: 'login', element: <LoginPage /> },
      { path: 'signup', element: <SignUpPage /> },
      { path: 'sell', element: <RequireAuth><SellItemPage /></RequireAuth> },
      { path: 'listings/:id', element: <ProductDetailPage /> },
      { path: 'profile/create', element: <RequireAuth><CreateProfilePage /></RequireAuth> },
      { path: 'profile/edit', element: <RequireAuth><UpdateProfilePage /></RequireAuth> },
      {
        path: 'dashboard',
        element: <RequireAuth><DashboardLayout /></RequireAuth>,
        children: [
          { path: 'messages', element: <ChatPage /> },
          { path: 'offers', element: <MyOffersPage /> },
          { path: 'notifications', element: <NotificationsPage /> },
          { path: 'sold', element: <SoldItemsPage /> },
          { path: 'settings', element: <SettingsPage /> },
        ],
      },
    ],
  },
]);
