dix_product_api

src/Components/HOC/CartWithDrawer.tsx

@@ -19,7 +19,7 @@ const CartWithDrawer = () => {
   const { t } = useTranslation();
   const { Cart, calculateTotalPrice, calculateTotalQuantity, removeCart } =
     useCartState();
-  const { user } = useAuthState();
+  const { user ,isAuthenticated} = useAuthState();
   const { mutate, isLoading, isSuccess } = useAddOrder();
   const products = Cart?.map((item: any) => ({
     quantity: item?.quantity,
@@ -27,6 +27,10 @@ const CartWithDrawer = () => {
   }));
 
   const addOrder = () => {
+     if (!isAuthenticated) {
+      toast.error("sorry you need to be authenticated");
+      return;
+    }
     mutate({
       email: user?.email,
       products: products,

src/Components/Home/BestSale.tsx

@@ -1,6 +1,7 @@
 import { useNavigate } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import ProductSwiper from "./ProductSwiper";
+import { useGetBaseProduct } from "../../api/baseProduct";
 
 const Products = () => {
   const {t}  = useTranslation();
@@ -9,6 +10,10 @@ const Products = () => {
   const handelSeeAll = () => {
     navigate(`/categories?type=best_sale`);
   };
+
+  const { data,isLoading } = useGetBaseProduct({
+    mostOrderd: "asc",
+  })
   return (
     <div className="Products">
       <header>
@@ -16,7 +21,7 @@ const Products = () => {
         <h5 className="pointer" onClick={handelSeeAll}> {t("View all")} </h5>
       </header>
       <main className="ProductCards">
-        <ProductSwiper/>
+      <ProductSwiper data={data} isLoading={isLoading} />
       </main>
     </div>
   );

src/Components/Home/ProductCard.tsx

@@ -40,10 +40,10 @@ const ProductCard = ({ item }: { item: Product }) => {
   const queryClient = useQueryClient();
 
   const handelChangeFavorite = (item: Product) => {
-    if (!isAuthenticated) {
-      toast.error("sorry you need to be authenticated");
-      return;
-    }
+    // if (!isAuthenticated) {
+    //   toast.error("sorry you need to be authenticated");
+    //   return;
+    // }
 
     if (item?.favorite) {
       
@@ -55,6 +55,8 @@ const ProductCard = ({ item }: { item: Product }) => {
         id: item?.id,
       });
     }
+    queryClient.invalidateQueries('mainProduct');
+
   };
 
   useEffect(() => {
@@ -71,11 +73,11 @@ const ProductCard = ({ item }: { item: Product }) => {
   }, [Delete]);
 
   const handelAddToCart = (item: Product) => {
-    if (!isAuthenticated) {
+    // if (!isAuthenticated) {
 
-      toast.error("sorry you need to be authenticated");
-      return;
-    }
+    //   toast.error("sorry you need to be authenticated");
+    //   return;
+    // }
     setCart(item);
 
 

src/Components/Home/ProductSwiper.tsx

@@ -11,16 +11,14 @@ import { Spin } from 'antd';
 
 
 
-const ProductSwiper = () => {
+const ProductSwiper = ({data,isLoading}:any) => {
   const language = localStorage.getItem('language') ;
   console.log(language);
   
   const [swiperDirection, setSwiperDirection] = useState(language === "ar" ? "rtl" : "ltr");
   const swiperRef = useRef<any>(null);
 
-  const { data, isLoading } = useGetBaseProduct({
-    mostOrderd: "asc",
-  });
+
   const BaseProducts = (data?.products as Product[]) || ([] as []);
 
   return (

src/Components/Home/Products.tsx

@@ -1,6 +1,7 @@
 import { useNavigate } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import ProductSwiper from "./ProductSwiper";
+import { useGetBaseProduct } from "../../api/baseProduct";
 
 const Products = () => {
   const {t} = useTranslation();
@@ -10,6 +11,11 @@ const Products = () => {
     navigate(`/categories?type=new_product`);
     };
 
+    const { data,isLoading } = useGetBaseProduct({
+      lastProducts:"asc"
+    });
+
+    
   return (
     <div className="Products">
       <header>
@@ -17,7 +23,7 @@ const Products = () => {
         <h5 className="pointer" onClick={handelSeeAll}> {t("View all")} </h5>
       </header>
       <main className="ProductCards">
-         <ProductSwiper/>
+      <ProductSwiper data={data} isLoading={isLoading} />
       </main>
     </div>
   );

src/Pages/Product/Page.tsx

@@ -94,7 +94,7 @@ const Page = () => {
             </div>
           </div>
       </main>
-      <Similar/>
+      <Similar  category_id={product?.category?.id} />
     </div>
   );
 };

src/Pages/Product/Similar.tsx

@@ -1,8 +1,10 @@
 import { useGetBaseProduct } from "../../api/baseProduct";
 import ProductSwiper from "../../Components/Home/ProductSwiper";
 
-const Similar = () => {
-  const { data } = useGetBaseProduct();
+const Similar = ({category_id}:any) => {
+  const { data,isLoading } = useGetBaseProduct({
+    category_id:category_id
+  });
 
   return (
     <div className="Products">
@@ -10,7 +12,7 @@ const Similar = () => {
         <h1>Similar Products</h1>
       </header>
       <main className="ProductCards">
-        <ProductSwiper/>
+        <ProductSwiper data={data} isLoading={isLoading} />
       </main>
     </div>
   );