tabexseriescomponents 0.2.1069 → 0.2.1071

package/srcbefore27-11/TabexComponents/Cards/Simpleproductcard/Simpleproductcard copy.jsx

@@ -0,0 +1,2321 @@
+// // import React, { useEffect, useState, useContext } from 'react';
+// // import { css } from 'glamor';
+// // import { Imagekitimagecomp } from '../../../Imagekitconfig.jsx';
+// // import { FiShoppingCart } from '@react-icons/all-files/fi/FiShoppingCart';
+// // import { FiShoppingBag } from '@react-icons/all-files/fi/FiShoppingBag';
+// // import { FaRegHeart } from '@react-icons/all-files/fa/FaRegHeart';
+// // import { FaHeart } from '@react-icons/all-files/fa/FaHeart';
+// // import { CgShoppingBag } from '@react-icons/all-files/cg/CgShoppingBag';
+// // import { AiFillStar } from '@react-icons/all-files/ai/AiFillStar';
+// // import { AiOutlineStar } from '@react-icons/all-files/ai/AiOutlineStar';
+// // import { MdAddShoppingCart } from '@react-icons/all-files/md/MdAddShoppingCart';
+// // import { BsBag } from '@react-icons/all-files/bs/BsBag';
+// // import { RiHandbagLine } from '@react-icons/all-files/ri/RiHandbagLine';
+// // import ReactStars from 'react-rating-stars-component';
+// // import cardstyles from '../../../styles/cards/card23.module.css';
+// // import { BsEye } from '@react-icons/all-files/bs/BsEye';
+// // import { CircularProgress } from 'react-cssfx-loading';
+// // import Variants_J_Cards from '../Variants_J_Cards/Variants_J_Cards.jsx';
+// // import { FiMinus } from '@react-icons/all-files/fi/FiMinus';
+// // import { FiPlus } from '@react-icons/all-files/fi/FiPlus';
+// // const Simpleproductcard = (props) => {
+// //     const [sectionproperties, setsectionproperties] = useState('');
+// //     const [variantObj, setvariantObj] = useState('');
+// //     const [item, setitem] = useState(props.cardinfoitemprops);
+// //     const StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
+// //     const lang = props.actions.lang;
+// //     const langdetect = props.actions.langdetect;
+// //     const setShowProductInfoModalContext = props.actions.setShowProductInfoModalContext;
+// //     const addtofavoritescontext = props.actions.addtofavoritescontext;
+// //     const setProductIdProdutInfoModalContext = props.actions.setProductIdProdutInfoModalContext;
+// //     const cardonclickfunctionContext = props.actions.cardonclickfunctionContext;
+// //     const ikimagecredcontext = props.actions.ikimagecredcontext;
+// //     const NotificationManager = props.actions.NotificationManager;
+// //     const AddtoCartContext = props.actions.AddtoCartContext;
+// //     const AddtoCartMutationContext = props.actions.AddtoCartMutationContext;
+// //     const [addtocardpayloadobj, setaddtocardpayloadobj] = useState('');
+// //     const [Variant_Color_ImageObj, setVariant_Color_ImageObj] = useState('');
+// //     const authdetailsContext = props.actions.authdetailsContext;
+// //     const [showquantity, setshowquantity] = useState(false);
+
+// //     const plainString = (html) => {
+// //         var divContainer = document.createElement('div');
+// //         divContainer.innerHTML = html;
+// //         return divContainer.textContent || divContainer.innerText || '';
+// //     };
+// //     useEffect(() => {
+// //         var secpropobj = {};
+// //         StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
+// //             if (sectionitem.sectionid == props.sectionidprops) {
+// //                 sectionitem.sectionproperties.forEach(function (sectionpropertiesobj, sectionpropertiesindex) {
+// //                     secpropobj[sectionpropertiesobj.property_css_name] = sectionpropertiesobj.property_value;
+// //                 });
+// //             }
+// //         });
+// //         setsectionproperties({ ...secpropobj });
+// //     }, [StatePagePropertiesContext]);
+// //     useEffect(() => {
+// //         setitem(props.cardinfoitemprops);
+// //     }, [props.cardinfoitemprops]);
+// //     // useEffect(() => {
+// //     //     if (item.quantity == 0) {
+// //     //         setshowquantity(false);
+// //     //     } else {
+// //     //         setshowquantity(true);
+// //     //     }
+// //     // }, [props.cardinfoitemprops]);
+// //     useEffect(() => {
+// //         var productImagetoBeSelected = '';
+// //         var Tempitem = { ...item };
+// //         productImagetoBeSelected = item.productmainimage;
+// //         if (variantObj != undefined && variantObj != null && Object.keys(variantObj).length != 0 && variantObj != '') {
+// //             var variatgalleryid = variantObj.variantgalleryid;
+// //             if (variatgalleryid != undefined && variatgalleryid != null && variatgalleryid != '') {
+// //                 item?.productimages?.forEach(function (item, index) {
+// //                     if (item.galleryid == variatgalleryid) {
+// //                         productImagetoBeSelected = item.path;
+// //                     }
+// //                 });
+// //             }
+// //         }
+
+// //         Tempitem.image = productImagetoBeSelected;
+// //         setitem({ ...Tempitem });
+// //     }, [variantObj]);
+// //     useEffect(() => {
+// //         var productImagetoBeSelected = '';
+// //         var Tempitem = { ...item };
+// //         productImagetoBeSelected = item.productmainimage;
+// //         if (Variant_Color_ImageObj != undefined && Variant_Color_ImageObj != null && Object.keys(Variant_Color_ImageObj).length != 0 && Variant_Color_ImageObj != '') {
+// //             var variatgalleryid = Variant_Color_ImageObj.variantgalleryid;
+// //             if (variatgalleryid != undefined && variatgalleryid != null && variatgalleryid != '') {
+// //                 item?.productimages?.forEach(function (item, index) {
+// //                     if (item.galleryid == variatgalleryid) {
+// //                         productImagetoBeSelected = item.path;
+// //                     }
+// //                 });
+// //             }
+// //         }
+
+// //         Tempitem.image = productImagetoBeSelected;
+// //         setitem({ ...Tempitem });
+// //     }, [Variant_Color_ImageObj]);
+// //     const card_cssstyles = {
+// //         innersection: css({
+// //             paddingLeft: sectionproperties.innersectionpaddinghorizontal + 'px',
+// //             paddingRight: sectionproperties.innersectionpaddinghorizontal + 'px',
+// //             '@media (max-width: 800px)': {
+// //                 paddingLeft: sectionproperties.innersectionpaddinghorizontal == 0 ? 0 : 5,
+// //                 paddingRight: sectionproperties.innersectionpaddinghorizontal == 0 ? 0 : 5,
+// //             },
+// //         }),
+// //         productcard: css({
+// //             minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
+// //             maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
+// //             '@media (max-width: 800px)': {
+// //                 minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + 'px',
+// //                 maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + 'px',
+// //             },
+// //             ':hover .iconsContainer': {
+// //                 opacity: 1,
+// //                 transition: 'all, 0.4s',
+// //                 right: 10,
+// //                 transform: `translateX(0px)`,
+// //             },
+// //             // ':hover .pname': {
+// //             //     textDecoration: 'underline',
+// //             //     transition: '.3s',
+// //             // },
+// //         }),
+// //         productcardimagecont: css({
+// //             position: 'relative',
+// //             overflow: 'hidden',
+// //             height: sectionproperties.image_height == 0 ? 'auto' : sectionproperties.image_height + 'px',
+// //             background: sectionproperties.image_bgtransparent == 'Transparent' ? '' : sectionproperties.image_bgcolor,
+// //             border: sectionproperties.image_borderType == 'All' ? sectionproperties.image_borderwidth + 'px solid ' + sectionproperties.image_bordercolor : 0,
+// //             borderBottom: sectionproperties.image_borderwidth + 'px solid ' + sectionproperties.image_bordercolor,
+// //             borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
+// //             borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
+// //             borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
+// //             borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px',
+// //             transition: '.3s',
+// //             opacity: item.currentquantity < 1 && sectionproperties.showoutofstock == 'Show' && item.quantavailtype == 'limit' && item.hasvariants == 0 ? 0.4 : 1,
+// //             '@media (max-width: 800px)': {
+// //                 height:
+// //                     sectionproperties.height_responsive == 0
+// //                         ? 'auto'
+// //                         : sectionproperties.height_responsive != null
+// //                         ? sectionproperties.height_responsive + 'px'
+// //                         : sectionproperties.image_height + 'px',
+// //             },
+// //         }),
+// //         productNameStyles: css({
+// //             color: sectionproperties.prodNameColor,
+// //             fontSize: sectionproperties.prodNameFontSize + 'px',
+// //             textTransform: sectionproperties.prodNameTextTranform,
+// //             fontWeight: sectionproperties.prodNameFontWeight,
+// //             transition: '.3s',
+// //             cursor: 'pointer',
+// //             ':hover': {
+// //                 color: sectionproperties.prodNameColorOnHover,
+// //             },
+// //         }),
+// //         productPricestyles: css({
+// //             color: sectionproperties.prodPriceColor,
+// //             fontSize: sectionproperties.prodpriceFontSize + 'px',
+// //             fontWeight: sectionproperties.prodPriceFontWeight,
+// //         }),
+// //         productSalePricestyles: css({
+// //             color: sectionproperties.prodsalePriceColor,
+// //             fontSize: sectionproperties.prodsalepriceFontSize + 'px',
+// //             fontWeight: sectionproperties.prodsalePriceFontWeight,
+// //         }),
+// //         wishlist_btn: css({
+// //             width: sectionproperties.favBtnWidth + 'px',
+// //             height: sectionproperties.favBtnHeight + 'px',
+// //             background: sectionproperties.favbtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.favBtnbgColor,
+// //             borderRadius: sectionproperties.fav_btn_borderBottomLeftRadius + 'px',
+// //             color: sectionproperties.favBtnTextcolor,
+// //             fontSize: sectionproperties.favBtnTextfontsize + 'px',
+// //             textTransform: sectionproperties.favBtnTexttransform,
+// //             fontWeight: sectionproperties.favBtnTextfontweight,
+// //             transition: '.3s',
+// //             border: sectionproperties.favbtnborderwidth + 'px solid ' + sectionproperties.favbtnbordercolor,
+// //             ':hover': {
+// //                 background: sectionproperties.favbtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.favBtnbgColoronhover,
+// //                 color: sectionproperties.favBtnTextcoloronhover,
+// //             },
+// //         }),
+// //         minus_quantitybtn_icon_container: css({
+// //             color: sectionproperties.cartBtnbgColor,
+// //             fontSize: 18,
+// //             flex: 1,
+// //             ':hover': {
+// //                 color: sectionproperties.cartBtnbgColoronhover,
+// //             },
+// //         }),
+// //         quantitybtn: css({
+// //             width: '70%',
+// //             height: sectionproperties.cartBtnHeight + 'px',
+// //             background: 'transparent',
+// //             borderRadius: sectionproperties.cart_btn_borderBottomLeftRadius + 'px',
+// //             color: sectionproperties.cartBtnbgColor,
+// //             fontSize: sectionproperties.cartBtnTextfontsize + 'px',
+// //             textTransform: sectionproperties.cartBtnTexttransform,
+// //             fontWeight: sectionproperties.cartBtnTextfontweight,
+// //             border: '1px solid ' + sectionproperties.cartBtnbgColor,
+// //             transition: '.3s',
+// //             // textDecoration: sectionproperties.cartbtntextdecoration == 'Underline' ? 'underline' : 'none',
+// //             ':hover': {
+// //                 background: 'transparent',
+// //                 color: sectionproperties.cartBtnbgColoronhover,
+// //                 borderColor: sectionproperties.cartBtnbgColoronhover,
+// //             },
+// //         }),
+// //         cart_btn: css({
+// //             width: sectionproperties.cartBtnWidth == 0 ? 'auto' : sectionproperties.cartBtnWidth + 'px',
+// //             height: sectionproperties.cartBtnHeight + 'px',
+// //             background: sectionproperties.cartbtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.cartBtnbgColor,
+// //             borderRadius: sectionproperties.cart_btn_borderBottomLeftRadius + 'px',
+// //             color: sectionproperties.cartBtnTextcolor,
+// //             fontSize: sectionproperties.cartBtnTextfontsize + 'px',
+// //             textTransform: sectionproperties.cartBtnTexttransform,
+// //             fontWeight: sectionproperties.cartBtnTextfontweight,
+// //             border: sectionproperties.cartbtnborderwidth + 'px solid ' + sectionproperties.cartbtnbordercolor,
+// //             transition: '.3s',
+// //             textDecoration: sectionproperties.cartbtntextdecoration == 'Underline' ? 'underline' : 'none',
+// //             ':hover': {
+// //                 background: sectionproperties.cartbtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.cartBtnbgColoronhover,
+// //                 color: sectionproperties.cartBtnTextcoloronhover,
+// //                 borderColor: sectionproperties.cartBtnTextcoloronhover,
+// //             },
+// //         }),
+// //         outstockbadge: css({
+// //             width: sectionproperties.outstock_width + 'px',
+// //             height: sectionproperties.outstock_height + 'px',
+// //             background: sectionproperties.outstock_bg,
+// //             color: sectionproperties.outstock_color,
+// //             fontSize: sectionproperties.outstock_fontSize + 'px',
+// //             borderRadius: sectionproperties.outstock_borderradius + 'px',
+// //             position: 'absolute',
+// //             zIndex: 2,
+// //             top: 0,
+// //             bottom: 0,
+// //             left: 0,
+// //             right: 0,
+// //             margin: 'auto',
+// //         }),
+// //         profitcontainer: css({
+// //             width: sectionproperties.profitcontainerwidth + '%',
+// //             height: sectionproperties.profitcontainerheight + 'px',
+// //             background: sectionproperties.profitcontainerbgcolor,
+// //             border: sectionproperties.profitcontainerborderwidth + 'px solid' + sectionproperties.profitcontainerbordercolor,
+// //             borderRadius: sectionproperties.profitcontainerborderradius + 'px',
+// //             color: sectionproperties.profitcontainercolor,
+// //             '@media (max-width: 800px)': {
+// //                 width: '100%',
+// //             },
+// //         }),
+// //         productDescStyles: css({
+// //             color: sectionproperties.prodCatColor,
+// //             fontSize: sectionproperties.prodCatFontSize + 'px',
+// //             fontWeight: sectionproperties.prodCatFontWeight,
+// //         }),
+// //         pinfohover: css({
+// //             opacity: 0,
+// //             background: 'white',
+// //             position: 'absolute',
+// //             top: 0,
+// //             transition: '.3s',
+// //         }),
+// //         icontainer: css({
+// //             ':hover .pinfohover': {
+// //                 opacity: 1,
+// //                 transition: '.3s',
+// //             },
+// //         }),
+// //         cardconttt: css({
+// //             background:
+// //                 sectionproperties.backgroundColortransparent == 'Transparent'
+// //                     ? 'transparent'
+// //                     : sectionproperties.backgroundColortransparent != 'Transparent' && sectionproperties.backgroundColor == '#ffffff'
+// //                     ? 'rgba(250,250,250,' + sectionproperties.cardbg_opacity + ')'
+// //                     : sectionproperties.backgroundColor,
+// //             borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.borderBottomLeftRadius + 'px' : sectionproperties.borderBottomRightRadius + 'px',
+// //             borderBottomRightRadius: langdetect == 'en' ? sectionproperties.borderBottomRightRadius + 'px' : sectionproperties.borderBottomLeftRadius + 'px',
+// //             borderTopLeftRadius: langdetect == 'en' ? sectionproperties.borderTopLeftRadius + 'px' : sectionproperties.borderTopRightRadius + 'px',
+// //             borderTopRightRadius: langdetect == 'en' ? sectionproperties.borderTopRightRadius + 'px' : sectionproperties.borderTopLeftRadius + 'px',
+// //             marginTop: sectionproperties.marginTop + 'px',
+// //             marginBottom: sectionproperties.marginBottom + 'px',
+// //             border: sectionproperties.sectioncardborderwidth + 'px solid ' + sectionproperties.sectioncardbordercolor,
+// //             paddingTop: sectionproperties.paddingTop + 'px',
+// //             paddingBottom: sectionproperties.paddingBottom + 'px',
+// //             paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
+// //             paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
+// //             transition: '.3s',
+// //             // opacity: sectionproperties.backgroundColortransparent != 'Transparent' && sectionproperties.backgroundColor == '#ffffff' ? 'rgba(250,250,250,' + sectionproperties.cardbg_opacity + ')' : 1,
+// //             ':hover': {
+// //                 backgroundColor:
+// //                     sectionproperties.backgroundColortransparent != 'Transparent' && sectionproperties.backgroundColor == '#ffffff'
+// //                         ? 'rgba(250,250,250,' + sectionproperties.bgopacityonhover + ')'
+// //                         : 1,
+// //                 transition: 0.3,
+// //                 boxShadow: '0 0 10px ' + sectionproperties.sectioncardshadowcoloronhover,
+// //             },
+// //         }),
+// //         iconsContainer: css({
+// //             display: 'flex',
+// //             flexDirection: 'column',
+// //             position: 'absolute',
+// //             top: 5,
+// //             right: -15,
+// //             opacity: 0,
+// //             transform: `translateX(5px)`,
+// //             zIndex: 10,
+// //             '@media (max-width: 800px)': {
+// //                 opacity: 1,
+// //                 right: 10,
+// //             },
+// //         }),
+// //         iconsContainer2: css({
+// //             opacity: 1,
+// //             transition: 'all, 0.4s',
+// //             right: 10,
+// //             transform: `translateX(0px)`,
+// //         }),
+// //         sku: css({
+// //             fontSize: sectionproperties.skuFontSize + 'px',
+// //             color: sectionproperties.skuColor,
+// //             fontWeight: sectionproperties.skuFontWeight,
+// //         }),
+// //         imagediv: css({
+// //             ':hover': {
+// //                 transition: 'all .4s ease',
+// //                 transform: sectionproperties.zoomimageonhover == 'Yes' ? 'scale(1.1)' : '',
+// //             },
+// //         }),
+// //     };
+// //     const [secondimage, setsecondimage] = useState('');
+// //     useEffect(() => {
+// //         setitem(props.cardinfoitemprops);
+// //         if (props?.cardinfoitemprops?.productimages?.length == 1) {
+// //             setsecondimage(props?.cardinfoitemprops?.image);
+// //         } else {
+// //             if (props?.cardinfoitemprops != undefined && props?.cardinfoitemprops?.productimages != undefined && Array.isArray(props?.cardinfoitemprops?.productimages)) {
+// //                 if (props?.cardinfoitemprops?.productimages[0] != undefined && props?.cardinfoitemprops?.productimages[0]?.path == props?.cardinfoitemprops?.image) {
+// //                     if (props?.cardinfoitemprops?.productimages[1]?.length != 0) {
+// //                         setsecondimage(props?.cardinfoitemprops?.productimages[1]?.path);
+// //                     } else {
+// //                         setsecondimage(props?.cardinfoitemprops?.image);
+// //                     }
+// //                 } else {
+// //                     setsecondimage(props?.cardinfoitemprops?.productimages[0]?.path);
+// //                 }
+// //             }
+// //         }
+// //     }, [props.cardinfoitemprops]);
+// //     const addtocartfunc = () => {
+// //         var addtocardpayloadobj = {
+// //             functype: 'add',
+// //             productid: item.productid,
+// //             variantid: '',
+// //             quantity: item.quantity,
+// //             vendorid: item.vendorid,
+// //         };
+
+// //         var runfunc = false;
+// //         if (item.productid != '6811f1adebacc' && item.productid != '6811f2c05bd7f') {
+// //             if (addtocardpayloadobj.productid.length != 0 && addtocardpayloadobj.quantity > 0) {
+// //                 if (item.hasvariants == 1) {
+// //                     // if (addtocardpayloadobj.variantid.length != 0) {
+// //                     if (variantObj != undefined && variantObj != null && Object.keys(variantObj).length != 0) {
+// //                         addtocardpayloadobj.variantid = variantObj.variantid;
+// //                         runfunc = true;
+// //                     } else {
+// //                         NotificationManager.warning(
+// //                             '',
+// //                             authdetailsContext?.instinfo?.contactinfo.instid == '674f0617c7811'
+// //                                 ? 'Please Choose Size & Color'
+// //                                 : authdetailsContext?.instinfo?.contactinfo.instid == '67e448d2ef6e0'
+// //                                 ? 'من فضلك اختر لون'
+// //                                 : langdetect == 'en'
+// //                                 ? 'Please Choose Product Options'
+// //                                 : 'من فضلك اختر متغير',
+// //                         );
+// //                     }
+// //                 } else {
+// //                     runfunc = true;
+// //                 }
+// //             } else {
+// //                 NotificationManager.warning('', langdetect == 'en' ? 'Please Choose Quantity' : 'من فضلك اختر الكمية');
+// //             }
+// //         } else {
+// //         }
+
+// //         if (runfunc == true) {
+// //             AddtoCartContext(addtocardpayloadobj);
+// //         }
+// //     };
+// //     // const addtocartfunc = () => {
+// //     //     var runfunc = false;
+
+// //     //     var tempaddtocardpayloadobj = { ...addtocardpayloadobj };
+// //     //     tempaddtocardpayloadobj.productid = item.productid;
+// //     //     tempaddtocardpayloadobj.functype = 'add';
+// //     //     tempaddtocardpayloadobj.item_type = 'product';
+// //     //     tempaddtocardpayloadobj.quantity = 1;
+
+// //     //     AddtoCartContext(tempaddtocardpayloadobj);
+// //     // };
+// //     const addtocartbuttonrender = () => {
+// //         if (AddtoCartMutationContext.isLoading) {
+// //             if (AddtoCartMutationContext?.variables?.productid == item.productid) {
+// //                 return (
+// //                     <div class={' d-flex align-items-center justify-content-center '}>
+// //                         <CircularProgress color={sectionproperties.cartBtnTextcolor} width="20px" height="20px" duration="1s" />
+// //                     </div>
+// //                 );
+// //             } else {
+// //                 return (
+// //                     <span class="w-100 allcentered">
+// //                         {sectionproperties.cartBtn_iconFontSize != 0 && (
+// //                             <i class={langdetect == 'en' ? 'h-100 mr-2 d-flex align-items-center justify-content-center' : 'h-100 ml-2 d-flex align-items-center justify-content-center'}>
+// //                                 {sectionproperties.carticonstyle == 'Shopping bag 1' && <FiShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                                 {sectionproperties.carticonstyle == 'Shopping bag 2' && <CgShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                                 {sectionproperties.carticonstyle == 'Shopping bag 3' && <BsBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                                 {sectionproperties.carticonstyle == 'Shopping bag 4' && <RiHandbagLine size={sectionproperties.cartBtn_iconFontSize} />}
+// //                                 {sectionproperties.carticonstyle == 'Shopping cart 1' && <FiShoppingCart class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                                 {sectionproperties.carticonstyle == 'Shopping cart 2' && <MdAddShoppingCart size={sectionproperties.cartBtn_iconFontSize} />}
+// //                             </i>
+// //                         )}
+// //                         {item.productid != '6811f1adebacc' && item.productid != '6811f2c05bd7f'
+// //                             ? langdetect == 'en'
+// //                                 ? sectionproperties.cartBtnContentenglish
+// //                                 : sectionproperties.cartBtnContentarabic
+// //                             : langdetect == 'en'
+// //                             ? 'COMING SOON'
+// //                             : 'قريباً'}
+// //                     </span>
+// //                 );
+// //             }
+// //         }
+// //         if (!AddtoCartMutationContext.isLoading) {
+// //             return (
+// //                 <span class="w-100 allcentered">
+// //                     <i class={langdetect == 'en' ? 'h-100 mr-2 d-flex align-items-center justify-content-center' : 'h-100 ml-2 d-flex align-items-center justify-content-center'}>
+// //                         {sectionproperties.carticonstyle == 'Shopping bag 1' && <FiShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                         {sectionproperties.carticonstyle == 'Shopping bag 2' && <CgShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                         {sectionproperties.carticonstyle == 'Shopping bag 3' && <BsBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                         {sectionproperties.carticonstyle == 'Shopping bag 4' && <RiHandbagLine size={sectionproperties.cartBtn_iconFontSize} />}
+// //                         {sectionproperties.carticonstyle == 'Shopping cart 1' && <FiShoppingCart class="" size={sectionproperties.cartBtn_iconFontSize} />}
+// //                         {sectionproperties.carticonstyle == 'Shopping cart 2' && <MdAddShoppingCart size={sectionproperties.cartBtn_iconFontSize} />}
+// //                     </i>
+// //                     {item.productid != '6811f1adebacc' && item.productid != '6811f2c05bd7f'
+// //                         ? langdetect == 'en'
+// //                             ? sectionproperties.cartBtnContentenglish
+// //                             : sectionproperties.cartBtnContentarabic
+// //                         : langdetect == 'en'
+// //                         ? 'COMING SOON'
+// //                         : 'قريباً'}
+// //                     {/* {langdetect == 'en' ? sectionproperties.cartBtnContentenglish : sectionproperties.cartBtnContentarabic} */}
+// //                 </span>
+// //             );
+// //         }
+// //     };
+// //     const addtocartfuncquantity = (type, quantity) => {
+// //         const addtocardpayloadobj = {
+// //             functype: 'add',
+// //             productid: item.productid,
+// //             variantid: '',
+// //             quantity: quantity,
+// //         };
+
+// //         var runfunc = false;
+// //         if (addtocardpayloadobj.productid.length != 0 && addtocardpayloadobj.quantity > 0) {
+// //             if (item.hasvariants == 1) {
+// //                 if (addtocardpayloadobj.variantid.length != 0) {
+// //                     runfunc = true;
+// //                 } else {
+// //                     NotificationManager.warning('', langdetect == 'en' ? 'Please Choose Product Options' : 'من فضلك اختر متغير');
+// //                 }
+// //             } else {
+// //                 runfunc = true;
+// //             }
+// //         } else {
+// //             NotificationManager.warning('', langdetect == 'en' ? 'Please Choose Quantity' : 'من فضلك اختر الكمية');
+// //         }
+
+// //         if (runfunc == true) {
+// //             AddtoCartContext(addtocardpayloadobj);
+// //         }
+// //     };
+// //     const addtocartbuttonrenderquantity = () => {
+// //         if (AddtoCartMutationContext.isLoading) {
+// //             if (AddtoCartMutationContext?.variables?.productid == item.productid) {
+// //                 return (
+// //                     <div class={' d-flex align-items-center justify-content-center '}>
+// //                         <CircularProgress color={sectionproperties.cartBtnbgColor} width="20px" height="20px" duration="1s" />
+// //                     </div>
+// //                 );
+// //             } else {
+// //                 return item.quantity;
+// //             }
+// //         }
+// //         if (!AddtoCartMutationContext.isLoading) {
+// //             return item.quantity;
+// //         }
+// //     };
+// //     const Image = (type) => {
+// //         var transition = false;
+// //         if (sectionproperties.hideshowcardtransition == 'Show' && type != 'responsive') {
+// //             transition = true;
+// //         }
+
+// //         return (
+// //             <div class={card_cssstyles.imagediv + ' w-100 cursor-pointer '} style={{ position: 'relative' }}>
+// //                 <Imagekitimagecomp
+// //                     class={transition ? cardstyles.intialimage : ''}
+// //                     urlEndpoint={ikimagecredcontext?.ikimageendpoint}
+// //                     publicKey={ikimagecredcontext?.ikimagepublickey}
+// //                     path={'/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.image}
+// //                     loading="lazy"
+// //                     style={{
+// //                         width: sectionproperties.imageInnerWidth_Height + '%',
+// //                         height: sectionproperties.imageInnerWidth_Height + '%',
+// //                         objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+// //                     }}
+// //                 />
+// //                 {transition && (
+// //                     <Imagekitimagecomp
+// //                         class={cardstyles.secondaryimage}
+// //                         urlEndpoint={ikimagecredcontext?.ikimageendpoint}
+// //                         publicKey={ikimagecredcontext?.ikimagepublickey}
+// //                         path={'/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + secondimage}
+// //                         loading="lazy"
+// //                         style={{
+// //                             width: sectionproperties.imageInnerWidth_Height + '%',
+// //                             height: sectionproperties.imageInnerWidth_Height + '%',
+// //                             objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+// //                         }}
+// //                     />
+// //                 )}
+// //             </div>
+// //         );
+// //     };
+// //     const [clickCount, setClickCount] = useState(0);
+// //     const handleClick = () => {
+// //         // Increase the click count by 1
+// //         setClickCount((prevCount) => prevCount + 1);
+
+// //         // Check if it's the second click
+// //         if (sectionproperties.hideshowcardtransition == 'Show') {
+// //             if (clickCount === 1) {
+// //                 // Do whatever you want on the second click
+// //                 var productidtobesend = null;
+// //                 if (sectionproperties.urlwithproductname == 'Yes') {
+// //                     productidtobesend = item.productendpointurl;
+// //                 } else {
+// //                     productidtobesend = item.productid;
+// //                 }
+// //                 cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //             }
+// //         } else {
+// //             var productidtobesend = null;
+// //             if (sectionproperties.urlwithproductname == 'Yes') {
+// //                 productidtobesend = item.productendpointurl;
+// //             } else {
+// //                 productidtobesend = item.productid;
+// //             }
+// //             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //         }
+// //     };
+// //     const PillContainer = () => {
+// //         return (
+// //             <div
+// //                 class={sectionproperties.pillwidth == 0 ? ' px-2 allcentered' : 'allcentered'}
+// //                 style={{
+// //                     zIndex: 2,
+
+// //                     width: sectionproperties.pillwidth == 0 ? 'auto' : sectionproperties.pillwidth + 'px',
+// //                     height: sectionproperties.pillheight + 'px',
+// //                     background: sectionproperties.pillbgcolor,
+// //                     borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px',
+// //                 }}
+// //             >
+// //                 {sectionproperties.countertype == 'Percentage' && (
+// //                     <p class="m-0 p-0" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
+// //                         {'-' + parseFloat(Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0).toFixed(0) + '%'}
+// //                     </p>
+// //                 )}
+// //                 {sectionproperties.countertype == 'Value' && (
+// //                     <p class="m-0 p-0 text-uppercase" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
+// //                         {langdetect == 'en' ? 'Save' : 'وفر'} {langdetect == 'en' ? item.currencyname : ''}{' '}
+// //                         {parseFloat(Math.round(parseInt(item.defaultprice) - parseInt(item.defaultsaleprice))).toFixed(0)} {langdetect == 'en' ? '' : item.currencyname}
+// //                     </p>
+// //                 )}
+// //             </div>
+// //         );
+// //     };
+// //     return (
+// //         <div
+// //             class={
+// //                 props.sectiontypeprops2 == 'vertical'
+// //                     ? sectionproperties.card_marginLeft == 0 && sectionproperties.card_marginRight == 0
+// //                         ? `${card_cssstyles.productcard}` + ' w-100 '
+// //                         : `${card_cssstyles.productcard}` + ' w-100 px-md-1 '
+// //                     : ` ${card_cssstyles.productcard}`
+// //             }
+// //             style={{
+// //                 paddingLeft: langdetect == 'en' ? sectionproperties.card_marginLeft + 'px' : sectionproperties.card_marginRight + 'px',
+// //                 paddingRight: langdetect == 'en' ? sectionproperties.card_marginRight + 'px' : sectionproperties.card_marginLeft + 'px',
+// //             }}
+// //         >
+// //             <div class={card_cssstyles.cardconttt + ' cursor-pointer w-100 '} style={{}}>
+// //                 {sectionproperties.image_show == 'show' && (
+// //                     <div class={card_cssstyles.icontainer + ' w-100 '} style={{ position: 'relative' }}>
+// //                         {sectionproperties.btnswithtransition == 'With Transition' && (
+// //                             <div class={`${card_cssstyles.iconsContainer}` + ' iconsContainer p-0 d-flex '}>
+// //                                 {sectionproperties.favBtnShow == 'Show' && (
+// //                                     <button
+// //                                         class={` ${card_cssstyles.wishlist_btn}` + ' mt-2 mb-2 '}
+// //                                         onClick={() => {
+// //                                             addtofavoritescontext(item.productid);
+// //                                         }}
+// //                                     >
+// //                                         {item.IsFavExists && (
+// //                                             <i class="h-100 d-flex align-items-center justify-content-center icon">
+// //                                                 {sectionproperties.faviconshape == 'Star Shape' && (
+// //                                                     <AiFillStar size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} />
+// //                                                 )}
+// //                                                 {sectionproperties.faviconshape == 'Heart Shape' && (
+// //                                                     <FaHeart size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} />
+// //                                                 )}
+// //                                             </i>
+// //                                         )}
+// //                                         {!item.IsFavExists && (
+// //                                             <i class="h-100 d-flex align-items-center justify-content-center icon">
+// //                                                 {sectionproperties.faviconshape == 'Star Shape' && <AiOutlineStar size={sectionproperties.favBtnIconfontsize} />}
+// //                                                 {sectionproperties.faviconshape == 'Heart Shape' && <FaRegHeart size={sectionproperties.favBtnIconfontsize} />}
+// //                                             </i>
+// //                                         )}
+// //                                     </button>
+// //                                 )}
+
+// //                                 {sectionproperties.showproductinfomodalbtn == 'Show' && (
+// //                                     <button
+// //                                         class={`${card_cssstyles.wishlist_btn}` + '  '}
+// //                                         onClick={(e) => {
+// //                                             e.stopPropagation();
+// //                                             setShowProductInfoModalContext(true);
+// //                                             setProductIdProdutInfoModalContext(item.productid);
+// //                                         }}
+// //                                     >
+// //                                         <i class="h-100 d-flex align-items-center justify-content-center icon">
+// //                                             <BsEye size={sectionproperties.generalbtn_fontsize} />
+// //                                         </i>
+// //                                     </button>
+// //                                 )}
+// //                             </div>
+// //                         )}
+// //                         {sectionproperties.favBtnShow == 'Show' && sectionproperties.btnswithtransition != 'With Transition' && (
+// //                             <button
+// //                                 class={` ${card_cssstyles.wishlist_btn}` + ' m-0 p-0 d-flex align-items-center justify-content-center '}
+// //                                 onClick={(e) => {
+// //                                     e.stopPropagation();
+// //                                     addtofavoritescontext(item.productid);
+// //                                 }}
+// //                                 style={{
+// //                                     zIndex: 2,
+// //                                     position: 'absolute',
+// //                                     top: 5,
+// //                                     right: 5,
+// //                                     // left: langdetect == 'en' ? '' : 5,
+// //                                     background: item.IsFavExists == true ? (sectionproperties.favbtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.activebgcolor) : '',
+// //                                 }}
+// //                             >
+// //                                 {item.IsFavExists && (
+// //                                     <i class="h-100 d-flex align-items-center justify-content-center">
+// //                                         {sectionproperties.faviconshape == 'Star Shape' && (
+// //                                             <AiFillStar size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} class="font-md-20" />
+// //                                         )}
+// //                                         {sectionproperties.faviconshape == 'Heart Shape' && (
+// //                                             <FaHeart size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} />
+// //                                         )}
+// //                                     </i>
+// //                                 )}
+// //                                 {!item.IsFavExists && (
+// //                                     <i class="h-100 d-flex align-items-center justify-content-center">
+// //                                         {sectionproperties.faviconshape == 'Star Shape' && <AiOutlineStar size={sectionproperties.favBtnIconfontsize} />}
+// //                                         {sectionproperties.faviconshape == 'Heart Shape' && <FaRegHeart size={sectionproperties.favBtnIconfontsize} />}
+// //                                     </i>
+// //                                 )}
+// //                             </button>
+// //                         )}
+// //                         {/* urlwithproductname */}
+// //                         {item?.hassale == 1 && sectionproperties.showbadge == 'Show' && (
+// //                             <div
+// //                                 class="allcentered"
+// //                                 style={{
+// //                                     zIndex: 2,
+// //                                     position: 'absolute',
+// //                                     top: sectionproperties.badgeposition == 'Top' ? sectionproperties.badge_top + 'px' : '',
+// //                                     bottom: sectionproperties.badgeposition == 'Bottom' ? sectionproperties.badge_top + 'px' : '',
+// //                                     left: sectionproperties.badge_right + 'px',
+// //                                     // right: langdetect == 'en' ? '' : sectionproperties.badge_right + 'px',
+// //                                     width: sectionproperties.badge_width == 0 ? '90%' : sectionproperties.badge_width + 'px',
+// //                                     height: sectionproperties.badge_height + 'px',
+// //                                     background: sectionproperties.badge_bgcolor,
+// //                                     borderRadius: sectionproperties.badge_borderradius + 'px',
+// //                                 }}
+// //                             >
+// //                                 <p class="m-0 p-0" style={{ color: sectionproperties.badge_color, fontSize: sectionproperties.badge_fontsize + 'px' }}>
+// //                                     {langdetect == 'en' ? sectionproperties.badgeContentEn : sectionproperties.badgeContentAr}
+// //                                 </p>
+// //                             </div>
+// //                         )}
+// //                         {sectionproperties.showpill == 'Show' && item.hassale == 1 && sectionproperties.counterposition == 'Top' && (
+// //                             <div
+// //                                 style={{
+// //                                     position: 'absolute',
+// //                                     top: sectionproperties.pillpositionfromtop + 'px',
+// //                                     left: sectionproperties.pillpositionfromright + 'px',
+// //                                     // right: langdetect == 'en' ? '' : sectionproperties.pillpositionfromright + 'px',
+// //                                     zIndex: 3,
+// //                                 }}
+// //                             >
+// //                                 {PillContainer()}
+// //                             </div>
+// //                         )}
+// //                         {item?.producttags != undefined && item?.producttags?.length != 0 && sectionproperties.showtag == 'Show' && (
+// //                             <div class="allcentered" style={{ position: 'absolute', bottom: 20, width: '100%', left: 0, right: 0, zIndex: 100 }}>
+// //                                 <div
+// //                                     class="px-3 py-1"
+// //                                     style={{
+// //                                         width: 'fit-content',
+// //                                         background: sectionproperties.tagbackgroundcolor,
+// //                                         borderRadius: sectionproperties.tagborderradius + 'px',
+// //                                         color: sectionproperties.tagcolor,
+// //                                         fontSize: 12,
+// //                                     }}
+// //                                 >
+// //                                     {item?.producttags[0]?.taginfo?.tagname}
+// //                                 </div>
+// //                             </div>
+// //                         )}
+// //                         <div
+// //                             class={
+// //                                 sectionproperties.hideshowcardtransition == 'Show'
+// //                                     ? ` ${card_cssstyles.productcardimagecont} ${cardstyles.imagecontainer}` + ' d-flex d-md-none '
+// //                                     : ` ${card_cssstyles.productcardimagecont} ` + ' d-flex d-md-none '
+// //                             }
+// //                             style={{
+// //                                 marginBottom: sectionproperties.image_mb + 'px',
+// //                             }}
+// //                             onClick={(e) => {
+// //                                 if (sectionproperties.sectionproperties?.onClickRoute == 'None') {
+// //                                 } else {
+// //                                     e.stopPropagation();
+// //                                     var productidtobesend = null;
+// //                                     if (sectionproperties.urlwithproductname == 'Yes') {
+// //                                         productidtobesend = item.productendpointurl;
+// //                                     } else {
+// //                                         productidtobesend = item.productid;
+// //                                     }
+// //                                     cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //                                 }
+// //                             }}
+// //                         >
+// //                             {Image('normal')}
+// //                         </div>
+// //                         <div
+// //                             class={
+// //                                 sectionproperties.hideshowcardtransition == 'Show'
+// //                                     ? ` ${card_cssstyles.productcardimagecont} ${cardstyles.imagecontainer}` + ' d-none d-md-flex '
+// //                                     : ` ${card_cssstyles.productcardimagecont} ` + ' d-none d-md-flex '
+// //                             }
+// //                             style={{
+// //                                 marginBottom: sectionproperties.image_mb + 'px',
+// //                             }}
+// //                             onClick={(e) => {
+// //                                 if (sectionproperties?.onClickRoute == 'None') {
+// //                                 } else {
+// //                                     handleClick();
+// //                                 }
+// //                             }}
+// //                         >
+// //                             {Image('normal')}
+// //                         </div>
+// //                         {item.currentquantity < 1 && sectionproperties.showoutofstock == 'Show' && item.quantavailtype == 'limit' && item.hasvariants == 0 && (
+// //                             <div class={`${card_cssstyles.outstockbadge}` + ' allcentered '}>
+// //                                 <p class="m-0 p-0">{langdetect == 'en' ? sectionproperties.outstock_contenten : sectionproperties.outstock_contentar}</p>
+// //                             </div>
+// //                         )}
+// //                         {sectionproperties.shownameonhover == 'Yes' && (
+// //                             <div class={card_cssstyles.pinfohover + ' col-lg-12 pl-0 pr-0 allcentered h-100 pinfohover '} style={{}}>
+// //                                 <p
+// //                                     onClick={() => {
+// //                                         if (sectionproperties?.onClickRoute == 'None') {
+// //                                         } else {
+// //                                             var productidtobesend = null;
+// //                                             if (sectionproperties.urlwithproductname == 'Yes') {
+// //                                                 productidtobesend = item.productendpointurl;
+// //                                             } else {
+// //                                                 productidtobesend = item.productid;
+// //                                             }
+// //                                             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //                                         }
+// //                                     }}
+// //                                     class={
+// //                                         sectionproperties.wordbreak == '1'
+// //                                             ? `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak1 font-md-13 m-0 '
+// //                                             : `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak2 font-md-13 wordbreak-md-4 m-0 '
+// //                                     }
+// //                                     style={{
+// //                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                     }}
+// //                                 >
+// //                                     {item.name}
+// //                                 </p>
+// //                             </div>
+// //                         )}
+// //                     </div>
+// //                 )}
+// //                 <div>
+// //                     <div class={card_cssstyles.innersection + ' row m-0 w-100 '} style={{}}>
+// //                         {sectionproperties.showfeatures == 'Show' && (
+// //                             <div class="allcentered col-lg-12 p-0" style={{ height: 40 }}>
+// //                                 <Imagekitimagecomp
+// //                                     urlEndpoint={ikimagecredcontext?.ikimageendpoint}
+// //                                     publicKey={ikimagecredcontext?.ikimagepublickey}
+// //                                     path={item?.feature_image_url}
+// //                                     loading="lazy"
+// //                                     style={{
+// //                                         maxWidth: '50%',
+// //                                         maxHeight: '50%',
+// //                                     }}
+// //                                 />
+// //                                 <div
+// //                                     class="text-capitalize mx-2"
+// //                                     style={{
+// //                                         color: sectionproperties.featurecolor,
+// //                                         fontSize: sectionproperties.featurefontsize + 'px',
+// //                                     }}
+// //                                 >
+// //                                     {item?.productfeature != undefined && item?.productfeature != null ? item?.productfeature : ''}
+// //                                 </div>
+// //                             </div>
+// //                         )}
+// //                         {sectionproperties.showmeasurementunit == 'Show' && (
+// //                             <p
+// //                                 class={`${card_cssstyles.productDescStyles}` + ' col-lg-12 wordbreak wordbreak1 p-0 mb-2 '}
+// //                                 style={{
+// //                                     textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                     fontSize: sectionproperties.measurementunitfontsize + 'px',
+// //                                     color: sectionproperties.measurementunitcolor,
+// //                                 }}
+// //                             >
+// //                                 {item.measurmentunit}
+// //                             </p>
+// //                         )}
+
+// //                         {sectionproperties.prodNameShow == 'Show' && (
+// //                             <div
+// //                                 class="col-lg-12 pl-0 pr-0"
+// //                                 style={{
+// //                                     minHeight: sectionproperties.wordbreak == '1' ? 'auto' : '6vh',
+// //                                     background: sectionproperties.prodNameBackgroundColor,
+// //                                     borderRadius: '15px',
+// //                                     paddingTop: sectionproperties.productnamepaddingvertical + 'px',
+// //                                     paddingBottom: sectionproperties.productnamepaddingvertical + 'px',
+// //                                 }}
+// //                             >
+// //                                 <p
+// //                                     onClick={() => {
+// //                                         if (sectionproperties?.onClickRoute == 'None') {
+// //                                         } else {
+// //                                             var productidtobesend = null;
+// //                                             if (sectionproperties.urlwithproductname == 'Yes') {
+// //                                                 productidtobesend = item.productendpointurl;
+// //                                             } else {
+// //                                                 productidtobesend = item.productid;
+// //                                             }
+// //                                             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //                                         }
+// //                                     }}
+// //                                     class={
+// //                                         sectionproperties.wordbreak == '1'
+// //                                             ? `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak1 font-md-13 m-0 pname '
+// //                                             : `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak2 font-md-13 wordbreak-md-4 m-0 pname '
+// //                                     }
+// //                                     style={{
+// //                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                     }}
+// //                                 >
+// //                                     {item.name}
+// //                                 </p>
+// //                             </div>
+// //                         )}
+// //                         {sectionproperties.showSKU == 'Show' && (
+// //                             <div class="col-lg-12 pl-0 pr-0" style={{}}>
+// //                                 <p
+// //                                     class={`${card_cssstyles.sku}` + '  wordbreak wordbreak1 font-md-13 m-0 '}
+// //                                     style={{
+// //                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                     }}
+// //                                 >
+// //                                     {langdetect == 'en' ? 'SKU: ' : 'كود: '}
+// //                                     {item.sku}
+// //                                 </p>
+// //                             </div>
+// //                         )}
+// //                         {sectionproperties.prodCatShow == 'Show' && sectionproperties.descriptionoverwritestyles == 'No' && (
+// //                             <p
+// //                                 class={
+// //                                     sectionproperties.descriptionwordbreak == 'None'
+// //                                         ? `${card_cssstyles.productDescStyles}` + ' col-lg-12 p-0   mt-1 '
+// //                                         : `${card_cssstyles.productDescStyles}` + ' col-lg-12 p-0 wordbreak wordbreak4 mt-1 '
+// //                                 }
+// //                                 style={{
+// //                                     textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                 }}
+// //                                 dangerouslySetInnerHTML={{ __html: item.shortdescription }}
+// //                             >
+// //                                 {/* {plainString(langdetect == 'en' ? item.description_en : item.description_ar)} */}
+// //                             </p>
+// //                         )}
+// //                         {sectionproperties.prodCatShow == 'Show' && sectionproperties.descriptionoverwritestyles == 'Yes' && (
+// //                             <p
+// //                                 class={
+// //                                     sectionproperties.descriptionwordbreak == 'None'
+// //                                         ? `${card_cssstyles.productDescStyles}` + ' col-lg-12  p-0 mt-1 '
+// //                                         : `${card_cssstyles.productDescStyles}` + ' col-lg-12 wordbreak wordbreak p-0 mt-1 '
+// //                                 }
+// //                                 style={{
+// //                                     textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                 }}
+// //                             >
+// //                                 {plainString(item.shortdescription)}
+// //                             </p>
+// //                         )}
+
+// //                         <div
+// //                             style={{
+// //                                 flexDirection: 'column',
+
+// //                                 display:
+// //                                     sectionproperties.prodPriceShow == 'Hide' &&
+// //                                     sectionproperties.showprofitcontainer == 'Hide' &&
+// //                                     sectionproperties.cartBtnShow == 'Hide' &&
+// //                                     sectionproperties.prodsalePriceshow == 'Hide'
+// //                                         ? 'none'
+// //                                         : 'flex',
+// //                             }}
+// //                             class="col-lg-12 d-flex align-items-center justify-content-center p-0 mt-1 "
+// //                         >
+// //                             <div class="row m-0 w-100 ">
+// //                                 <div
+// //                                     class=" d-flex flex-row col-lg-12 mx-0 p-0 align-items-center "
+// //                                     style={{
+// //                                         justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                         marginTop: sectionproperties.productpricemarginTop + 'px',
+// //                                         marginBottom: sectionproperties.productpricemarginBottom + 'px',
+// //                                     }}
+// //                                 >
+// //                                     <div
+// //                                         class={
+// //                                             sectionproperties.priceDirection == 'Horizontal Direction'
+// //                                                 ? ' d-flex align-items-center p-0 mb-0 flex-row '
+// //                                                 : ' d-flex align-items-center p-0 mb-0 flex-column '
+// //                                         }
+// //                                         style={{
+// //                                             textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+// //                                             minHeight: sectionproperties.priceDirection == 'Horizontal Direction' ? '' : '6.5vh',
+// //                                         }}
+// //                                     >
+// //                                         {/* {sectionproperties.prodPriceShow == 'Show' && sectionproperties.removedecimals == 'Hide' && (
+// //                                                 <p
+// //                                                     class={
+// //                                                         sectionproperties.priceDirection == 'Horizontal Direction'
+// //                                                             ? `${card_cssstyles.productPricestyles}` + ' m-0 '
+// //                                                             : `${card_cssstyles.productPricestyles}` + ' m-0 '
+// //                                                     }
+// //                                                 >
+// //                                                     {langdetect == 'en' ? item.currencyname : ''}{' '}
+// //                                                     {item.hassale == 1 ? parseFloat(Number(item.defaultsaleprice).toFixed(2)) : parseFloat(Number(item.defaultprice).toFixed(2))}{' '}
+// //                                                     {langdetect == 'en' ? '' : item.currencyname}
+// //                                                 </p>
+// //                                             )} */}
+// //                                         {sectionproperties.prodPriceShow == 'Show' && (
+// //                                             <p
+// //                                                 class={
+// //                                                     sectionproperties.priceDirection == 'Horizontal Direction'
+// //                                                         ? `${card_cssstyles.productPricestyles}` + ' m-0 '
+// //                                                         : `${card_cssstyles.productPricestyles}` + ' m-0 '
+// //                                                 }
+// //                                             >
+// //                                                 {langdetect == 'en' ? item.currencyname : ''} {item.hassale == 1 ? item.defaultsaleprice : item.defaultprice}{' '}
+// //                                                 {langdetect == 'en' ? '' : item.currencyname}
+// //                                             </p>
+// //                                         )}
+// //                                         {sectionproperties.prodsalePriceshow == 'Show' && item.hassale == 1 && (
+// //                                             <div class={sectionproperties.priceDirection == 'Horizontal' ? ' d-flex align-items-center p-0 mb-0 ' : ' d-flex align-items-center p-0 mb-0'}>
+// //                                                 <p class={`${card_cssstyles.productSalePricestyles}` + ' linethrough m-0 mr-2 ml-2 '}>
+// //                                                     {langdetect == 'en' ? item.currencyname : ''} {item.defaultprice} {langdetect == 'en' ? '' : item.currencyname}
+// //                                                 </p>
+// //                                             </div>
+// //                                         )}
+// //                                         {/* {sectionproperties.prodsalePriceshow == 'Show' && item.hassale == 1 && sectionproperties.removedecimals == 'Hide' && (
+// //                                                 <div class={sectionproperties.priceDirection == 'Horizontal' ? ' d-flex align-items-center p-0 mb-0 ' : ' d-flex align-items-center p-0 mb-0'}>
+// //                                                     <p class={`${card_cssstyles.productSalePricestyles}` + ' linethrough m-0 mr-2 ml-2 '}>
+// //                                                         {langdetect == 'en' ? item.currencyname : ''} {parseFloat(Number(item.defaultprice).toFixed(2))} {langdetect == 'en' ? '' : item.currencyname}
+// //                                                     </p>
+// //                                                 </div>
+// //                                             )} */}
+// //                                         {sectionproperties.showpill == 'Show' && item.hassale == 1 && sectionproperties.counterposition == 'Besides Sale Price' && (
+// //                                             <div style={{}}>{PillContainer()}</div>
+// //                                         )}
+// //                                     </div>
+// //                                 </div>
+// //                                 {sectionproperties.showvariantscont == 'Show' && (
+// //                                     <div class="col-12 p-0">
+// //                                         <Variants_J_Cards
+// //                                             actions={{
+// //                                                 sectionproperties: sectionproperties,
+// //                                                 item: item,
+// //                                                 cardonclickfunctionContext: cardonclickfunctionContext,
+// //                                                 fetchingtypeprops: props.fetchingtypeprops,
+// //                                             }}
+// //                                             foundMatchedVariantFunc={(variantCompletedObj) => {
+// //                                                 setvariantObj(variantCompletedObj);
+// //                                             }}
+// //                                             foundImageColorMatchingFunc={(variantIMAGECompletedObj) => {
+// //                                                 setVariant_Color_ImageObj(variantIMAGECompletedObj);
+// //                                             }}
+// //                                         />
+// //                                     </div>
+// //                                 )}
+// //                                 {sectionproperties.showprofitcontainer == 'Show' && (
+// //                                     <div
+// //                                         class="col-lg-12 p-0"
+// //                                         style={{
+// //                                             justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                         }}
+// //                                     >
+// //                                         <div
+// //                                             class={card_cssstyles.profitcontainer + ' d-flex align-items-center flex-sm-column px-2'}
+// //                                             style={{
+// //                                                 justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                             }}
+// //                                         >
+// //                                             <p
+// //                                                 class={' m-0 p-0 d-flex align-items-center '}
+// //                                                 style={{
+// //                                                     justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                                 }}
+// //                                             >
+// //                                                 <span
+// //                                                     style={{
+// //                                                         fontWeight: sectionproperties.profitcontainerfontweight,
+// //                                                     }}
+// //                                                 >
+// //                                                     {langdetect == 'en' ? sectionproperties.profitcontainercontenten : sectionproperties.profitcontainercontentar}:{' '}
+// //                                                 </span>
+// //                                                 <span
+// //                                                     class="mx-1"
+// //                                                     style={{
+// //                                                         fontWeight: sectionproperties.profitcontainersecondaryfontweight,
+// //                                                     }}
+// //                                                 >
+// //                                                     {langdetect == 'en' ? item.currencyname : ''}{' '}
+// //                                                     {parseFloat(Math.round(parseInt(item.hassale == 1 ? item.defaultsaleprice : item.defaultprice) * (item.prodaffpercentprofit / 100))).toFixed(0)}{' '}
+// //                                                     {langdetect == 'en' ? '' : item.currencyname}
+// //                                                 </span>
+// //                                             </p>
+// //                                         </div>
+// //                                     </div>
+// //                                 )}
+// //                                 {sectionproperties.quantityshow == 'Show' && item.currentquantity > 0 && (
+// //                                     <div
+// //                                         class="col-lg-12 p-0 d-flex align-items-center"
+// //                                         style={{
+// //                                             justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                         }}
+// //                                     >
+// //                                         <p
+// //                                             class="m-0 p-0"
+// //                                             style={{
+// //                                                 fontSize: sectionproperties.quantityfontsize,
+// //                                                 color: sectionproperties.quantitycolor,
+// //                                                 fontWeight: sectionproperties.quantityfontweight,
+// //                                             }}
+// //                                         >
+// //                                             {langdetect == 'en' ? sectionproperties.qtytextinen : sectionproperties.qtytextinar} {item.currentquantity}{' '}
+// //                                             {langdetect == 'en' ? sectionproperties.qtytextinen2 : sectionproperties.qtytextinar2}
+// //                                         </p>
+// //                                     </div>
+// //                                 )}
+// //                                 {sectionproperties.cartBtnShow == 'Show' && showquantity == false && (
+// //                                     <div
+// //                                         class="col-lg-12 p-0 d-flex align-items-center"
+// //                                         style={{
+// //                                             justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                         }}
+// //                                     >
+// //                                         <p
+// //                                             class={`${card_cssstyles.cart_btn}` + ' m-0 p-0 d-flex align-items-center justify-content-center mt-1 '}
+// //                                             onClick={() => {
+// //                                                 if (authdetailsContext?.instinfo?.contactinfo.instid == '67d6bda67adf6') {
+// //                                                     setshowquantity(true);
+// //                                                 } else {
+// //                                                     if (sectionproperties.showvariantscont == 'Show') {
+// //                                                         addtocartfunc();
+// //                                                     } else {
+// //                                                         if (sectionproperties.automaticaddtocart == 'Yes' && item.hasvariants == 0) {
+// //                                                             addtocartfunc();
+// //                                                         } else if (sectionproperties.automaticaddtocart == 'Yes' && item.hasvariants == 1) {
+// //                                                             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //                                                         } else {
+// //                                                             var productidtobesend = null;
+// //                                                             if (sectionproperties.urlwithproductname == 'Yes') {
+// //                                                                 productidtobesend = item.productendpointurl;
+// //                                                             } else {
+// //                                                                 productidtobesend = item.productid;
+// //                                                             }
+// //                                                             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+// //                                                         }
+// //                                                     }
+// //                                                 }
+// //                                             }}
+// //                                         >
+// //                                             {addtocartbuttonrender()}
+// //                                         </p>
+// //                                     </div>
+// //                                 )}
+// //                                 {showquantity == true && (
+// //                                     <div class="col-lg-12 p-0 d-flex align-items-center allcentered">
+// //                                         <div class={`${card_cssstyles.quantitybtn}` + ' p-0 d-flex align-items-center justify-content-center '} style={{ direction: 'ltr' }}>
+// //                                             <button
+// //                                                 class={`${card_cssstyles.minus_quantitybtn_icon_container}`}
+// //                                                 onClick={() => {
+// //                                                     if (item.hasvariants == 0) {
+// //                                                         var tempitem = { ...item };
+// //                                                         tempitem.quantity = parseInt(tempitem.quantity);
+// //                                                         tempitem.quantity = tempitem.quantity - 1;
+// //                                                         if (tempitem.quantity <= 0) {
+// //                                                             tempitem.quantity = 0;
+// //                                                         }
+// //                                                         setitem({ ...tempitem });
+// //                                                         addtocartfuncquantity('add', tempitem.quantity);
+// //                                                     } else {
+// //                                                         setShowProductInfoModalContext(true);
+// //                                                         setProductIdProdutInfoModalContext(item.productid);
+// //                                                     }
+// //                                                 }}
+// //                                                 disabled={AddtoCartMutationContext.isLoading == true ? true : false}
+// //                                             >
+// //                                                 <i class="h-100 allcentered minusbtn">
+// //                                                     <FiMinus />
+// //                                                 </i>
+// //                                             </button>
+// //                                             <span
+// //                                                 class={' d-flex align-items-center justify-content-center '}
+// //                                                 style={{
+// //                                                     fontSize: 14,
+// //                                                     fontWeight: 500,
+// //                                                     color: sectionproperties.cartBtnbgColor,
+// //                                                     flex: 1,
+// //                                                 }}
+// //                                             >
+// //                                                 {addtocartbuttonrenderquantity()}
+// //                                             </span>
+// //                                             <button
+// //                                                 class={`${card_cssstyles.minus_quantitybtn_icon_container}`}
+// //                                                 onClick={() => {
+// //                                                     if (item.hasvariants == 0) {
+// //                                                         var tempitem = { ...item };
+// //                                                         tempitem.quantity = parseInt(tempitem.quantity);
+// //                                                         tempitem.quantity = tempitem.quantity + 1;
+// //                                                         if (tempitem.quantity <= 0) {
+// //                                                             tempitem.quantity = 0;
+// //                                                         }
+// //                                                         setitem({ ...tempitem });
+// //                                                         addtocartfuncquantity('add', tempitem.quantity);
+// //                                                     } else {
+// //                                                         setShowProductInfoModalContext(true);
+// //                                                         setProductIdProdutInfoModalContext(item.productid);
+// //                                                     }
+// //                                                 }}
+// //                                                 disabled={AddtoCartMutationContext.isLoading == true ? true : false}
+// //                                             >
+// //                                                 <i class="h-100 allcentered addbtn">
+// //                                                     <FiPlus />
+// //                                                 </i>
+// //                                             </button>
+// //                                         </div>
+// //                                     </div>
+// //                                 )}
+// //                             </div>
+// //                         </div>
+// //                         {sectionproperties.showrating == 'Show' && item.productcanrate == 1 && (
+// //                             <div
+// //                                 class="col-lg-12 d-flex align-items-center p-0"
+// //                                 style={{
+// //                                     justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+// //                                 }}
+// //                             >
+// //                                 <ReactStars
+// //                                     count={5}
+// //                                     value={item.productoverallrate}
+// //                                     edit={false}
+// //                                     size={16}
+// //                                     emptyIcon={<i className="far fa-star" style={{ color: '#cccccc' }}></i>}
+// //                                     halfIcon={<i className="fa fa-star-half-alt style={{ color: '#FAB400' }}"></i>}
+// //                                     filledIcon={<i className="fa fa-star" style={{ color: '#FAB400' }}></i>}
+// //                                     activeColor="#ffd700"
+// //                                 />
+// //                             </div>
+// //                         )}
+// //                     </div>
+// //                 </div>
+// //             </div>
+// //         </div>
+// //     );
+// // };
+// // export default Simpleproductcard;
+// import React, { useEffect, useState, useContext } from 'react';
+// import { css } from 'glamor';
+// import { Imagekitimagecomp } from '../../../Imagekitconfig.jsx';
+// import { FiShoppingCart } from '@react-icons/all-files/fi/FiShoppingCart';
+// import { FiShoppingBag } from '@react-icons/all-files/fi/FiShoppingBag';
+// import { FaRegHeart } from '@react-icons/all-files/fa/FaRegHeart';
+// import { FaHeart } from '@react-icons/all-files/fa/FaHeart';
+// import { CgShoppingBag } from '@react-icons/all-files/cg/CgShoppingBag';
+// import { AiFillStar } from '@react-icons/all-files/ai/AiFillStar';
+// import { AiOutlineStar } from '@react-icons/all-files/ai/AiOutlineStar';
+// import { MdAddShoppingCart } from '@react-icons/all-files/md/MdAddShoppingCart';
+// import { BsBag } from '@react-icons/all-files/bs/BsBag';
+// import { RiHandbagLine } from '@react-icons/all-files/ri/RiHandbagLine';
+// import ReactStars from 'react-rating-stars-component';
+// import cardstyles from '../../../styles/cards/card23.module.css';
+// import { BsEye } from '@react-icons/all-files/bs/BsEye';
+// import { CircularProgress } from 'react-cssfx-loading';
+// import Variants_J_Cards from '../Variants_J_Cards/Variants_J_Cards.jsx';
+// const Simpleproductcard = (props) => {
+//     const [sectionproperties, setsectionproperties] = useState('');
+//     const [variantObj, setvariantObj] = useState('');
+//     const [item, setitem] = useState(props.cardinfoitemprops);
+//     const StatePagePropertiesContext = props.actions.StatePagePropertiesContext;
+//     const lang = props.actions.lang;
+//     const langdetect = props.actions.langdetect;
+//     const setShowProductInfoModalContext = props.actions.setShowProductInfoModalContext;
+//     const addtofavoritescontext = props.actions.addtofavoritescontext;
+//     const setProductIdProdutInfoModalContext = props.actions.setProductIdProdutInfoModalContext;
+//     const cardonclickfunctionContext = props.actions.cardonclickfunctionContext;
+//     const ikimagecredcontext = props.actions.ikimagecredcontext;
+//     const NotificationManager = props.actions.NotificationManager;
+//     const AddtoCartContext = props.actions.AddtoCartContext;
+//     const AddtoCartMutationContext = props.actions.AddtoCartMutationContext;
+//     const [addtocardpayloadobj, setaddtocardpayloadobj] = useState('');
+//     const [Variant_Color_ImageObj, setVariant_Color_ImageObj] = useState('');
+//     const authdetailsContext = props.actions.authdetailsContext;
+
+//     const plainString = (html) => {
+//         var divContainer = document.createElement('div');
+//         divContainer.innerHTML = html;
+//         return divContainer.textContent || divContainer.innerText || '';
+//     };
+//     useEffect(() => {
+//         var secpropobj = {};
+//         StatePagePropertiesContext.pageobj.sections.forEach(function (sectionitem, sectionindex) {
+//             if (sectionitem.sectionid == props.sectionidprops) {
+//                 sectionitem.sectionproperties.forEach(function (sectionpropertiesobj, sectionpropertiesindex) {
+//                     secpropobj[sectionpropertiesobj.property_css_name] = sectionpropertiesobj.property_value;
+//                 });
+//             }
+//         });
+//         setsectionproperties({ ...secpropobj });
+//     }, [StatePagePropertiesContext]);
+//     useEffect(() => {
+//         setitem(props.cardinfoitemprops);
+//     }, [props.cardinfoitemprops]);
+//     useEffect(() => {
+//         var productImagetoBeSelected = '';
+//         var Tempitem = { ...item };
+//         productImagetoBeSelected = item.productmainimage;
+//         if (variantObj != undefined && variantObj != null && Object.keys(variantObj).length != 0 && variantObj != '') {
+//             var variatgalleryid = variantObj.variantgalleryid;
+//             if (variatgalleryid != undefined && variatgalleryid != null && variatgalleryid != '') {
+//                 item?.productimages?.forEach(function (item, index) {
+//                     if (item.galleryid == variatgalleryid) {
+//                         productImagetoBeSelected = item.path;
+//                     }
+//                 });
+//             }
+//         }
+
+//         Tempitem.image = productImagetoBeSelected;
+//         setitem({ ...Tempitem });
+//     }, [variantObj]);
+//     useEffect(() => {
+//         var productImagetoBeSelected = '';
+//         var Tempitem = { ...item };
+//         productImagetoBeSelected = item.productmainimage;
+//         if (Variant_Color_ImageObj != undefined && Variant_Color_ImageObj != null && Object.keys(Variant_Color_ImageObj).length != 0 && Variant_Color_ImageObj != '') {
+//             var variatgalleryid = Variant_Color_ImageObj.variantgalleryid;
+//             if (variatgalleryid != undefined && variatgalleryid != null && variatgalleryid != '') {
+//                 item?.productimages?.forEach(function (item, index) {
+//                     if (item.galleryid == variatgalleryid) {
+//                         productImagetoBeSelected = item.path;
+//                     }
+//                 });
+//             }
+//         }
+
+//         Tempitem.image = productImagetoBeSelected;
+//         setitem({ ...Tempitem });
+//     }, [Variant_Color_ImageObj]);
+//     const card_cssstyles = {
+//         innersection: css({
+//             paddingLeft: sectionproperties.innersectionpaddinghorizontal + 'px',
+//             paddingRight: sectionproperties.innersectionpaddinghorizontal + 'px',
+//             '@media (max-width: 800px)': {
+//                 paddingLeft: sectionproperties.innersectionpaddinghorizontal == 0 ? 0 : 5,
+//                 paddingRight: sectionproperties.innersectionpaddinghorizontal == 0 ? 0 : 5,
+//             },
+//         }),
+//         productcard: css({
+//             minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
+//             maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.width + 'px',
+//             '@media (max-width: 800px)': {
+//                 minWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + 'px',
+//                 maxWidth: props.sectiontypeprops2 == 'vertical' ? '100%' : sectionproperties.widthresponsive + 'px',
+//             },
+//             ':hover .iconsContainer': {
+//                 opacity: 1,
+//                 transition: 'all, 0.4s',
+//                 right: 10,
+//                 transform: `translateX(0px)`,
+//             },
+//             // ':hover .pname': {
+//             //     textDecoration: 'underline',
+//             //     transition: '.3s',
+//             // },
+//         }),
+//         productcardimagecont: css({
+//             position: 'relative',
+//             overflow: 'hidden',
+//             height: sectionproperties.image_height == 0 ? 'auto' : sectionproperties.image_height + 'px',
+//             background: sectionproperties.image_bgtransparent == 'Transparent' ? '' : sectionproperties.image_bgcolor,
+//             border: sectionproperties.image_borderType == 'All' ? sectionproperties.image_borderwidth + 'px solid ' + sectionproperties.image_bordercolor : 0,
+//             borderBottom: sectionproperties.image_borderwidth + 'px solid ' + sectionproperties.image_bordercolor,
+//             borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
+//             borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
+//             borderTopLeftRadius: langdetect == 'en' ? sectionproperties.image_bordertopleftradius + 'px' : sectionproperties.image_bordertoprightradius + 'px',
+//             borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px',
+//             transition: '.3s',
+//             opacity: item.currentquantity < 1 && sectionproperties.showoutofstock == 'Show' && item.quantavailtype == 'limit' && item.hasvariants == 0 ? 0.4 : 1,
+//             '@media (max-width: 800px)': {
+//                 height:
+//                     sectionproperties.height_responsive == 0
+//                         ? 'auto'
+//                         : sectionproperties.height_responsive != null
+//                         ? sectionproperties.height_responsive + 'px'
+//                         : sectionproperties.image_height + 'px',
+//             },
+//         }),
+//         productNameStyles: css({
+//             color: sectionproperties.prodNameColor,
+//             fontSize: sectionproperties.prodNameFontSize + 'px',
+//             textTransform: sectionproperties.prodNameTextTranform,
+//             fontWeight: sectionproperties.prodNameFontWeight,
+//             transition: '.3s',
+//             cursor: 'pointer',
+//             ':hover': {
+//                 color: sectionproperties.prodNameColorOnHover,
+//             },
+//         }),
+//         productPricestyles: css({
+//             color: sectionproperties.prodPriceColor,
+//             fontSize: sectionproperties.prodpriceFontSize + 'px',
+//             fontWeight: sectionproperties.prodPriceFontWeight,
+//         }),
+//         productSalePricestyles: css({
+//             color: sectionproperties.prodsalePriceColor,
+//             fontSize: sectionproperties.prodsalepriceFontSize + 'px',
+//             fontWeight: sectionproperties.prodsalePriceFontWeight,
+//         }),
+//         wishlist_btn: css({
+//             width: sectionproperties.favBtnWidth + 'px',
+//             height: sectionproperties.favBtnHeight + 'px',
+//             background: sectionproperties.favbtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.favBtnbgColor,
+//             borderRadius: sectionproperties.fav_btn_borderBottomLeftRadius + 'px',
+//             color: sectionproperties.favBtnTextcolor,
+//             fontSize: sectionproperties.favBtnTextfontsize + 'px',
+//             textTransform: sectionproperties.favBtnTexttransform,
+//             fontWeight: sectionproperties.favBtnTextfontweight,
+//             transition: '.3s',
+//             border: sectionproperties.favbtnborderwidth + 'px solid ' + sectionproperties.favbtnbordercolor,
+//             ':hover': {
+//                 background: sectionproperties.favbtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.favBtnbgColoronhover,
+//                 color: sectionproperties.favBtnTextcoloronhover,
+//             },
+//         }),
+//         cart_btn: css({
+//             width: sectionproperties.cartBtnWidth == 0 ? 'auto' : sectionproperties.cartBtnWidth + 'px',
+//             height: sectionproperties.cartBtnHeight + 'px',
+//             background: sectionproperties.cartbtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.cartBtnbgColor,
+//             borderRadius: sectionproperties.cart_btn_borderBottomLeftRadius + 'px',
+//             color: sectionproperties.cartBtnTextcolor,
+//             fontSize: sectionproperties.cartBtnTextfontsize + 'px',
+//             textTransform: sectionproperties.cartBtnTexttransform,
+//             fontWeight: sectionproperties.cartBtnTextfontweight,
+//             border: sectionproperties.cartbtnborderwidth + 'px solid ' + sectionproperties.cartbtnbordercolor,
+//             transition: '.3s',
+//             textDecoration: sectionproperties.cartbtntextdecoration == 'Underline' ? 'underline' : 'none',
+//             ':hover': {
+//                 background: sectionproperties.cartbtn_transparentbgcoloronhover == 'Transparent' ? 'transparent' : sectionproperties.cartBtnbgColoronhover,
+//                 color: sectionproperties.cartBtnTextcoloronhover,
+//                 borderColor: sectionproperties.cartBtnTextcoloronhover,
+//             },
+//         }),
+//         outstockbadge: css({
+//             width: sectionproperties.outstock_width + 'px',
+//             height: sectionproperties.outstock_height + 'px',
+//             background: sectionproperties.outstock_bg,
+//             color: sectionproperties.outstock_color,
+//             fontSize: sectionproperties.outstock_fontSize + 'px',
+//             borderRadius: sectionproperties.outstock_borderradius + 'px',
+//             position: 'absolute',
+//             zIndex: 2,
+//             top: 0,
+//             bottom: 0,
+//             left: 0,
+//             right: 0,
+//             margin: 'auto',
+//         }),
+//         profitcontainer: css({
+//             width: sectionproperties.profitcontainerwidth + '%',
+//             height: sectionproperties.profitcontainerheight + 'px',
+//             background: sectionproperties.profitcontainerbgcolor,
+//             border: sectionproperties.profitcontainerborderwidth + 'px solid' + sectionproperties.profitcontainerbordercolor,
+//             borderRadius: sectionproperties.profitcontainerborderradius + 'px',
+//             color: sectionproperties.profitcontainercolor,
+//             '@media (max-width: 800px)': {
+//                 width: '100%',
+//             },
+//         }),
+//         productDescStyles: css({
+//             color: sectionproperties.prodCatColor,
+//             fontSize: sectionproperties.prodCatFontSize + 'px',
+//             fontWeight: sectionproperties.prodCatFontWeight,
+//         }),
+//         pinfohover: css({
+//             opacity: 0,
+//             background: 'white',
+//             position: 'absolute',
+//             top: 0,
+//             transition: '.3s',
+//         }),
+//         icontainer: css({
+//             ':hover .pinfohover': {
+//                 opacity: 1,
+//                 transition: '.3s',
+//             },
+//         }),
+//         cardconttt: css({
+//             background:
+//                 sectionproperties.backgroundColortransparent == 'Transparent'
+//                     ? 'transparent'
+//                     : sectionproperties.backgroundColortransparent != 'Transparent' && sectionproperties.backgroundColor == '#ffffff'
+//                     ? 'rgba(250,250,250,' + sectionproperties.cardbg_opacity + ')'
+//                     : sectionproperties.backgroundColor,
+//             borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.borderBottomLeftRadius + 'px' : sectionproperties.borderBottomRightRadius + 'px',
+//             borderBottomRightRadius: langdetect == 'en' ? sectionproperties.borderBottomRightRadius + 'px' : sectionproperties.borderBottomLeftRadius + 'px',
+//             borderTopLeftRadius: langdetect == 'en' ? sectionproperties.borderTopLeftRadius + 'px' : sectionproperties.borderTopRightRadius + 'px',
+//             borderTopRightRadius: langdetect == 'en' ? sectionproperties.borderTopRightRadius + 'px' : sectionproperties.borderTopLeftRadius + 'px',
+//             marginTop: sectionproperties.marginTop + 'px',
+//             marginBottom: sectionproperties.marginBottom + 'px',
+//             border: sectionproperties.sectioncardborderwidth + 'px solid ' + sectionproperties.sectioncardbordercolor,
+//             paddingTop: sectionproperties.paddingTop + 'px',
+//             paddingBottom: sectionproperties.paddingBottom + 'px',
+//             paddingLeft: langdetect == 'en' ? sectionproperties.paddingLeft + 'px' : sectionproperties.paddingRight + 'px',
+//             paddingRight: langdetect == 'en' ? sectionproperties.paddingRight + 'px' : sectionproperties.paddingLeft + 'px',
+//             transition: '.3s',
+//             // opacity: sectionproperties.backgroundColortransparent != 'Transparent' && sectionproperties.backgroundColor == '#ffffff' ? 'rgba(250,250,250,' + sectionproperties.cardbg_opacity + ')' : 1,
+//             ':hover': {
+//                 backgroundColor:
+//                     sectionproperties.backgroundColortransparent != 'Transparent' && sectionproperties.backgroundColor == '#ffffff'
+//                         ? 'rgba(250,250,250,' + sectionproperties.bgopacityonhover + ')'
+//                         : 1,
+//                 transition: 0.3,
+//                 boxShadow: '0 0 10px ' + sectionproperties.sectioncardshadowcoloronhover,
+//             },
+//         }),
+//         iconsContainer: css({
+//             display: 'flex',
+//             flexDirection: 'column',
+//             position: 'absolute',
+//             top: 5,
+//             right: -15,
+//             opacity: 0,
+//             transform: `translateX(5px)`,
+//             zIndex: 10,
+//             '@media (max-width: 800px)': {
+//                 opacity: 1,
+//                 right: 10,
+//             },
+//         }),
+//         iconsContainer2: css({
+//             opacity: 1,
+//             transition: 'all, 0.4s',
+//             right: 10,
+//             transform: `translateX(0px)`,
+//         }),
+//         sku: css({
+//             fontSize: sectionproperties.skuFontSize + 'px',
+//             color: sectionproperties.skuColor,
+//             fontWeight: sectionproperties.skuFontWeight,
+//         }),
+//         imagediv: css({
+//             ':hover': {
+//                 transition: 'all .4s ease',
+//                 transform: sectionproperties.zoomimageonhover == 'Yes' ? 'scale(1.1)' : '',
+//             },
+//         }),
+//     };
+//     const [secondimage, setsecondimage] = useState('');
+//     useEffect(() => {
+//         setitem(props.cardinfoitemprops);
+//         if (props?.cardinfoitemprops?.productimages?.length == 1) {
+//             setsecondimage(props?.cardinfoitemprops?.image);
+//         } else {
+//             if (props?.cardinfoitemprops != undefined && props?.cardinfoitemprops?.productimages != undefined && Array.isArray(props?.cardinfoitemprops?.productimages)) {
+//                 if (props?.cardinfoitemprops?.productimages[0] != undefined && props?.cardinfoitemprops?.productimages[0]?.path == props?.cardinfoitemprops?.image) {
+//                     if (props?.cardinfoitemprops?.productimages[1]?.length != 0) {
+//                         setsecondimage(props?.cardinfoitemprops?.productimages[1]?.path);
+//                     } else {
+//                         setsecondimage(props?.cardinfoitemprops?.image);
+//                     }
+//                 } else {
+//                     setsecondimage(props?.cardinfoitemprops?.productimages[0]?.path);
+//                 }
+//             }
+//         }
+//     }, [props.cardinfoitemprops]);
+//     const addtocartfunc = () => {
+//         var addtocardpayloadobj = {
+//             functype: 'add',
+//             productid: item.productid,
+//             variantid: '',
+//             quantity: item.quantity,
+//             vendorid: item.vendorid,
+//         };
+
+//         var runfunc = false;
+//         if (item.productid != '6811f1adebacc' && item.productid != '6811f2c05bd7f') {
+//             if (addtocardpayloadobj.productid.length != 0 && addtocardpayloadobj.quantity > 0) {
+//                 if (item.hasvariants == 1) {
+//                     // if (addtocardpayloadobj.variantid.length != 0) {
+//                     if (variantObj != undefined && variantObj != null && Object.keys(variantObj).length != 0) {
+//                         addtocardpayloadobj.variantid = variantObj.variantid;
+//                         runfunc = true;
+//                     } else {
+//                         NotificationManager.warning(
+//                             '',
+//                             authdetailsContext?.instinfo?.contactinfo.instid == '674f0617c7811'
+//                                 ? 'Please Choose Size & Color'
+//                                 : authdetailsContext?.instinfo?.contactinfo.instid == '67e448d2ef6e0'
+//                                 ? 'من فضلك اختر لون'
+//                                 : langdetect == 'en'
+//                                 ? 'Please Choose Product Options'
+//                                 : 'من فضلك اختر متغير',
+//                         );
+//                     }
+//                 } else {
+//                     runfunc = true;
+//                 }
+//             } else {
+//                 NotificationManager.warning('', langdetect == 'en' ? 'Please Choose Quantity' : 'من فضلك اختر الكمية');
+//             }
+//         } else {
+//         }
+
+//         if (runfunc == true) {
+//             AddtoCartContext(addtocardpayloadobj);
+//         }
+//     };
+//     // const addtocartfunc = () => {
+//     //     var runfunc = false;
+
+//     //     var tempaddtocardpayloadobj = { ...addtocardpayloadobj };
+//     //     tempaddtocardpayloadobj.productid = item.productid;
+//     //     tempaddtocardpayloadobj.functype = 'add';
+//     //     tempaddtocardpayloadobj.item_type = 'product';
+//     //     tempaddtocardpayloadobj.quantity = 1;
+
+//     //     AddtoCartContext(tempaddtocardpayloadobj);
+//     // };
+//     const addtocartbuttonrender = () => {
+//         if (AddtoCartMutationContext.isLoading) {
+//             if (AddtoCartMutationContext?.variables?.productid == item.productid) {
+//                 return (
+//                     <div class={' d-flex align-items-center justify-content-center '}>
+//                         <CircularProgress color={sectionproperties.cartBtnTextcolor} width="20px" height="20px" duration="1s" />
+//                     </div>
+//                 );
+//             } else {
+//                 return (
+//                     <span class="w-100 allcentered">
+//                         {sectionproperties.cartBtn_iconFontSize != 0 && (
+//                             <i class={langdetect == 'en' ? 'h-100 mr-2 d-flex align-items-center justify-content-center' : 'h-100 ml-2 d-flex align-items-center justify-content-center'}>
+//                                 {sectionproperties.carticonstyle == 'Shopping bag 1' && <FiShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                                 {sectionproperties.carticonstyle == 'Shopping bag 2' && <CgShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                                 {sectionproperties.carticonstyle == 'Shopping bag 3' && <BsBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                                 {sectionproperties.carticonstyle == 'Shopping bag 4' && <RiHandbagLine size={sectionproperties.cartBtn_iconFontSize} />}
+//                                 {sectionproperties.carticonstyle == 'Shopping cart 1' && <FiShoppingCart class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                                 {sectionproperties.carticonstyle == 'Shopping cart 2' && <MdAddShoppingCart size={sectionproperties.cartBtn_iconFontSize} />}
+//                             </i>
+//                         )}
+//                         {item.productid != '6811f1adebacc' && item.productid != '6811f2c05bd7f'
+//                             ? langdetect == 'en'
+//                                 ? sectionproperties.cartBtnContentenglish
+//                                 : sectionproperties.cartBtnContentarabic
+//                             : langdetect == 'en'
+//                             ? 'COMING SOON'
+//                             : 'قريباً'}
+//                     </span>
+//                 );
+//             }
+//         }
+//         if (!AddtoCartMutationContext.isLoading) {
+//             return (
+//                 <span class="w-100 allcentered">
+//                     <i class={langdetect == 'en' ? 'h-100 mr-2 d-flex align-items-center justify-content-center' : 'h-100 ml-2 d-flex align-items-center justify-content-center'}>
+//                         {sectionproperties.carticonstyle == 'Shopping bag 1' && <FiShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                         {sectionproperties.carticonstyle == 'Shopping bag 2' && <CgShoppingBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                         {sectionproperties.carticonstyle == 'Shopping bag 3' && <BsBag class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                         {sectionproperties.carticonstyle == 'Shopping bag 4' && <RiHandbagLine size={sectionproperties.cartBtn_iconFontSize} />}
+//                         {sectionproperties.carticonstyle == 'Shopping cart 1' && <FiShoppingCart class="" size={sectionproperties.cartBtn_iconFontSize} />}
+//                         {sectionproperties.carticonstyle == 'Shopping cart 2' && <MdAddShoppingCart size={sectionproperties.cartBtn_iconFontSize} />}
+//                     </i>
+//                     {item.productid != '6811f1adebacc' && item.productid != '6811f2c05bd7f'
+//                         ? langdetect == 'en'
+//                             ? sectionproperties.cartBtnContentenglish
+//                             : sectionproperties.cartBtnContentarabic
+//                         : langdetect == 'en'
+//                         ? 'COMING SOON'
+//                         : 'قريباً'}
+//                     {/* {langdetect == 'en' ? sectionproperties.cartBtnContentenglish : sectionproperties.cartBtnContentarabic} */}
+//                 </span>
+//             );
+//         }
+//     };
+//     const Image = (type) => {
+//         var transition = false;
+//         if (sectionproperties.hideshowcardtransition == 'Show' && type != 'responsive') {
+//             transition = true;
+//         }
+
+//         return (
+//             <div class={card_cssstyles.imagediv + ' w-100 cursor-pointer '} style={{ position: 'relative' }}>
+//                 <Imagekitimagecomp
+//                     class={transition ? cardstyles.intialimage : ''}
+//                     urlEndpoint={ikimagecredcontext?.ikimageendpoint}
+//                     publicKey={ikimagecredcontext?.ikimagepublickey}
+//                     path={'/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + item.image}
+//                     loading="lazy"
+//                     style={{
+//                         width: sectionproperties.imageInnerWidth_Height + '%',
+//                         height: sectionproperties.imageInnerWidth_Height + '%',
+//                         objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+//                     }}
+//                 />
+//                 {transition && (
+//                     <Imagekitimagecomp
+//                         class={cardstyles.secondaryimage}
+//                         urlEndpoint={ikimagecredcontext?.ikimageendpoint}
+//                         publicKey={ikimagecredcontext?.ikimagepublickey}
+//                         path={'/tr:w-' + sectionproperties.imagetr_w + ',h-' + sectionproperties.imagetr_h + '/' + secondimage}
+//                         loading="lazy"
+//                         style={{
+//                             width: sectionproperties.imageInnerWidth_Height + '%',
+//                             height: sectionproperties.imageInnerWidth_Height + '%',
+//                             objectFit: sectionproperties.bgcovercontain == 'Cover' ? 'cover' : 'contain',
+//                         }}
+//                     />
+//                 )}
+//             </div>
+//         );
+//     };
+//     const [clickCount, setClickCount] = useState(0);
+//     const handleClick = () => {
+//         // Increase the click count by 1
+//         setClickCount((prevCount) => prevCount + 1);
+
+//         // Check if it's the second click
+//         if (sectionproperties.hideshowcardtransition == 'Show') {
+//             if (clickCount === 1) {
+//                 // Do whatever you want on the second click
+//                 var productidtobesend = null;
+//                 if (sectionproperties.urlwithproductname == 'Yes') {
+//                     productidtobesend = item.productendpointurl;
+//                 } else {
+//                     productidtobesend = item.productid;
+//                 }
+//                 cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//             }
+//         } else {
+//             var productidtobesend = null;
+//             if (sectionproperties.urlwithproductname == 'Yes') {
+//                 productidtobesend = item.productendpointurl;
+//             } else {
+//                 productidtobesend = item.productid;
+//             }
+//             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//         }
+//     };
+//     const PillContainer = () => {
+//         return (
+//             <div
+//                 class={sectionproperties.pillwidth == 0 ? ' px-2 allcentered' : 'allcentered'}
+//                 style={{
+//                     zIndex: 2,
+
+//                     width: sectionproperties.pillwidth == 0 ? 'auto' : sectionproperties.pillwidth + 'px',
+//                     height: sectionproperties.pillheight + 'px',
+//                     background: sectionproperties.pillbgcolor,
+//                     borderRadius: sectionproperties.pillborderBottomLeftRadius + 'px',
+//                 }}
+//             >
+//                 {sectionproperties.countertype == 'Percentage' && (
+//                     <p class="m-0 p-0" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
+//                         {'-' + parseFloat(Math.round(10.0 * ((parseInt(item.defaultprice) - parseInt(item.defaultsaleprice)) / parseInt(item.defaultprice)) * 100) / 10.0).toFixed(0) + '%'}
+//                     </p>
+//                 )}
+//                 {sectionproperties.countertype == 'Value' && (
+//                     <p class="m-0 p-0 text-uppercase" style={{ color: sectionproperties.pillcolor, fontSize: sectionproperties.pillfontSize + 'px', direction: 'ltr' }}>
+//                         {langdetect == 'en' ? 'Save' : 'وفر'} {langdetect == 'en' ? item.currencyname : ''}{' '}
+//                         {parseFloat(Math.round(parseInt(item.defaultprice) - parseInt(item.defaultsaleprice))).toFixed(0)} {langdetect == 'en' ? '' : item.currencyname}
+//                     </p>
+//                 )}
+//             </div>
+//         );
+//     };
+//     return (
+//         <div
+//             class={
+//                 props.sectiontypeprops2 == 'vertical'
+//                     ? sectionproperties.card_marginLeft == 0 && sectionproperties.card_marginRight == 0
+//                         ? `${card_cssstyles.productcard}` + ' w-100 '
+//                         : `${card_cssstyles.productcard}` + ' w-100 px-md-1 '
+//                     : ` ${card_cssstyles.productcard}`
+//             }
+//             style={{
+//                 paddingLeft: langdetect == 'en' ? sectionproperties.card_marginLeft + 'px' : sectionproperties.card_marginRight + 'px',
+//                 paddingRight: langdetect == 'en' ? sectionproperties.card_marginRight + 'px' : sectionproperties.card_marginLeft + 'px',
+//             }}
+//         >
+//             <div class={card_cssstyles.cardconttt + ' cursor-pointer w-100 '} style={{}}>
+//                 {sectionproperties.image_show == 'show' && (
+//                     <div class={card_cssstyles.icontainer + ' w-100 '} style={{ position: 'relative' }}>
+//                         {sectionproperties.btnswithtransition == 'With Transition' && (
+//                             <div class={`${card_cssstyles.iconsContainer}` + ' iconsContainer p-0 d-flex '}>
+//                                 {sectionproperties.favBtnShow == 'Show' && (
+//                                     <button
+//                                         class={` ${card_cssstyles.wishlist_btn}` + ' mt-2 mb-2 '}
+//                                         onClick={() => {
+//                                             addtofavoritescontext(item.productid);
+//                                         }}
+//                                     >
+//                                         {item.IsFavExists && (
+//                                             <i class="h-100 d-flex align-items-center justify-content-center icon">
+//                                                 {sectionproperties.faviconshape == 'Star Shape' && (
+//                                                     <AiFillStar size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} />
+//                                                 )}
+//                                                 {sectionproperties.faviconshape == 'Heart Shape' && (
+//                                                     <FaHeart size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} />
+//                                                 )}
+//                                             </i>
+//                                         )}
+//                                         {!item.IsFavExists && (
+//                                             <i class="h-100 d-flex align-items-center justify-content-center icon">
+//                                                 {sectionproperties.faviconshape == 'Star Shape' && <AiOutlineStar size={sectionproperties.favBtnIconfontsize} />}
+//                                                 {sectionproperties.faviconshape == 'Heart Shape' && <FaRegHeart size={sectionproperties.favBtnIconfontsize} />}
+//                                             </i>
+//                                         )}
+//                                     </button>
+//                                 )}
+
+//                                 {sectionproperties.showproductinfomodalbtn == 'Show' && (
+//                                     <button
+//                                         class={`${card_cssstyles.wishlist_btn}` + '  '}
+//                                         onClick={(e) => {
+//                                             e.stopPropagation();
+//                                             setShowProductInfoModalContext(true);
+//                                             setProductIdProdutInfoModalContext(item.productid);
+//                                         }}
+//                                     >
+//                                         <i class="h-100 d-flex align-items-center justify-content-center icon">
+//                                             <BsEye size={sectionproperties.generalbtn_fontsize} />
+//                                         </i>
+//                                     </button>
+//                                 )}
+//                             </div>
+//                         )}
+//                         {sectionproperties.favBtnShow == 'Show' && sectionproperties.btnswithtransition != 'With Transition' && (
+//                             <button
+//                                 class={` ${card_cssstyles.wishlist_btn}` + ' m-0 p-0 d-flex align-items-center justify-content-center '}
+//                                 onClick={(e) => {
+//                                     e.stopPropagation();
+//                                     addtofavoritescontext(item.productid);
+//                                 }}
+//                                 style={{
+//                                     zIndex: 2,
+//                                     position: 'absolute',
+//                                     top: 5,
+//                                     right: 5,
+//                                     // left: langdetect == 'en' ? '' : 5,
+//                                     background: item.IsFavExists == true ? (sectionproperties.favbtn_bgtransparent == 'Transparent' ? 'transparent' : sectionproperties.activebgcolor) : '',
+//                                 }}
+//                             >
+//                                 {item.IsFavExists && (
+//                                     <i class="h-100 d-flex align-items-center justify-content-center">
+//                                         {sectionproperties.faviconshape == 'Star Shape' && (
+//                                             <AiFillStar size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} class="font-md-20" />
+//                                         )}
+//                                         {sectionproperties.faviconshape == 'Heart Shape' && (
+//                                             <FaHeart size={sectionproperties.favBtnIconfontsize} style={{ color: sectionproperties.activefaviconcolor }} />
+//                                         )}
+//                                     </i>
+//                                 )}
+//                                 {!item.IsFavExists && (
+//                                     <i class="h-100 d-flex align-items-center justify-content-center">
+//                                         {sectionproperties.faviconshape == 'Star Shape' && <AiOutlineStar size={sectionproperties.favBtnIconfontsize} />}
+//                                         {sectionproperties.faviconshape == 'Heart Shape' && <FaRegHeart size={sectionproperties.favBtnIconfontsize} />}
+//                                     </i>
+//                                 )}
+//                             </button>
+//                         )}
+//                         {/* urlwithproductname */}
+//                         {item?.hassale == 1 && sectionproperties.showbadge == 'Show' && (
+//                             <div
+//                                 class="allcentered"
+//                                 style={{
+//                                     zIndex: 2,
+//                                     position: 'absolute',
+//                                     top: sectionproperties.badgeposition == 'Top' ? sectionproperties.badge_top + 'px' : '',
+//                                     bottom: sectionproperties.badgeposition == 'Bottom' ? sectionproperties.badge_top + 'px' : '',
+//                                     left: sectionproperties.badge_right + 'px',
+//                                     // right: langdetect == 'en' ? '' : sectionproperties.badge_right + 'px',
+//                                     width: sectionproperties.badge_width == 0 ? '90%' : sectionproperties.badge_width + 'px',
+//                                     height: sectionproperties.badge_height + 'px',
+//                                     background: sectionproperties.badge_bgcolor,
+//                                     borderRadius: sectionproperties.badge_borderradius + 'px',
+//                                 }}
+//                             >
+//                                 <p class="m-0 p-0" style={{ color: sectionproperties.badge_color, fontSize: sectionproperties.badge_fontsize + 'px' }}>
+//                                     {langdetect == 'en' ? sectionproperties.badgeContentEn : sectionproperties.badgeContentAr}
+//                                 </p>
+//                             </div>
+//                         )}
+//                         {sectionproperties.showpill == 'Show' && item.hassale == 1 && sectionproperties.counterposition == 'Top' && (
+//                             <div
+//                                 style={{
+//                                     position: 'absolute',
+//                                     top: sectionproperties.pillpositionfromtop + 'px',
+//                                     left: sectionproperties.pillpositionfromright + 'px',
+//                                     // right: langdetect == 'en' ? '' : sectionproperties.pillpositionfromright + 'px',
+//                                     zIndex: 3,
+//                                 }}
+//                             >
+//                                 {PillContainer()}
+//                             </div>
+//                         )}
+//                         {item?.producttags != undefined && item?.producttags?.length != 0 && sectionproperties.showtag == 'Show' && (
+//                             <div class="allcentered" style={{ position: 'absolute', bottom: 20, width: '100%', left: 0, right: 0, zIndex: 100 }}>
+//                                 <div
+//                                     class="px-3 py-1"
+//                                     style={{
+//                                         width: 'fit-content',
+//                                         background: sectionproperties.tagbackgroundcolor,
+//                                         borderRadius: sectionproperties.tagborderradius + 'px',
+//                                         color: sectionproperties.tagcolor,
+//                                         fontSize: 12,
+//                                     }}
+//                                 >
+//                                     {item?.producttags[0]?.taginfo?.tagname}
+//                                 </div>
+//                             </div>
+//                         )}
+//                         <div
+//                             class={
+//                                 sectionproperties.hideshowcardtransition == 'Show'
+//                                     ? ` ${card_cssstyles.productcardimagecont} ${cardstyles.imagecontainer}` + ' d-flex d-md-none '
+//                                     : ` ${card_cssstyles.productcardimagecont} ` + ' d-flex d-md-none '
+//                             }
+//                             style={{
+//                                 marginBottom: sectionproperties.image_mb + 'px',
+//                             }}
+//                             onClick={(e) => {
+//                                 if (sectionproperties.sectionproperties?.onClickRoute == 'None') {
+//                                 } else {
+//                                     e.stopPropagation();
+//                                     var productidtobesend = null;
+//                                     if (sectionproperties.urlwithproductname == 'Yes') {
+//                                         productidtobesend = item.productendpointurl;
+//                                     } else {
+//                                         productidtobesend = item.productid;
+//                                     }
+//                                     cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//                                 }
+//                             }}
+//                         >
+//                             {Image('normal')}
+//                         </div>
+//                         <div
+//                             class={
+//                                 sectionproperties.hideshowcardtransition == 'Show'
+//                                     ? ` ${card_cssstyles.productcardimagecont} ${cardstyles.imagecontainer}` + ' d-none d-md-flex '
+//                                     : ` ${card_cssstyles.productcardimagecont} ` + ' d-none d-md-flex '
+//                             }
+//                             style={{
+//                                 marginBottom: sectionproperties.image_mb + 'px',
+//                             }}
+//                             onClick={(e) => {
+//                                 if (sectionproperties?.onClickRoute == 'None') {
+//                                 } else {
+//                                     handleClick();
+//                                 }
+//                             }}
+//                         >
+//                             {Image('normal')}
+//                         </div>
+//                         {item.currentquantity < 1 && sectionproperties.showoutofstock == 'Show' && item.quantavailtype == 'limit' && item.hasvariants == 0 && (
+//                             <div class={`${card_cssstyles.outstockbadge}` + ' allcentered '}>
+//                                 <p class="m-0 p-0">{langdetect == 'en' ? sectionproperties.outstock_contenten : sectionproperties.outstock_contentar}</p>
+//                             </div>
+//                         )}
+//                         {sectionproperties.shownameonhover == 'Yes' && (
+//                             <div class={card_cssstyles.pinfohover + ' col-lg-12 pl-0 pr-0 allcentered h-100 pinfohover '} style={{}}>
+//                                 <p
+//                                     onClick={() => {
+//                                         if (sectionproperties?.onClickRoute == 'None') {
+//                                         } else {
+//                                             var productidtobesend = null;
+//                                             if (sectionproperties.urlwithproductname == 'Yes') {
+//                                                 productidtobesend = item.productendpointurl;
+//                                             } else {
+//                                                 productidtobesend = item.productid;
+//                                             }
+//                                             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//                                         }
+//                                     }}
+//                                     class={
+//                                         sectionproperties.wordbreak == '1'
+//                                             ? `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak1 font-md-13 m-0 '
+//                                             : `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak2 font-md-13 wordbreak-md-4 m-0 '
+//                                     }
+//                                     style={{
+//                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                     }}
+//                                 >
+//                                     {item.name}
+//                                 </p>
+//                             </div>
+//                         )}
+//                     </div>
+//                 )}
+//                 <div>
+//                     <div class={card_cssstyles.innersection + ' row m-0 w-100 '} style={{}}>
+//                         {sectionproperties.showfeatures == 'Show' && (
+//                             <div class="allcentered col-lg-12 p-0" style={{ height: 40 }}>
+//                                 <Imagekitimagecomp
+//                                     urlEndpoint={ikimagecredcontext?.ikimageendpoint}
+//                                     publicKey={ikimagecredcontext?.ikimagepublickey}
+//                                     path={item?.feature_image_url}
+//                                     loading="lazy"
+//                                     style={{
+//                                         maxWidth: '50%',
+//                                         maxHeight: '50%',
+//                                     }}
+//                                 />
+//                                 <div
+//                                     class="text-capitalize mx-2"
+//                                     style={{
+//                                         color: sectionproperties.featurecolor,
+//                                         fontSize: sectionproperties.featurefontsize + 'px',
+//                                     }}
+//                                 >
+//                                     {item?.productfeature != undefined && item?.productfeature != null ? item?.productfeature : ''}
+//                                 </div>
+//                             </div>
+//                         )}
+//                         {sectionproperties.showmeasurementunit == 'Show' && (
+//                             <p
+//                                 class={`${card_cssstyles.productDescStyles}` + ' col-lg-12 wordbreak wordbreak1 p-0 mb-2 '}
+//                                 style={{
+//                                     textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                     fontSize: sectionproperties.measurementunitfontsize + 'px',
+//                                     color: sectionproperties.measurementunitcolor,
+//                                 }}
+//                             >
+//                                 {item.measurmentunit}
+//                             </p>
+//                         )}
+
+//                         {sectionproperties.prodNameShow == 'Show' && (
+//                             <div
+//                                 class="col-lg-12 pl-0 pr-0"
+//                                 style={{
+//                                     minHeight: sectionproperties.wordbreak == '1' ? 'auto' : '6vh',
+//                                     background: sectionproperties.prodNameBackgroundColor,
+//                                     borderRadius: '15px',
+//                                     paddingTop: sectionproperties.productnamepaddingvertical + 'px',
+//                                     paddingBottom: sectionproperties.productnamepaddingvertical + 'px',
+//                                 }}
+//                             >
+//                                 <p
+//                                     onClick={() => {
+//                                         if (sectionproperties?.onClickRoute == 'None') {
+//                                         } else {
+//                                             var productidtobesend = null;
+//                                             if (sectionproperties.urlwithproductname == 'Yes') {
+//                                                 productidtobesend = item.productendpointurl;
+//                                             } else {
+//                                                 productidtobesend = item.productid;
+//                                             }
+//                                             cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//                                         }
+//                                     }}
+//                                     class={
+//                                         sectionproperties.wordbreak == '1'
+//                                             ? `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak1 font-md-13 m-0 pname '
+//                                             : `${card_cssstyles.productNameStyles}` + '  wordbreak wordbreak2 font-md-13 wordbreak-md-4 m-0 pname '
+//                                     }
+//                                     style={{
+//                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                     }}
+//                                 >
+//                                     {item.name}
+//                                 </p>
+//                             </div>
+//                         )}
+//                         {sectionproperties.showSKU == 'Show' && (
+//                             <div class="col-lg-12 pl-0 pr-0" style={{}}>
+//                                 <p
+//                                     class={`${card_cssstyles.sku}` + '  wordbreak wordbreak1 font-md-13 m-0 '}
+//                                     style={{
+//                                         textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                     }}
+//                                 >
+//                                     {langdetect == 'en' ? 'SKU: ' : 'كود: '}
+//                                     {item.sku}
+//                                 </p>
+//                             </div>
+//                         )}
+//                         {sectionproperties.prodCatShow == 'Show' && sectionproperties.descriptionoverwritestyles == 'No' && (
+//                             <p
+//                                 class={
+//                                     sectionproperties.descriptionwordbreak == 'None'
+//                                         ? `${card_cssstyles.productDescStyles}` + ' col-lg-12 p-0   mt-1 '
+//                                         : `${card_cssstyles.productDescStyles}` + ' col-lg-12 p-0 wordbreak wordbreak4 mt-1 '
+//                                 }
+//                                 style={{
+//                                     textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                 }}
+//                                 dangerouslySetInnerHTML={{ __html: item.shortdescription }}
+//                             >
+//                                 {/* {plainString(langdetect == 'en' ? item.description_en : item.description_ar)} */}
+//                             </p>
+//                         )}
+//                         {sectionproperties.prodCatShow == 'Show' && sectionproperties.descriptionoverwritestyles == 'Yes' && (
+//                             <p
+//                                 class={
+//                                     sectionproperties.descriptionwordbreak == 'None'
+//                                         ? `${card_cssstyles.productDescStyles}` + ' col-lg-12  p-0 mt-1 '
+//                                         : `${card_cssstyles.productDescStyles}` + ' col-lg-12 wordbreak wordbreak p-0 mt-1 '
+//                                 }
+//                                 style={{
+//                                     textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                 }}
+//                             >
+//                                 {plainString(item.shortdescription)}
+//                             </p>
+//                         )}
+
+//                         <div
+//                             style={{
+//                                 flexDirection: 'column',
+
+//                                 display:
+//                                     sectionproperties.prodPriceShow == 'Hide' &&
+//                                     sectionproperties.showprofitcontainer == 'Hide' &&
+//                                     sectionproperties.cartBtnShow == 'Hide' &&
+//                                     sectionproperties.prodsalePriceshow == 'Hide'
+//                                         ? 'none'
+//                                         : 'flex',
+//                             }}
+//                             class="col-lg-12 d-flex align-items-center justify-content-center p-0 mt-1 "
+//                         >
+//                             <div class="row m-0 w-100 ">
+//                                 <div
+//                                     class=" d-flex flex-row col-lg-12 mx-0 p-0 align-items-center "
+//                                     style={{
+//                                         justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                         marginTop: sectionproperties.productpricemarginTop + 'px',
+//                                         marginBottom: sectionproperties.productpricemarginBottom + 'px',
+//                                     }}
+//                                 >
+//                                     <div
+//                                         class={
+//                                             sectionproperties.priceDirection == 'Horizontal Direction'
+//                                                 ? ' d-flex align-items-center p-0 mb-0 flex-row '
+//                                                 : ' d-flex align-items-center p-0 mb-0 flex-column '
+//                                         }
+//                                         style={{
+//                                             textAlign: sectionproperties.productnamecentered == 'Centered' ? 'center' : langdetect == 'en' ? 'left' : 'right',
+//                                             minHeight: sectionproperties.priceDirection == 'Horizontal Direction' ? '' : '6.5vh',
+//                                         }}
+//                                     >
+//                                         {/* {sectionproperties.prodPriceShow == 'Show' && sectionproperties.removedecimals == 'Hide' && (
+//                                                 <p
+//                                                     class={
+//                                                         sectionproperties.priceDirection == 'Horizontal Direction'
+//                                                             ? `${card_cssstyles.productPricestyles}` + ' m-0 '
+//                                                             : `${card_cssstyles.productPricestyles}` + ' m-0 '
+//                                                     }
+//                                                 >
+//                                                     {langdetect == 'en' ? item.currencyname : ''}{' '}
+//                                                     {item.hassale == 1 ? parseFloat(Number(item.defaultsaleprice).toFixed(2)) : parseFloat(Number(item.defaultprice).toFixed(2))}{' '}
+//                                                     {langdetect == 'en' ? '' : item.currencyname}
+//                                                 </p>
+//                                             )} */}
+//                                         {sectionproperties.prodPriceShow == 'Show' && (
+//                                             <p
+//                                                 class={
+//                                                     sectionproperties.priceDirection == 'Horizontal Direction'
+//                                                         ? `${card_cssstyles.productPricestyles}` + ' m-0 '
+//                                                         : `${card_cssstyles.productPricestyles}` + ' m-0 '
+//                                                 }
+//                                             >
+//                                                 {langdetect == 'en' ? item.currencyname : ''} {item.hassale == 1 ? item.defaultsaleprice : item.defaultprice}{' '}
+//                                                 {langdetect == 'en' ? '' : item.currencyname}
+//                                             </p>
+//                                         )}
+//                                         {sectionproperties.prodsalePriceshow == 'Show' && item.hassale == 1 && (
+//                                             <div class={sectionproperties.priceDirection == 'Horizontal' ? ' d-flex align-items-center p-0 mb-0 ' : ' d-flex align-items-center p-0 mb-0'}>
+//                                                 <p class={`${card_cssstyles.productSalePricestyles}` + ' linethrough m-0 mr-2 ml-2 '}>
+//                                                     {langdetect == 'en' ? item.currencyname : ''} {item.defaultprice} {langdetect == 'en' ? '' : item.currencyname}
+//                                                 </p>
+//                                             </div>
+//                                         )}
+//                                         {/* {sectionproperties.prodsalePriceshow == 'Show' && item.hassale == 1 && sectionproperties.removedecimals == 'Hide' && (
+//                                                 <div class={sectionproperties.priceDirection == 'Horizontal' ? ' d-flex align-items-center p-0 mb-0 ' : ' d-flex align-items-center p-0 mb-0'}>
+//                                                     <p class={`${card_cssstyles.productSalePricestyles}` + ' linethrough m-0 mr-2 ml-2 '}>
+//                                                         {langdetect == 'en' ? item.currencyname : ''} {parseFloat(Number(item.defaultprice).toFixed(2))} {langdetect == 'en' ? '' : item.currencyname}
+//                                                     </p>
+//                                                 </div>
+//                                             )} */}
+//                                         {sectionproperties.showpill == 'Show' && item.hassale == 1 && sectionproperties.counterposition == 'Besides Sale Price' && (
+//                                             <div style={{}}>{PillContainer()}</div>
+//                                         )}
+//                                     </div>
+//                                 </div>
+//                                 {sectionproperties.showvariantscont == 'Show' && (
+//                                     <div class="col-12 p-0">
+//                                         <Variants_J_Cards
+//                                             actions={{
+//                                                 sectionproperties: sectionproperties,
+//                                                 item: item,
+//                                                 cardonclickfunctionContext: cardonclickfunctionContext,
+//                                                 fetchingtypeprops: props.fetchingtypeprops,
+//                                             }}
+//                                             foundMatchedVariantFunc={(variantCompletedObj) => {
+//                                                 setvariantObj(variantCompletedObj);
+//                                             }}
+//                                             foundImageColorMatchingFunc={(variantIMAGECompletedObj) => {
+//                                                 setVariant_Color_ImageObj(variantIMAGECompletedObj);
+//                                             }}
+//                                         />
+//                                     </div>
+//                                 )}
+//                                 {sectionproperties.showprofitcontainer == 'Show' && (
+//                                     <div
+//                                         class="col-lg-12 p-0"
+//                                         style={{
+//                                             justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                         }}
+//                                     >
+//                                         <div
+//                                             class={card_cssstyles.profitcontainer + ' d-flex align-items-center flex-sm-column px-2'}
+//                                             style={{
+//                                                 justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                             }}
+//                                         >
+//                                             <p
+//                                                 class={' m-0 p-0 d-flex align-items-center '}
+//                                                 style={{
+//                                                     justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                                 }}
+//                                             >
+//                                                 <span
+//                                                     style={{
+//                                                         fontWeight: sectionproperties.profitcontainerfontweight,
+//                                                     }}
+//                                                 >
+//                                                     {langdetect == 'en' ? sectionproperties.profitcontainercontenten : sectionproperties.profitcontainercontentar}:{' '}
+//                                                 </span>
+//                                                 <span
+//                                                     class="mx-1"
+//                                                     style={{
+//                                                         fontWeight: sectionproperties.profitcontainersecondaryfontweight,
+//                                                     }}
+//                                                 >
+//                                                     {langdetect == 'en' ? item.currencyname : ''}{' '}
+//                                                     {parseFloat(Math.round(parseInt(item.hassale == 1 ? item.defaultsaleprice : item.defaultprice) * (item.prodaffpercentprofit / 100))).toFixed(0)}{' '}
+//                                                     {langdetect == 'en' ? '' : item.currencyname}
+//                                                 </span>
+//                                             </p>
+//                                         </div>
+//                                     </div>
+//                                 )}
+//                                 {sectionproperties.quantityshow == 'Show' && item.currentquantity > 0 && (
+//                                     <div
+//                                         class="col-lg-12 p-0 d-flex align-items-center"
+//                                         style={{
+//                                             justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                         }}
+//                                     >
+//                                         <p
+//                                             class="m-0 p-0"
+//                                             style={{
+//                                                 fontSize: sectionproperties.quantityfontsize,
+//                                                 color: sectionproperties.quantitycolor,
+//                                                 fontWeight: sectionproperties.quantityfontweight,
+//                                             }}
+//                                         >
+//                                             {langdetect == 'en' ? sectionproperties.qtytextinen : sectionproperties.qtytextinar} {item.currentquantity}{' '}
+//                                             {langdetect == 'en' ? sectionproperties.qtytextinen2 : sectionproperties.qtytextinar2}
+//                                         </p>
+//                                     </div>
+//                                 )}
+//                                 {sectionproperties.cartBtnShow == 'Show' && (
+//                                     <div
+//                                         class="col-lg-12 p-0 d-flex align-items-center"
+//                                         style={{
+//                                             justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                         }}
+//                                     >
+//                                         <p
+//                                             class={`${card_cssstyles.cart_btn}` + ' m-0 p-0 d-flex align-items-center justify-content-center mt-1 '}
+//                                             // onClick={() => {
+//                                             //     var productidtobesend = null;
+//                                             //     if (sectionproperties.urlwithproductname == 'Yes') {
+//                                             //         productidtobesend = item.productendpointurl;
+//                                             //     } else {
+//                                             //         productidtobesend = item.productid;
+//                                             //     }
+//                                             // cardonclickfunctionContext(sectionproperties?.onClickRoute, productidtobesend, props.fetchingtypeprops, item.collectionid);
+//                                             //     // setShowProductInfoModalContext(true);
+//                                             //     // setProductIdProdutInfoModalContext(item.productid);
+//                                             // }}
+//                                             onClick={() => {
+//                                                 if (sectionproperties.showvariantscont == 'Show') {
+//                                                     addtocartfunc();
+//                                                 } else {
+//                                                     if (sectionproperties.automaticaddtocart == 'Yes' && item.hasvariants == 0) {
+//                                                         addtocartfunc();
+//                                                     } else if (sectionproperties.automaticaddtocart == 'Yes' && item.hasvariants == 1) {
+//                                                         cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//                                                         // cardonclickfunctionContext(sectionproperties?.onClickRoute, item.productid, props.fetchingtypeprops, item.collectionid);
+//                                                     } else {
+//                                                         var productidtobesend = null;
+//                                                         if (sectionproperties.urlwithproductname == 'Yes') {
+//                                                             productidtobesend = item.productendpointurl;
+//                                                         } else {
+//                                                             productidtobesend = item.productid;
+//                                                         }
+//                                                         cardonclickfunctionContext(sectionproperties?.onClickRoute, item, props.fetchingtypeprops, item.collectionid);
+//                                                     }
+//                                                 }
+//                                             }}
+//                                             // disabled={AddtoCartMutationContext.isLoading == true ? true : false}
+//                                         >
+//                                             {addtocartbuttonrender()}
+
+//                                             {/* {!AddtoCartMutationContext.isLoading && ( */}
+//                                             {/* <span> */}
+//                                             {/* </span> */}
+//                                             {/* // )} */}
+//                                             {/* {AddtoCartMutationContext.isLoading && <CircularProgress color={sectionproperties.cartBtnTextcolor} width="20px" height="20px" duration="1s" />} */}
+//                                         </p>
+//                                     </div>
+//                                 )}
+//                             </div>
+//                         </div>
+//                         {sectionproperties.showrating == 'Show' && item.productcanrate == 1 && (
+//                             <div
+//                                 class="col-lg-12 d-flex align-items-center p-0"
+//                                 style={{
+//                                     justifyContent: sectionproperties.productnamecentered == 'Centered' ? 'center' : 'start',
+//                                 }}
+//                             >
+//                                 <ReactStars
+//                                     count={5}
+//                                     value={item.productoverallrate}
+//                                     edit={false}
+//                                     size={16}
+//                                     emptyIcon={<i className="far fa-star" style={{ color: '#cccccc' }}></i>}
+//                                     halfIcon={<i className="fa fa-star-half-alt style={{ color: '#FAB400' }}"></i>}
+//                                     filledIcon={<i className="fa fa-star" style={{ color: '#FAB400' }}></i>}
+//                                     activeColor="#ffd700"
+//                                 />
+//                             </div>
+//                         )}
+//                     </div>
+//                 </div>
+//             </div>
+//         </div>
+//     );
+// };
+// export default Simpleproductcard;