@pisell/private-materials 6.5.13 → 6.5.15

package/lib/components/ticketBooking/components/addServiceVariant/addService.js

@@ -41,7 +41,7 @@ var import_utils3 = require("../../../booking/info2/service/addService/utils");
 var import_utils4 = require("../../../booking/info/service2/utils");
 var import_utils5 = require("../../../booking/info/utils");
 var import_serviceManager = require("../../../booking/info/service/serviceManager");
-var import_productSelect = __toESM(require("../../../../plus/productSelect"));
+var import_ProductDisplayAdapter = __toESM(require("../ProductDisplayAdapter"));
 var import_index = require("./index.less");
 var import_utils6 = require("../../utils");
 var import_notAvailable = __toESM(require("../notAvailable"));
@@ -49,6 +49,7 @@ var import_dayjs = __toESM(require("dayjs"));
 var import_pisellos = require("../../hooks/pisellos");
 var import_utils7 = require("./utils");
 var import_materials = require("@pisell/materials");
+var import_IsActiveContext = require("../../context/IsActiveContext");
 var productListLayout = {
   grid: true,
   config: "12:12"
@@ -63,11 +64,20 @@ var productListSetting = {
 };
 var AddSerivce = (props) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
-  const { onEdit, state, dispatch, renderMode = "current", onPrerenderComplete } = props;
+  const {
+    onEdit,
+    state,
+    dispatch,
+    renderMode = "current",
+    onPrerenderComplete,
+    onGetProductsReady,
+    productDisplayConfig
+  } = props;
   const context = (0, import_useEngineContext.default)();
   const notAvailableRef = (0, import_react.useRef)(null);
   const isLoadedServiceRef = (0, import_react.useRef)(false);
   import_utils2.request.setRequest(context.appHelper.utils.request);
+  const isActive = (0, import_IsActiveContext.useIsActive)();
   const Toast = (0, import_materials.useToast)();
   const { createBookingData, createBooking } = (0, import_serviceManager.useService)({
     renderMode,
@@ -81,6 +91,7 @@ var AddSerivce = (props) => {
     (_i = context.appHelper.utils) == null ? void 0 : _i.businessUtils
   );
   const [currentProduct, setCurrentProduct] = (0, import_react.useState)(null);
+  const [firstLoading, setFirstLoading] = (0, import_react.useState)(true);
   const stateRef = (0, import_react.useRef)(state);
   stateRef.current = state;
   const prerenderCompletedRef = (0, import_react.useRef)(false);
@@ -100,7 +111,20 @@ var AddSerivce = (props) => {
       return stateValue;
     }
   };
-  const { getProducts, products, loading } = (0, import_pisellos.useProducts)();
+  const { getProducts, products, loading, getScheduleTimePoints } = (0, import_pisellos.useProducts)();
+  (0, import_react.useEffect)(() => {
+    if (onGetProductsReady && getProducts) {
+      onGetProductsReady(getProducts);
+    }
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const timer = setTimeout(() => {
+      setFirstLoading(false);
+    }, 300);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, []);
   (0, import_react.useEffect)(() => {
     return () => {
       Object.values(debounceTimersRef.current).forEach((timer) => {
@@ -140,24 +164,31 @@ var AddSerivce = (props) => {
     return ((_b2 = (_a2 = state.client) == null ? void 0 : _a2.value) == null ? void 0 : _b2.id) || void 0;
   }, [(_m = (_l = state.client) == null ? void 0 : _l.value) == null ? void 0 : _m.id]);
   const scanAddService = (0, import_ahooks.useMemoizedFn)((list, code) => {
-    let newService = [...state.service.value];
+    let newService = [...stateRef.current.service.value || []];
     list.forEach((item) => {
       if ((0, import_utils7.isBundle)(item) || (0, import_utils7.isOption)(item)) {
         handleSelectProduct(item);
         return;
       }
       const values = (0, import_utils7.genValues)(item, code);
-      let cacheItem = (0, import_utils7.createCacheItem)(item, values, state);
+      let cacheItem = (0, import_utils7.createCacheItem)(item, values, stateRef.current);
       cacheItem._serviceKey = (0, import_utils6.genServiceKey)(cacheItem);
       cacheItem.autoClose = false;
       let { list: _list, quantity } = (0, import_utils6.addService)(
         [...newService],
         cacheItem,
-        state
+        stateRef.current
       );
       handleAddToast(cacheItem.title, quantity);
       newService = _list;
     });
+    stateRef.current = {
+      ...stateRef.current,
+      service: {
+        ...stateRef.current.service,
+        value: newService
+      }
+    };
     dispatch({
       type: "setService",
       payload: {
@@ -167,8 +198,10 @@ var AddSerivce = (props) => {
     });
   });
   (0, import_react.useMemo)(() => {
-    (0, import_utils7.setHandleSetService)(scanAddService);
-  }, []);
+    if (isActive) {
+      (0, import_utils7.setHandleSetService)(scanAddService);
+    }
+  }, [isActive]);
   const handleAddToast = (title, quantity) => {
     var _a2;
     (_a2 = Toast == null ? void 0 : Toast.success) == null ? void 0 : _a2.call(
@@ -200,221 +233,268 @@ var AddSerivce = (props) => {
       }, 0);
     }
   );
-  const handleSelectProduct = (0, import_ahooks.useMemoizedFn)(
-    (item, type = "select") => {
-      var _a2, _b2, _c2, _d2;
-      console.log("handleSelectProduct");
-      if (!(0, import_utils4.isNormalProductByDurationSchedule)(item)) {
-        if (!Array.isArray((_a2 = state.service) == null ? void 0 : _a2.resourcesOrigin) || !state.service.resourcesOrigin.length) {
-          dispatch({
-            type: "setService",
-            payload: {
-              ...stateRef.current.service,
-              reloadResourceModal: true
-            }
-          });
-          return;
-        }
+  const checkResourceAvailability = (0, import_ahooks.useMemoizedFn)((item) => {
+    var _a2;
+    if (!(0, import_utils4.isNormalProductByDurationSchedule)(item)) {
+      if (!Array.isArray((_a2 = state.service) == null ? void 0 : _a2.resourcesOrigin) || !state.service.resourcesOrigin.length) {
+        dispatch({
+          type: "setService",
+          payload: {
+            ...stateRef.current.service,
+            reloadResourceModal: true
+          }
+        });
+        return false;
       }
-      const isSession = (0, import_utils2.isSessionProduct)(item);
-      const isEject = (0, import_utils2.getIsEject)(item, type);
-      const isOnlySession = (0, import_utils2.getIsOnlySession)(item);
-      let lock = false;
-      let cacheValues = null;
-      if (isEject) {
-        setCurrentProduct(item);
-      } else {
-        setCurrentProduct(null);
-        if ((item == null ? void 0 : item.extension_type) === "normal") {
-          cacheValues = {
-            bundle: [],
-            key: item.id,
-            option: [],
-            product_id: item.id,
-            product_variant_id: 0,
-            quantity: 1,
-            rowKey: item.id,
-            session: null,
-            unique: "08974625397",
-            _originalItem: item
-            // 保存原始商品信息
-          };
-        }
+    }
+    return true;
+  });
+  const createCacheItemFromParams = (0, import_ahooks.useMemoizedFn)((item, params, detail) => {
+    var _a2;
+    const _detail = detail || item;
+    const other = JSON.parse(JSON.stringify(params));
+    other.session = params.session;
+    let cacheItem = {
+      ..._detail,
+      product_id: item.id,
+      _id: (0, import_utils.getUniqueId)(),
+      _key: params.key,
+      _extend: {
+        start_date: state.date.value,
+        quantity: (params == null ? void 0 : params.quantity) || 1,
+        price: _detail.price,
+        product_name: item.title,
+        other
+      },
+      new: 1
+    };
+    let _total = (0, import_utils2.getProductTotalPrice)(cacheItem);
+    cacheItem._extend.total = _total;
+    cacheItem._extend.origin_total = _total;
+    const _isEdit = !!state.service.cacheItem;
+    if (_isEdit) {
+      cacheItem._id = (_a2 = state.service.cacheItem) == null ? void 0 : _a2._id;
+      cacheItem.new = 0;
+    }
+    if (renderMode === "current") {
+      cacheItem.currentDefaultTime = state.date.value.format("HH:mm");
+    }
+    cacheItem = (0, import_utils3.getProductExtend)({
+      cacheItem,
+      state,
+      isDisabledTime: true
+    });
+    if (state.renderType === "eventBooking") {
+      cacheItem.autoClose = false;
+    }
+    return cacheItem;
+  });
+  const getProductKey = (0, import_ahooks.useMemoizedFn)((item, cacheItem) => {
+    return cacheItem._serviceKey || `${item.id}_${cacheItem._key}`;
+  });
+  const getServiceQuantity = (0, import_ahooks.useMemoizedFn)((cacheItem) => {
+    var _a2, _b2;
+    const existingService = (_a2 = stateRef.current.service.value) == null ? void 0 : _a2.find(
+      (val) => (0, import_utils6.isSameProduct)(val, cacheItem)
+    );
+    return ((_b2 = existingService == null ? void 0 : existingService._extend) == null ? void 0 : _b2.quantity) || 0;
+  });
+  const processAutoCloseService = (0, import_ahooks.useMemoizedFn)((cacheItem, item, detail, notShowToast) => {
+    cacheItem.autoClose = false;
+    cacheItem._serviceKey = (0, import_utils6.genServiceKey)(cacheItem);
+    const productKey = getProductKey(item, cacheItem);
+    if (pendingCacheValuesRef.current[productKey]) {
+      clickCountRef.current[productKey] = (clickCountRef.current[productKey] || 1) + 1;
+    } else {
+      pendingCacheValuesRef.current[productKey] = { cacheItem, item, detail, notShowToast };
+      clickCountRef.current[productKey] = 1;
+    }
+    if (!notShowToast) {
+      const originalQuantity = getServiceQuantity(cacheItem);
+      const currentClickCount = clickCountRef.current[productKey] || 1;
+      const totalQuantity = originalQuantity + currentClickCount;
+      handleAddToast(cacheItem.title, totalQuantity);
+    }
+    if (debounceTimersRef.current[productKey]) {
+      clearTimeout(debounceTimersRef.current[productKey]);
+    }
+    debounceTimersRef.current[productKey] = setTimeout(() => {
+      executeServiceDispatch(productKey);
+    }, 300);
+  });
+  const executeServiceDispatch = (0, import_ahooks.useMemoizedFn)((productKey) => {
+    const pendingData = pendingCacheValuesRef.current[productKey];
+    if (!pendingData) return;
+    const { cacheItem, item, detail } = pendingData;
+    const clickCount = clickCountRef.current[productKey] || 1;
+    const finalCacheItem = {
+      ...cacheItem,
+      _extend: {
+        ...cacheItem._extend,
+        quantity: clickCount
       }
-      const callback = async (e, extension_type, detail, notShowToast) => {
-        var _a3, _b3, _c3, _d3, _e2, _f2, _g2;
-        setCurrentProduct(null);
-        lock = true;
-        setTimeout(() => {
-          lock = false;
-        }, 2e3);
-        if (!isBooking4) {
-          const data = await createBookingData({
-            product: { ...detail || item, _params: e }
-          });
-          createBooking({ booking: data });
-          return;
-        }
-        const _currentItem = detail || item;
-        const _detail = _currentItem;
-        const other = JSON.parse(JSON.stringify(e));
-        other.session = e.session;
-        let cacheItem = {
-          ..._detail,
-          product_id: _currentItem.id,
-          _id: (0, import_utils.getUniqueId)(),
-          _key: e.key,
-          _extend: {
-            start_date: state.date.value,
-            quantity: (e == null ? void 0 : e.quantity) || 1,
-            price: _detail.price,
-            product_name: _currentItem.title,
-            other
-          },
-          new: 1
-        };
-        let _total = (0, import_utils2.getProductTotalPrice)(cacheItem);
-        cacheItem._extend.total = _total;
-        cacheItem._extend.origin_total = _total;
-        const _isEdit = !!state.service.cacheItem;
-        if (_isEdit) {
-          cacheItem._id = (_a3 = state.service.cacheItem) == null ? void 0 : _a3._id;
-          cacheItem.new = 0;
-        }
-        if (renderMode === "current") {
-          cacheItem.currentDefaultTime = state.date.value.format("HH:mm");
+    };
+    let { list: _list, quantity } = (0, import_utils6.addService)(
+      [...stateRef.current.service.value || []],
+      finalCacheItem,
+      stateRef.current
+    );
+    window.dispatchEvent(
+      new CustomEvent("onAddNewService", {
+        detail: {
+          cacheItem: finalCacheItem
         }
-        cacheItem = (0, import_utils3.getProductExtend)({
-          cacheItem,
-          state,
-          isDisabledTime: true
+      })
+    );
+    logServiceForSpecificShop(item, detail, _list);
+    stateRef.current = {
+      ...stateRef.current,
+      service: {
+        ...stateRef.current.service,
+        value: _list
+      }
+    };
+    dispatch({
+      type: "setService",
+      payload: {
+        addModal: false,
+        value: _list,
+        edit: true,
+        changeService: false
+      }
+    });
+    delete pendingCacheValuesRef.current[productKey];
+    delete clickCountRef.current[productKey];
+    delete debounceTimersRef.current[productKey];
+  });
+  const processManualEditService = (0, import_ahooks.useMemoizedFn)((cacheItem) => {
+    var _a2;
+    (_a2 = window.openBookingEditModal) == null ? void 0 : _a2.call(window);
+    dispatch({
+      type: "setService",
+      payload: {
+        editModal: true,
+        cacheItem,
+        addModal: !cacheItem.autoClose,
+        changeService: false
+      }
+    });
+    onEdit == null ? void 0 : onEdit(cacheItem);
+  });
+  const logServiceForSpecificShop = (0, import_ahooks.useMemoizedFn)((item, detail, _list) => {
+    var _a2, _b2, _c2, _d2, _e2;
+    try {
+      if (((_e2 = (_d2 = (_c2 = (_b2 = (_a2 = context.appHelper.utils.store) == null ? void 0 : _a2.getState) == null ? void 0 : _b2.call(_a2)) == null ? void 0 : _c2.global) == null ? void 0 : _d2.globalConfig) == null ? void 0 : _e2.id) === 2155) {
+        const val = _list == null ? void 0 : _list.map((s) => {
+          return {
+            product_id: s == null ? void 0 : s.product_id,
+            detailId: s == null ? void 0 : s.id,
+            detailProductId: s == null ? void 0 : s.product_id,
+            product_name: s == null ? void 0 : s.title,
+            price: s == null ? void 0 : s.price,
+            _id: s == null ? void 0 : s._id,
+            _key: s == null ? void 0 : s._key,
+            _serviceKey: s == null ? void 0 : s._serviceKey
+          };
         });
-        if (state.renderType === "eventBooking") {
-          cacheItem.autoClose = false;
-        }
-        if (cacheItem.autoClose) {
-          cacheItem.autoClose = false;
-          cacheItem._serviceKey = (0, import_utils6.genServiceKey)(cacheItem);
-          const val = getCurrentServiceValue();
-          let { list: _list, quantity } = (0, import_utils6.addService)(
-            [...val],
-            cacheItem,
-            state
-          );
-          latestServiceValueRef.current = _list;
-          lastOperationTimeRef.current = Date.now();
-          if (!notShowToast) {
-            handleAddToast(cacheItem.title, quantity || 1);
-          }
-          window.dispatchEvent(
-            new CustomEvent("onAddNewService", {
-              detail: {
-                cacheItem
-              }
-            })
-          );
-          try {
-            if (((_f2 = (_e2 = (_d3 = (_c3 = (_b3 = context.appHelper.utils.store) == null ? void 0 : _b3.getState) == null ? void 0 : _c3.call(_b3)) == null ? void 0 : _d3.global) == null ? void 0 : _e2.globalConfig) == null ? void 0 : _f2.id) === 2155) {
-              const val2 = _list == null ? void 0 : _list.map((s) => {
-                return {
-                  product_id: s == null ? void 0 : s.product_id,
-                  detailId: s == null ? void 0 : s.id,
-                  detailProductId: s == null ? void 0 : s.product_id,
-                  product_name: s == null ? void 0 : s.title,
-                  price: s == null ? void 0 : s.price,
-                  _id: s == null ? void 0 : s._id,
-                  _key: s == null ? void 0 : s._key,
-                  _serviceKey: s == null ? void 0 : s._serviceKey
-                };
-              });
-              const sendData = {
-                product_id: _currentItem == null ? void 0 : _currentItem.id,
-                detailId: _detail == null ? void 0 : _detail.id,
-                detailProductId: _detail == null ? void 0 : _detail.product_id,
-                product_name: _currentItem == null ? void 0 : _currentItem.title,
-                price: _detail == null ? void 0 : _detail.price,
-                serviceVal: val2
-              };
-              (0, import_utils.sendWarningLog)({
-                title: "addService",
-                content: [
-                  { key: "添加数据", value: JSON.stringify(sendData) },
-                  {
-                    key: "日期",
-                    value: (0, import_dayjs.default)().format("YYYY-MM-DD HH:mm:ss")
-                  }
-                ]
-              });
-            }
-          } catch (error) {
-          }
-          dispatch({
-            type: "setService",
-            payload: {
-              addModal: false,
-              value: _list,
-              edit: true,
-              changeService: false
-            }
-          });
-        } else {
-          (_g2 = window.openBookingEditModal) == null ? void 0 : _g2.call(window);
-          dispatch({
-            type: "setService",
-            payload: {
-              editModal: true,
-              cacheItem,
-              addModal: !cacheItem.autoClose,
-              changeService: false
+        const sendData = {
+          product_id: item == null ? void 0 : item.id,
+          detailId: detail == null ? void 0 : detail.id,
+          detailProductId: detail == null ? void 0 : detail.product_id,
+          product_name: item == null ? void 0 : item.title,
+          price: detail == null ? void 0 : detail.price,
+          serviceVal: val
+        };
+        (0, import_utils.sendWarningLog)({
+          title: "addService",
+          content: [
+            { key: "添加数据", value: JSON.stringify(sendData) },
+            {
+              key: "日期",
+              value: (0, import_dayjs.default)().format("YYYY-MM-DD HH:mm:ss")
             }
-          });
-          onEdit == null ? void 0 : onEdit(cacheItem);
-        }
-      };
-      if (cacheValues) {
-        const productId = item.id.toString();
-        if (pendingCacheValuesRef.current[productId]) {
-          clickCountRef.current[productId] = (clickCountRef.current[productId] || 1) + 1;
-        } else {
-          pendingCacheValuesRef.current[productId] = cacheValues;
-          clickCountRef.current[productId] = 1;
-        }
-        const cacheItem = (0, import_utils6.createSimpleCacheItem)(item, cacheValues, state);
-        const detail = (_b2 = state.service.value) == null ? void 0 : _b2.find(
-          (val) => (0, import_utils6.isSameProduct)(val, cacheItem)
-        );
-        const originalQuantity = ((_c2 = detail == null ? void 0 : detail._extend) == null ? void 0 : _c2.quantity) || 0;
-        (_d2 = Toast == null ? void 0 : Toast.success) == null ? void 0 : _d2.call(
-          Toast,
-          /* @__PURE__ */ import_react.default.createElement("div", { className: "add-toast-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "add-toast-title" }, item.title), /* @__PURE__ */ import_react.default.createElement("div", { className: "add-toast-quantity" }, import_utils.locales.getText("pisell2.ticket-booking.in-cart")(
-            (clickCountRef.current[productId] || 1) + originalQuantity
-          )))
-        );
-        debouncedExecuteCacheValues(productId, cacheValues, item, callback);
+          ]
+        });
+      }
+    } catch (error) {
+    }
+  });
+  const handleBookingCreation = (0, import_ahooks.useMemoizedFn)(async (item, params, detail) => {
+    const data = await createBookingData({
+      product: { ...detail || item, _params: params }
+    });
+    createBooking({ booking: data });
+  });
+  const handleBooking4Service = (0, import_ahooks.useMemoizedFn)((item, params, detail, notShowToast) => {
+    const cacheItem = createCacheItemFromParams(item, params, detail);
+    if (cacheItem.autoClose) {
+      processAutoCloseService(cacheItem, item, detail, notShowToast);
+    } else {
+      processManualEditService(cacheItem);
+    }
+  });
+  const handleDirectAddService = (0, import_ahooks.useMemoizedFn)(async (item) => {
+    console.log(item, "handleSelectProduct33", "_list_list");
+    if (!isBooking4) {
+      await handleBookingCreation(item, item.cartDetailValue);
+      return;
+    }
+    const cacheItem = createCacheItemFromParams(item, item.cartDetailValue);
+    if (cacheItem.autoClose) {
+      processAutoCloseService(cacheItem, item, item, false);
+    } else {
+      processManualEditService(cacheItem);
+    }
+  });
+  const createProductModalCallback = (0, import_ahooks.useMemoizedFn)((item) => {
+    return async (e, extension_type, detail, notShowToast) => {
+      setCurrentProduct(null);
+      if (!isBooking4) {
+        await handleBookingCreation(item, e, detail);
         return;
       }
-      state.action({
-        type: "pisell1.handleOpenProductModal",
-        data: {
-          id: item.id,
-          date: state.date.value.format("YYYY-MM-DD"),
-          showConfig: {
-            option: true,
-            session: isSession,
-            variant: true,
-            package: true,
-            number: (0, import_utils6.getIsShowNumber)(item, state)
-          },
-          isOnlySession,
-          is_eject: isEject ? 1 : 0,
-          customer_id: customerId,
-          isOS: isSession
-        },
-        onCancel: () => {
-          setCurrentProduct(null);
+      handleBooking4Service(item, e, detail, notShowToast);
+    };
+  });
+  const openProductModal = (0, import_ahooks.useMemoizedFn)((item, type = "select") => {
+    const isSession = (0, import_utils2.isSessionProduct)(item);
+    const isOnlySession = (0, import_utils2.getIsOnlySession)(item);
+    const isEject = (0, import_utils2.getIsEject)(item, type);
+    state.action({
+      type: "pisell1.handleOpenProductModal",
+      data: {
+        id: item.id,
+        date: state.date.value.format("YYYY-MM-DD"),
+        productDetail: item,
+        showConfig: {
+          option: true,
+          session: isSession,
+          variant: true,
+          package: true,
+          number: (0, import_utils6.getIsShowNumber)(item, state)
         },
-        callback
-      });
+        isOnlySession,
+        is_eject: isEject ? 1 : 0,
+        customer_id: customerId,
+        isOS: isSession
+      },
+      onCancel: () => {
+        setCurrentProduct(null);
+      },
+      callback: createProductModalCallback(item)
+    });
+  });
+  const handleSelectProduct = (0, import_ahooks.useMemoizedFn)(
+    async (item, type = "select") => {
+      console.log(item, "handleSelectProduct");
+      if (!checkResourceAvailability(item)) {
+        return;
+      }
+      if (!item.isOpenDetailModal) {
+        await handleDirectAddService(item);
+        return;
+      }
+      openProductModal(item, type);
     }
   );
   const renderList = (0, import_react.useMemo)(() => {
@@ -442,24 +522,42 @@ var AddSerivce = (props) => {
         menu_list_ids: menuList,
         schedule_datetime: currentDatetime
       });
+      getScheduleTimePoints({
+        menu_list_ids: menuList
+      });
+    }
+  }, [renderMode, customerId, menuList]);
+  const finalDisplayConfig = (0, import_react.useMemo)(() => {
+    var _a2, _b2;
+    const resolvedConfig = (0, import_ProductDisplayAdapter.resolveProductDisplayConfig)(productDisplayConfig);
+    if (resolvedConfig.displayMode === "product-select") {
+      return {
+        ...resolvedConfig,
+        productSelectConfig: {
+          ...resolvedConfig.productSelectConfig,
+          layout: ((_a2 = resolvedConfig.productSelectConfig) == null ? void 0 : _a2.layout) || productListLayout,
+          productListSetting: ((_b2 = resolvedConfig.productSelectConfig) == null ? void 0 : _b2.productListSetting) || productListSetting
+        }
+      };
     }
-  }, [renderMode, currentDate, customerId, menuList, currentDatetime]);
+    return resolvedConfig;
+  }, [productDisplayConfig]);
   return (0, import_react.useMemo)(() => {
     if (renderMode === "current") {
       return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
-        import_productSelect.default,
+        import_ProductDisplayAdapter.default,
         {
+          config: finalDisplayConfig,
           dataSource: renderList,
-          layout: productListLayout,
-          onChange: handleSelectProduct,
-          value: currentProduct == null ? void 0 : currentProduct.id,
-          loading: !renderList.length && loading,
-          productListSetting
+          loading: !renderList.length && loading || firstLoading,
+          currentProductId: currentProduct == null ? void 0 : currentProduct.id,
+          onSelectProduct: handleSelectProduct
         }
       ), /* @__PURE__ */ import_react.default.createElement(import_notAvailable.default, { ref: notAvailableRef }));
     }
     return null;
   }, [
+    firstLoading,
     state.service.addModal,
     import_utils.locales,
     renderList,
@@ -469,7 +567,8 @@ var AddSerivce = (props) => {
     (0, import_utils4.holderId)(state),
     loading,
     currentProduct,
-    isBooking4
+    isBooking4,
+    finalDisplayConfig
   ]);
 };
 var addService_default = AddSerivce;

package/lib/components/ticketBooking/components/addServiceVariant/index.d.ts

@@ -1,7 +1,10 @@
+import { ProductDisplayConfig, ProductDisplayPresetKey } from '../ProductDisplayAdapter/types';
 interface AddServiceVariantProps {
     globalState: any;
     setGlobalState: any;
     onPrerenderComplete?: () => void;
+    onGetProductsReady?: (getProducts: any) => void;
+    productDisplayConfig?: ProductDisplayPresetKey | ProductDisplayConfig;
 }
 declare const AddServiceVariant: (props: AddServiceVariantProps) => JSX.Element;
 export default AddServiceVariant;