product page and detail page updated

app/[locale]/catalog_page/page.tsx

@@ -7,7 +7,7 @@ export default function Page() {
     <div className="bg-[#1e1d1c] pb-30">
       <ProductBanner />
       <div className="max-w-300 mx-auto w-full pt-20">
-        <MainSubCategory />
+        <Catalog />
       </div>
     </div>
   );

app/[locale]/products/[slug]/page.tsx

@@ -59,7 +59,7 @@ export default function SlugPage() {
   const features = product.features.map((item:any)=>item.name)
 
   return (
-    <div className="min-h-screen bg-[#1e1d1c] py-20 md:py-32 lg:py-40 px-4 md:px-8">
+    <div className="min-h-screen bg-[#1e1d1c] py-32 lg:py-40 px-4 md:px-8">
       <div className="max-w-7xl mx-auto">
         {/* Main Product Section */}
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 mb-12">

components/pages/products/catalog.tsx

@@ -84,7 +84,7 @@ export default function CatalogCard({
   };
 
   const navigateLink = have_sub_category
-    ? `/${locale}/catalog_page?category=${id}`
+    ? `/${locale}/subCategory?category=${id}`
     : `/${locale}/products?category=${id}`;
 
   return (

components/pages/products/product/mianProduct.tsx

@@ -7,9 +7,11 @@ import { useCategory } from "@/store/useCategory";
 import { useFilter } from "@/lib/filter-zustand";
 import { useEffect, useMemo } from "react";
 import { useProductPageInfo } from "@/store/useProduct";
+import { useSubCategory } from "@/store/useSubCategory";
 
 export default function MainProduct() {
   const category = useCategory((state) => state.category);
+  const subCategory = useSubCategory((state) => state.subCategory);
   const filter = useFilter((state) => state.filter);
   const getFiltersByType = useFilter((state) => state.getFiltersByType);
   const setProduct = useProductPageInfo((state) => state.setProducts);
@@ -32,7 +34,7 @@ export default function MainProduct() {
   // Request link yaratish
   const requestLink = useMemo(() => {
     const baseLink = category.have_sub_category
-      ? endPoints.subCategory.byId(category.id)
+      ? endPoints.product.bySubCategory(subCategory.id)
       : endPoints.product.byCategory(category.id || 0);
 
     // Query params qo'shish
@@ -40,19 +42,14 @@ export default function MainProduct() {
   }, [category.id, category.have_sub_category, queryParams]);
 
   const { data, isLoading, error } = useQuery({
-    queryKey: ["products", category.id, queryParams],
+    queryKey: ["products", subCategory.id, queryParams],
     queryFn: () => httpClient(requestLink),
     select: (data) => {
-      const product = data?.data?.data?.results;
-      return product.map((item: any) => ({
-        id: item.id,
-        name: item.name,
-        image: item.images[0].image,
-      }));
+      console.log("product: ", data?.data?.data?.results);
+      return data?.data?.data?.results;
     },
   });
 
-
   if (isLoading) {
     return (
       <div className="grid lg:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-5">
@@ -86,8 +83,8 @@ export default function MainProduct() {
           key={item.id} // ✅ index o'rniga id ishlatish
           getProduct={() => setProduct(item)}
           title={item.name}
-          image={item.image}
-          slug={item.slug}
+          image={item?.images[0]?.image ||''}
+          slug='special_product'
         />
       ))}
     </div>