@growupsell/react-ecommerce-core 2.0.16 → 2.0.18

package/dist/{chunk-ID4JKOXT.js → chunk-FOGKAOV4.js}

@@ -2,7 +2,7 @@ import { BusinessConfigContext } from './chunk-SP77KIKJ.js';
 import { createContext, useState, useContext, useEffect, useMemo, useRef, useCallback } from 'react';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { WAApi, api } from '@growupsell/api';
-import { retrieveThemeContent, updateThemeContent, getCustomPageContent, splitCustomPageContent, createCustomerSession, getBusinessSetting, getRewardPointBusinessConfig, getOrderBusinessConfig, updateCustomPageContent, mergeCustomPageContent } from '@growupsell/api/api';
+import { retrieveThemeContent, updateThemeContent, getCustomPageContent, splitCustomPageContent, readHeroSectionValue, createCustomerSession, getBusinessSetting, getRewardPointBusinessConfig, getOrderBusinessConfig, updateCustomPageContent, mergeCustomPageContent } from '@growupsell/api/api';
 import 'lodash';
 
 var StorageContext = createContext({
@@ -554,10 +554,18 @@ var CartProvider = (props) => {
   );
 };
 var useCart = () => useContext(CartContext);
+var getRouteCategoryId = () => {
+  if (typeof window === "undefined") return null;
+  const match = window.location.pathname.match(/\/products\/[^/]+\/(\d+)\/?$/);
+  if (!match) return null;
+  const id = Number(match[1]);
+  return Number.isFinite(id) ? id : null;
+};
 var FilterContext = createContext({
   selectedCategoryId: [],
   addCategoryFilterId: () => null,
   removeCategoryFilterId: () => null,
+  replaceCategoryFilterIds: () => null,
   menuList: [],
   productLoading: true,
   currentPage: 1,
@@ -581,6 +589,9 @@ var FilterContext = createContext({
   selectedVariants: [],
   updateSelectedVariants: () => null,
   variantLoading: false,
+  selectedSpecifications: [],
+  updateSpecificationOption: () => null,
+  setSelectedSpecifications: () => null,
   total: 0,
   limit: 10,
   offset: 0
@@ -607,9 +618,11 @@ var FilterProvider = (props) => {
   const [variantList, setVariantList] = useState([]);
   const [selectedVariants, setSelectedVariants] = useState([]);
   const [variantLoading, setVariantLoading] = useState(false);
+  const [selectedSpecifications, setSelectedSpecifications] = useState([]);
   const [limit, setLimit] = useState(10);
   const [offset, setOffset] = useState(0);
   const [total, setTotal] = useState(0);
+  const waitingForRouteCategory = useRef(getRouteCategoryId() != null);
   const fetchBrandList = async () => {
     setBrandLoading(true);
     let body = {
@@ -633,15 +646,39 @@ var FilterProvider = (props) => {
     });
     setCurrentPage(1);
   };
-  const fetchFilterConfig = async () => {
-    setFilterConfigLoading(true);
-    const response = await api.getProductFilterConfig();
-    setFilterConfig(response);
-    setFilterConfigLoading(false);
+  const replaceCategoryFilterIds = (ids) => {
+    const unique = Array.from(new Set(ids.filter((id) => Number.isFinite(id))));
+    setSelectedCategoryId(unique);
+    setCurrentPage(1);
+    setOffset(0);
+    setMenuList([]);
+    setProductLoading(true);
+    waitingForRouteCategory.current = false;
   };
+  const categoryFilterKey = selectedCategoryId.length === 1 ? selectedCategoryId[0] : void 0;
   useEffect(() => {
-    fetchFilterConfig();
-  }, []);
+    let active = true;
+    (async () => {
+      if (!filterConfig) {
+        setFilterConfigLoading(true);
+      }
+      try {
+        const response = await api.getProductFilterConfig(categoryFilterKey);
+        if (active) {
+          setFilterConfig(response);
+        }
+      } catch (error) {
+        console.log(error);
+      } finally {
+        if (active) {
+          setFilterConfigLoading(false);
+        }
+      }
+    })();
+    return () => {
+      active = false;
+    };
+  }, [categoryFilterKey]);
   const removeCategoryFilterId = (id) => {
     setSelectedCategoryId((x) => {
       return x.filter((o) => o !== id);
@@ -659,6 +696,7 @@ var FilterProvider = (props) => {
       max_price: selectedMaxPrice,
       brand_ids: selectedCategoryId.length > 0 ? selectedBrandId : null,
       variants: selectedCategoryId.length > 0 ? selectedVariants : null,
+      specifications: selectedSpecifications,
       limit,
       offset
     };
@@ -680,6 +718,21 @@ var FilterProvider = (props) => {
       return [...prevIds, id];
     });
   };
+  const updateSpecificationOption = (keyId, option) => {
+    setSelectedSpecifications((prev) => {
+      const current = prev.find((item) => item.id === keyId);
+      if (!current) {
+        return [...prev, { id: keyId, values: [option] }];
+      }
+      const values = current.values.includes(option) ? current.values.filter((value) => value !== option) : [...current.values, option];
+      if (values.length === 0) {
+        return prev.filter((item) => item.id !== keyId);
+      }
+      return prev.map(
+        (item) => item.id === keyId ? { ...item, values } : item
+      );
+    });
+  };
   const updateSelectedVariants = (label) => {
     setSelectedVariants((prevVariants) => {
       if (prevVariants.includes(label)) {
@@ -698,9 +751,10 @@ var FilterProvider = (props) => {
     setVariantLoading(false);
   };
   useEffect(() => {
-    if (!filterConfigLoading) {
-      fetchProductList();
-    }
+    if (filterConfigLoading) return;
+    if (waitingForRouteCategory.current && selectedCategoryId.length === 0) return;
+    waitingForRouteCategory.current = false;
+    fetchProductList();
   }, [
     selectedCategoryId,
     currentPage,
@@ -711,9 +765,31 @@ var FilterProvider = (props) => {
     selectedMaxPrice,
     selectedBrandId,
     selectedVariants,
+    selectedSpecifications,
     limit,
     offset
   ]);
+  useEffect(() => {
+    const keys = filterConfig?.specifications ?? [];
+    const allowed = new Map(
+      keys.map((key) => [
+        key.id,
+        new Set(key.options ?? [])
+      ])
+    );
+    setSelectedSpecifications((prev) => {
+      const next = prev.map((item) => ({
+        ...item,
+        values: item.values.filter((value) => allowed.get(item.id)?.has(value))
+      })).filter((item) => item.values.length > 0 && allowed.has(item.id));
+      if (next.length === prev.length && next.every(
+        (item, index) => item.id === prev[index].id && item.values.length === prev[index].values.length && item.values.every((value, valueIndex) => value === prev[index].values[valueIndex])
+      )) {
+        return prev;
+      }
+      return next;
+    });
+  }, [filterConfig]);
   const handlePageChange = (newOffset) => {
     setOffset(newOffset);
   };
@@ -731,6 +807,7 @@ var FilterProvider = (props) => {
         setMenuList,
         addCategoryFilterId,
         removeCategoryFilterId,
+        replaceCategoryFilterIds,
         menuList,
         productLoading,
         currentPage,
@@ -753,6 +830,9 @@ var FilterProvider = (props) => {
         selectedVariants,
         updateSelectedVariants,
         variantLoading,
+        selectedSpecifications,
+        updateSpecificationOption,
+        setSelectedSpecifications,
         total,
         limit,
         offset
@@ -937,6 +1017,7 @@ var HomeConfigProvider = (props) => {
   });
   const { token } = useThemeEdit();
   const themeConfig = useContext(BusinessConfigContext);
+  const themeId = themeConfig.theme.id;
   const [themeConfigData, setThemeConfigData] = useState(
     props.initialThemeContent ?? {}
   );
@@ -944,16 +1025,13 @@ var HomeConfigProvider = (props) => {
   const updateRef = useRef(false);
   const [loading, setLoading] = useState(!hasInitial);
   const getThemeConfig = useCallback(async () => {
-    if (!hasInitial) {
-      setLoading(true);
-    } else {
+    if (hasInitial || !themeId) {
+      if (!themeId) setLoading(false);
       return;
     }
+    setLoading(true);
     try {
-      const response = await retrieveThemeContent(
-        themeConfig.theme.id,
-        props.page
-      );
+      const response = await retrieveThemeContent(themeId, props.page);
       setThemeConfigData(response);
       if (response?.data && Array.isArray(response.data)) {
         setSelectedConfig(
@@ -968,7 +1046,7 @@ var HomeConfigProvider = (props) => {
     } finally {
       setLoading(false);
     }
-  }, [themeConfig.theme.id, hasInitial, props.page]);
+  }, [themeId, hasInitial, props.page]);
   const onUpdateThemeContent = useCallback(
     async (configToUpdate = selectedConfig) => {
       try {
@@ -979,16 +1057,9 @@ var HomeConfigProvider = (props) => {
         };
         if (updateRef.current) return;
         updateRef.current = true;
-        await updateThemeContent(
-          body,
-          themeConfig?.theme?.id,
-          props.page,
-          token
-        );
-        const updatedResponse = await retrieveThemeContent(
-          themeConfig.theme.id,
-          props.page
-        );
+        if (!themeId) return;
+        await updateThemeContent(body, themeId, props.page, token);
+        const updatedResponse = await retrieveThemeContent(themeId, props.page);
         setThemeConfigData(updatedResponse);
       } catch (error) {
         console.error("Error updating theme content:", error);
@@ -996,7 +1067,7 @@ var HomeConfigProvider = (props) => {
         updateRef.current = false;
       }
     },
-    [isInitialized, token, themeConfig?.theme?.id, selectedConfig]
+    [isInitialized, token, themeId, selectedConfig]
   );
   const addConfig = useCallback(
     async (config) => {
@@ -1062,73 +1133,76 @@ var HomeConfigProvider = (props) => {
   );
 };
 var useHomeConfig = () => useContext(HomeConfigContext);
-var HomeConfigHeroSliderContext = createContext({
+var HERO_SECTION_SLUG = "hero_section";
+function resolveHeroSection(sectionRow) {
+  if (sectionRow == null) return null;
+  const data = sectionRow.data !== void 0 ? sectionRow.data : sectionRow;
+  if (!data || typeof data !== "object" || Array.isArray(data)) return null;
+  if (typeof data.type !== "string" || !data.type) return null;
+  return { type: data.type, data: data.data };
+}
+var HomeConfigHeroSectionContext = createContext({
   loading: true,
-  heroSliderConfigData: [],
-  onUpdateHeroSlider: () => null
+  heroSection: null,
+  onUpdateHeroSection: async () => void 0
 });
-var HomeConfigHeroSliderProvider = (props) => {
-  const hasInitial = Array.isArray(props.initialThemeContent?.data);
-  const [loading, setLoading] = useState(!hasInitial);
-  const [heroSliderConfigData, setHeroSliderConfigData] = useState(
-    () => hasInitial ? props.initialThemeContent.data : []
+var HomeConfigHeroSectionProvider = (props) => {
+  const [heroSection, setHeroSection] = useState(
+    () => props.heroContentFetched ? resolveHeroSection(props.initialHeroSection) : null
   );
+  const [loading, setLoading] = useState(!props.heroContentFetched);
   const { token } = useThemeEdit();
   const themeConfig = useContext(BusinessConfigContext);
-  const getHeroSliderConfig = useCallback(async () => {
-    if (hasInitial) {
+  const themeId = themeConfig.theme.id;
+  const loadHeroSection = useCallback(async () => {
+    if (props.heroContentFetched || !themeId) {
+      if (!themeId) setLoading(false);
       return;
     }
     setLoading(true);
     try {
-      const response = await retrieveThemeContent(
-        themeConfig.theme.id,
-        "hero_slider"
-      );
-      setHeroSliderConfigData(response.data);
+      let sectionRow = null;
+      try {
+        sectionRow = await retrieveThemeContent(themeId, HERO_SECTION_SLUG);
+      } catch {
+        sectionRow = null;
+      }
+      setHeroSection(resolveHeroSection(sectionRow));
     } catch (error) {
-      console.error("Error fetching hero slider content:", error);
+      console.error("Error fetching hero section:", error);
     } finally {
       setLoading(false);
     }
-  }, [themeConfig.theme.id, hasInitial]);
+  }, [props.heroContentFetched, themeId]);
   useEffect(() => {
-    getHeroSliderConfig();
-  }, [getHeroSliderConfig]);
-  const onUpdateHeroSlider = async (configToUpdate) => {
+    loadHeroSection();
+  }, [loadHeroSection]);
+  const onUpdateHeroSection = async (next) => {
     setLoading(true);
     try {
       const body = {
-        data: configToUpdate,
-        slug: "hero_slider",
+        data: next ? { type: next.type, data: next.data } : { type: null, data: null },
+        slug: HERO_SECTION_SLUG,
         platform: typeof window !== "undefined" ? "website" : "app"
       };
-      await updateThemeContent(
-        body,
-        themeConfig?.theme?.id,
-        "hero_slider",
-        token
-      );
-      const updatedResponse = await retrieveThemeContent(
-        themeConfig.theme.id,
-        "hero_slider"
-      );
-      setHeroSliderConfigData(updatedResponse.data);
+      await updateThemeContent(body, themeId, HERO_SECTION_SLUG, token);
+      setHeroSection(next);
     } catch (error) {
-      console.error("Error updating theme content:", error);
+      console.error("Error updating hero section:", error);
+      throw error;
     } finally {
       setLoading(false);
     }
   };
   return /* @__PURE__ */ jsx(
-    HomeConfigHeroSliderContext.Provider,
+    HomeConfigHeroSectionContext.Provider,
     {
-      value: { loading, heroSliderConfigData, onUpdateHeroSlider },
+      value: { loading, heroSection, onUpdateHeroSection },
       children: props.children
     }
   );
 };
-var useHomeConfigHeroSlider = () => useContext(HomeConfigHeroSliderContext);
+var useHomeConfigHeroSection = () => useContext(HomeConfigHeroSectionContext);
 var CustomPageConfigContext = createContext({
   selectedConfig: [],
   setSelectedConfig: () => null,
@@ -1136,28 +1210,26 @@ var CustomPageConfigContext = createContext({
   updateConfig: () => null,
   removeConfig: () => null,
   moveConfig: () => null,
-  heroSliderConfigData: [],
-  onUpdateHeroSlider: async () => void 0,
   loading: true
 });
 var CustomPageConfigProvider = (props) => {
   const { token } = useThemeEdit();
   const [selectedConfig, setSelectedConfig] = useState([]);
-  const [heroSliderConfigData, setHeroSliderConfigData] = useState([]);
+  const [heroSection, setHeroSection] = useState(null);
   const [loading, setLoading] = useState(true);
   const selectedConfigRef = useRef([]);
-  const heroSlidesRef = useRef([]);
+  const heroSectionRef = useRef(null);
   const saveQueueRef = useRef(Promise.resolve());
   const load = useCallback(async () => {
     setLoading(true);
     try {
       const row = await getCustomPageContent(props.pageId, token);
       const fromContent = splitCustomPageContent(row?.content);
-      const slides = Array.isArray(row?.hero_content) ? row.hero_content : fromContent.heroSlides;
+      const hero = row?.hero_content !== void 0 && row?.hero_content !== null ? readHeroSectionValue(row.hero_content) : fromContent.heroSection;
       selectedConfigRef.current = fromContent.blocks;
-      heroSlidesRef.current = slides;
+      heroSectionRef.current = hero;
       setSelectedConfig(fromContent.blocks);
-      setHeroSliderConfigData(slides);
+      setHeroSection(hero);
     } catch (e) {
       console.error("Error loading custom page content:", e);
     } finally {
@@ -1165,16 +1237,16 @@ var CustomPageConfigProvider = (props) => {
     }
   }, [props.pageId, token]);
   const persistLatest = useCallback(
-    (writeHeroField = false) => {
+    () => {
       const run = async () => {
         try {
           const blocks = selectedConfigRef.current;
-          const slides = heroSlidesRef.current;
+          const hero = heroSectionRef.current;
           await updateCustomPageContent(
             props.pageId,
             {
-              content: mergeCustomPageContent(blocks, slides),
-              ...writeHeroField ? { hero_content: slides } : {}
+              content: mergeCustomPageContent(blocks, hero),
+              hero_content: hero ? { type: hero.type, data: hero.data } : { type: null, data: null }
             },
             token
           );
@@ -1233,12 +1305,11 @@ var CustomPageConfigProvider = (props) => {
     },
     [persistLatest]
   );
-  const onUpdateHeroSlider = useCallback(
-    async (slidesToSave) => {
-      const slides = Array.isArray(slidesToSave) ? slidesToSave : [];
-      heroSlidesRef.current = slides;
-      setHeroSliderConfigData(slides);
-      await persistLatest(true);
+  const onUpdateHeroSection = useCallback(
+    async (next) => {
+      heroSectionRef.current = next;
+      setHeroSection(next);
+      await persistLatest();
     },
     [persistLatest]
   );
@@ -1255,14 +1326,12 @@ var CustomPageConfigProvider = (props) => {
         updateConfig,
         removeConfig,
         moveConfig,
-        heroSliderConfigData,
-        onUpdateHeroSlider,
         loading
       },
       children: /* @__PURE__ */ jsx(
-        HomeConfigHeroSliderContext.Provider,
+        HomeConfigHeroSectionContext.Provider,
         {
-          value: { loading, heroSliderConfigData, onUpdateHeroSlider },
+          value: { loading, heroSection, onUpdateHeroSection },
           children: props.children
         }
       )
@@ -1423,17 +1492,16 @@ var HeaderFooterProvider = (props) => {
   );
   const { token } = useThemeEdit();
   const themeConfig = useBusiness();
+  const themeId = themeConfig.theme.id;
   const [loading, setLoading] = useState(!hasInitial);
   const getThemeConfig = useCallback(async () => {
-    if (hasInitial) {
+    if (hasInitial || !themeId) {
+      if (!themeId) setLoading(false);
       return;
     }
     setLoading(true);
     try {
-      const response = await api.retrieveThemeContent(
-        themeConfig.theme.id,
-        props.page
-      );
+      const response = await api.retrieveThemeContent(themeId, props.page);
       response.slug === "header" && setHeaderConfig(response.data);
       response.slug === "footer" && setFooterConfig(response.data);
       response.slug === "announcement" && setAnnouncementConfig(response.data);
@@ -1442,7 +1510,7 @@ var HeaderFooterProvider = (props) => {
     } finally {
       setLoading(false);
     }
-  }, [themeConfig.theme.id, hasInitial, props.page]);
+  }, [themeId, hasInitial, props.page]);
   const onUpdateThemeContent = useCallback(
     async (configToUpdate) => {
       try {
@@ -1451,14 +1519,10 @@ var HeaderFooterProvider = (props) => {
           slug: props.page,
           platform: typeof window !== "undefined" ? "website" : "app"
         };
-        await api.updateThemeContent(
-          body,
-          themeConfig.theme.id,
-          props.page,
-          token
-        );
+        if (!themeId) return;
+        await api.updateThemeContent(body, themeId, props.page, token);
         const updatedResponse = await api.retrieveThemeContent(
-          themeConfig.theme.id,
+          themeId,
           props.page
         );
         updatedResponse.slug === "header" && setHeaderConfig(updatedResponse.data);
@@ -1470,7 +1534,7 @@ var HeaderFooterProvider = (props) => {
         setLoading(false);
       }
     },
-    [props.page, themeConfig.theme.id, token]
+    [props.page, themeId, token]
   );
   useEffect(() => {
     getThemeConfig();
@@ -1943,6 +2007,6 @@ var BaseProvider = ({
   return /* @__PURE__ */ jsx(StorageProvider, { storage, children: /* @__PURE__ */ jsx(ToastSupportProvider, { value: toast, children: /* @__PURE__ */ jsx(BusinessConfigProvider, { data: businessConfig, baseURL, children: /* @__PURE__ */ jsx(ReferralCodeProvider, { referralCodeFromUrl, children: /* @__PURE__ */ jsx(ThemeEditProvider, { isThemeEdit: isEdit, token, isHeader, isFooter, isAnnouncementBar, children: /* @__PURE__ */ jsx(BusinessMediaProvider, { children: /* @__PURE__ */ jsx(CustomerConfigProvider, { children: /* @__PURE__ */ jsx(AuthProvider, { children: /* @__PURE__ */ jsx(ModalProvider, { children: /* @__PURE__ */ jsx(LiveSupportWidgetProvider, { children: businessConfig.category.type == "retail" ? /* @__PURE__ */ jsx(ProductConfigProvider, { children: /* @__PURE__ */ jsx(CartWishlistRefreshProvider, { children: /* @__PURE__ */ jsx(CartProvider, { children: /* @__PURE__ */ jsx(WishlistProvider, { children: /* @__PURE__ */ jsx(FilterProvider, { children: /* @__PURE__ */ jsx(Fragment, { children }) }) }) }) }) }) : /* @__PURE__ */ jsx(MenuCartProvider, { children: /* @__PURE__ */ jsx(MenuFilterProvider, { children: /* @__PURE__ */ jsx(Fragment, { children }) }) }) }) }) }) }) }) }) }) }) }) });
 };
 
-export { AuthContext, AuthProvider, BaseProvider, BusinessConfigProvider, BusinessMediaContext, BusinessMediaProvider, CartContext, CartProvider, CartWishlistRefreshContext, CartWishlistRefreshProvider, CustomPageConfigContext, CustomPageConfigProvider, CustomerConfigContext, CustomerConfigProvider, FilterContext, FilterProvider, HeaderFooterContext, HeaderFooterProvider, HomeConfigContext, HomeConfigHeroSliderContext, HomeConfigHeroSliderProvider, HomeConfigProvider, LiveSupportWidgetProvider, MenuCartContext, MenuCartProvider, MenuFilterContext, MenuFilterProvider, ModalProvider, ProductConfigContext, ProductConfigProvider, ProductDetailContext, ProductDetailProvider, ReferralCodeProvider, StorageContext, StorageProvider, ThemeEditContext, ThemeEditProvider, ToastSupportProvider, WishlistContext, WishlistProvider, useAuth, useBusiness, useBusinessContext, useBusinessMedia, useCart, useCartWishlistRefresh, useCustomPageConfig, useCustomer, useFilter, useHeaderFooter, useHomeConfig, useHomeConfigHeroSlider, useLiveSupportWidget, useMenuCart, useMenuFilter, useModal, useProductConfig, useProductDetail, useReferralCode, useStorage, useThemeEdit, useToastSupport, useWishlist };
-//# sourceMappingURL=chunk-ID4JKOXT.js.map
-//# sourceMappingURL=chunk-ID4JKOXT.js.map
+export { AuthContext, AuthProvider, BaseProvider, BusinessConfigProvider, BusinessMediaContext, BusinessMediaProvider, CartContext, CartProvider, CartWishlistRefreshContext, CartWishlistRefreshProvider, CustomPageConfigContext, CustomPageConfigProvider, CustomerConfigContext, CustomerConfigProvider, FilterContext, FilterProvider, HERO_SECTION_SLUG, HeaderFooterContext, HeaderFooterProvider, HomeConfigContext, HomeConfigHeroSectionContext, HomeConfigHeroSectionProvider, HomeConfigProvider, LiveSupportWidgetProvider, MenuCartContext, MenuCartProvider, MenuFilterContext, MenuFilterProvider, ModalProvider, ProductConfigContext, ProductConfigProvider, ProductDetailContext, ProductDetailProvider, ReferralCodeProvider, StorageContext, StorageProvider, ThemeEditContext, ThemeEditProvider, ToastSupportProvider, WishlistContext, WishlistProvider, resolveHeroSection, useAuth, useBusiness, useBusinessContext, useBusinessMedia, useCart, useCartWishlistRefresh, useCustomPageConfig, useCustomer, useFilter, useHeaderFooter, useHomeConfig, useHomeConfigHeroSection, useLiveSupportWidget, useMenuCart, useMenuFilter, useModal, useProductConfig, useProductDetail, useReferralCode, useStorage, useThemeEdit, useToastSupport, useWishlist };
+//# sourceMappingURL=chunk-FOGKAOV4.js.map
+//# sourceMappingURL=chunk-FOGKAOV4.js.map