@orderingstack/front-components-product-configurator 1.4.2-beta.20 → 1.4.2-beta.22

package/dist/index.es.js

@@ -6895,12 +6895,14 @@ const getProductToChangeInForm = (product, isFilterValidated) => {
   return { productsToSelect, productsToUnselect };
 };
 const unselectProductsInForm = (productsToUnselect, setValueInForm) => {
+  console.log("LOG1 productsToUnselect", productsToUnselect);
   productsToUnselect.map(({ selCtx, id }) => {
     setValueInForm(`selected.${selCtx}.${id}`, false);
   });
 };
-const selectProductsInForm = (productToUnselect, setValueInForm, initialSelectedState) => {
-  productToUnselect.map(({ selCtx, id }) => {
+const selectProductsInForm = (productToSelect, setValueInForm, initialSelectedState) => {
+  console.log("LOG1 productToSelect", productToSelect);
+  productToSelect.map(({ selCtx, id }) => {
     var _a;
     const productInInitialState = (_a = initialSelectedState[selCtx]) == null ? void 0 : _a[id];
     if (productInInitialState) {
@@ -6916,8 +6918,9 @@ function useMenuOptions(product, nestedLvl, parentKind, parentSelCtx) {
   useStore((state) => state.filter);
   const initialSelected = useStore((state) => state.initialSelected);
   const currency = useStore((state) => state.currency);
-  const { setValue, getValues } = useFormContext();
-  const { selected = {}, filter = {} } = getValues();
+  const { setValue, getValues, watch } = useFormContext();
+  const selected = watch("selected");
+  const filter = watch("filter");
   const isFilterValidated = validateProductFilter(product, filter);
   const isOnSubmitted = useStore((state) => state.isOnSubmitted);
   const setValidationMap = useStore((state) => state.setValidationMap);
@@ -6937,16 +6940,15 @@ function useMenuOptions(product, nestedLvl, parentKind, parentSelCtx) {
     parentKind
   });
   useEffect(() => {
-    console.log("isFilterValidated useEffect");
     const { productsToSelect, productsToUnselect } = getProductToChangeInForm(
       product,
       isFilterValidated
     );
-    console.log({ productsToSelect });
-    console.log({ productsToUnselect });
-    unselectProductsInForm(productsToUnselect, setValue);
+    console.log("LOG1 useMenuOptions useEffect productsToUnselect", productsToUnselect);
+    console.log("LOG1 useMenuOptions useEffect productsToSelect", productsToSelect);
     selectProductsInForm(productsToSelect, setValue, initialSelected);
-  }, [isFilterValidated, initialSelected]);
+    unselectProductsInForm(productsToUnselect, setValue);
+  }, [isFilterValidated, selected]);
   return {
     isFilterValidated,
     selected,
@@ -11027,7 +11029,6 @@ function ProductConfigurator(props) {
   const {
     encodedProduct,
     initSelected,
-    filter,
     productQuantity,
     setIsOnSubmittedOnTrue,
     getInvalidSelCtxArray,
@@ -11049,7 +11050,6 @@ function ProductConfigurator(props) {
       setValidationMap(validationMapNew);
     }
   });
-  console.log("ProductConfigurator initSelected", initSelected);
   const methods = useForm({
     defaultValues: {
       selected: initSelected
@@ -11071,6 +11071,8 @@ function ProductConfigurator(props) {
     } else {
       console.log("selected", getValues("selected"));
       const decodedCleanedSelected = decodeSelected(cleanSelected(getValues("selected")));
+      const filter = getValues("filter");
+      console.log("filter", filter);
       console.log("decodedCleanedSelected: ", decodedCleanedSelected);
       handleAddToCart({
         price: countedProductPrice,