import React from "react";
import { Routes as ReactRouterRoutes, Route } from "react-router-dom";
import LandingPage from "./components/homepage/Landingpage";

import CollectionPage from "./components/category/collectionpage";
import CartPage from "./components/cart/cart";
import AboutPage from "./components/cart/aboutus";

import BrandPage from "./components/adminportal/brand";
import ProductPage from "./components/product/ProductPage";
import Layout from "./components/adminportal/adminlayout";

import ProductForm from "./components/adminportal/product";
import CategoryPage from "./components/category/CategoryPage";
import CategoryForm from "./components/adminportal/category";

const Routes: React.FC = () => {
  return (
    <ReactRouterRoutes>
      {/* Public routes */}
      <Route path="/" element={<LandingPage />} />
      <Route path="/cat" element={<CategoryPage />} />
      <Route path="/collections/:collectionId" element={<CollectionPage />} />
      <Route
        path="/products/:collectionId/:productId"
        element={<ProductPage />}
      />
      <Route path="/cart" element={<CartPage />} />
      <Route path="/aboutus" element={<AboutPage />} />

      {/* Admin routes - using the layout we created */}
      <Route path="/admin" element={<Layout />}>
        <Route path="categoriesform" element={<CategoryForm />} />
        <Route path="brands" element={<BrandPage />} />
        <Route path="products" element={<ProductForm />} />

        {/* Redirect /admin to /admin/products by default */}
        <Route index element={<ProductPage />} />
      </Route>

      {/* <Route path="*" element={<NotFoundPage />} /> */}
    </ReactRouterRoutes>
  );
};

export default Routes;
