@plusscommunities/pluss-feature-builder-web-c 1.0.4 → 1.0.6-beta.0

package/dist/index.cjs.js

@@ -48,40 +48,40 @@ var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_obje
    It can be swapped prior to publishing via copy:set
 */
 const values = {
-  featureKey: "feature-builder-c",
-  featureKeyRoute: "/feature-builder-c",
+  featureKey: "feature-builder-d",
+  featureKeyRoute: "/feature-builder-d",
   // Dynamic route prefix
-  featureId: "feature-builder-c-default",
+  featureId: "feature-builder-d-default",
   // Fixed ID for the single feature definition
-  reducerKey: "featureBuilderC",
+  reducerKey: "featureBuilderD",
   // Define reducer 'slice' key.
-  singularName: "Build Your Feature C",
-  description: "Create custom forms for mobile application (Variant C).",
+  singularName: "Build Your Feature D",
+  description: "Create custom forms for mobile application (Variant D).",
   emptyText: "No custom forms available",
-  textMenuTitle: "Build Your Feature C",
-  textPermissionFeatureBuilderDefinition: "Build Your Feature C Definition",
-  textPermissionFeatureBuilderContent: "Create and Manage Content in Build Your Feature C",
+  textMenuTitle: "Build Your Feature D",
+  textPermissionFeatureBuilderDefinition: "Build Your Feature D Definition",
+  textPermissionFeatureBuilderContent: "Create and Manage Content in Build Your Feature D",
   // Routes
-  routeFormOverviewStep: "/feature-builder-c/definition/overview",
-  routeFormFieldsStep: "/feature-builder-c/definition/fields",
-  routeFormLayoutStep: "/feature-builder-c/definition/layout",
-  routeListingScreen: "/feature-builder-c/listing",
-  routeCreateListing: "/feature-builder-c/listing/create",
-  routeEditListing: "/feature-builder-c/listing/edit/:id",
+  routeFormOverviewStep: "/feature-builder-d/definition/overview",
+  routeFormFieldsStep: "/feature-builder-d/definition/fields",
+  routeFormLayoutStep: "/feature-builder-d/definition/layout",
+  routeListingScreen: "/feature-builder-d/listing",
+  routeCreateListing: "/feature-builder-d/listing/create",
+  routeEditListing: "/feature-builder-d/listing/edit/:id",
   // Screen names
-  screenFormOverviewStep: "FormOverviewStepC",
-  screenFormFieldsStep: "FormFieldsStepC",
-  screenFormLayoutStep: "FormLayoutStepC",
-  screenListingScreen: "ListingScreenC",
+  screenFormOverviewStep: "FormOverviewStepD",
+  screenFormFieldsStep: "FormFieldsStepD",
+  screenFormLayoutStep: "FormLayoutStepD",
+  screenListingScreen: "ListingScreenD",
   // Page names
-  pageCreateListing: "CreateListingPageC",
-  pageEditListing: "EditListingPageC",
+  pageCreateListing: "CreateListingPageD",
+  pageEditListing: "EditListingPageD",
   // Permissions
-  permissionFeatureBuilderDefinition: "featureBuilderDefinitionC",
-  permissionFeatureBuilderContent: "featureBuilderContentC",
+  permissionFeatureBuilderDefinition: "featureBuilderDefinitionD",
+  permissionFeatureBuilderContent: "featureBuilderContentD",
   // Menu
   menuIcon: "tool",
-  menuKey: "feature-builder-definition-c",
+  menuKey: "feature-builder-definition-d",
   menuIsFontAwesome: true,
   menuOrder: 20,
   // Lower number = higher priority
@@ -577,8 +577,8 @@ const DeleteConfirmationPopup = _ref => {
   }, "Please wait while we delete the ", itemText, "...")));
 };
 
-var css$v = ".FeatureBuilderSuccessPopup_module_successContent__5b4b36c2 {\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tgap: 20px;\n\tpadding: 20px 0;\n}\n\n.FeatureBuilderSuccessPopup_module_gifPlaceholder__5b4b36c2 {\n\twidth: 100%;\n\tmax-width: 400px;\n}\n\n.FeatureBuilderSuccessPopup_module_gifContainer__5b4b36c2 {\n\twidth: 100%;\n\theight: 200px;\n\tbackground-color: #f5f5f5;\n\tborder: 2px dashed #ccc;\n\tborder-radius: 8px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.FeatureBuilderSuccessPopup_module_gifPlaceholderText__5b4b36c2 {\n\tcolor: #999;\n\tfont-size: 14px;\n\ttext-align: center;\n\tpadding: 20px;\n}\n\n.FeatureBuilderSuccessPopup_module_successMessage__5b4b36c2 {\n\ttext-align: center;\n\tcolor: #666;\n\tfont-size: 16px;\n\tline-height: 1.5;\n\tmax-width: 400px;\n}\n\n.FeatureBuilderSuccessPopup_module_featureName__5b4b36c2 {\n\tfont-weight: 600;\n\tcolor: #333;\n}\n";
-var modules_b5a7fccb = {"successContent":"FeatureBuilderSuccessPopup_module_successContent__5b4b36c2","gifPlaceholder":"FeatureBuilderSuccessPopup_module_gifPlaceholder__5b4b36c2","gifContainer":"FeatureBuilderSuccessPopup_module_gifContainer__5b4b36c2","gifPlaceholderText":"FeatureBuilderSuccessPopup_module_gifPlaceholderText__5b4b36c2","successMessage":"FeatureBuilderSuccessPopup_module_successMessage__5b4b36c2","featureName":"FeatureBuilderSuccessPopup_module_featureName__5b4b36c2"};
+var css$v = ".FeatureBuilderSuccessPopup_module_successContent__a6544e11 {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 20px;\n\tpadding: 20px 0;\n}\n\n.FeatureBuilderSuccessPopup_module_gifPlaceholder__a6544e11 {\n\twidth: 100%;\n\tmax-width: 400px;\n}\n\n.FeatureBuilderSuccessPopup_module_gifContainer__a6544e11 {\n\twidth: 100%;\n\theight: 200px;\n\tbackground-color: #f5f5f5;\n\tborder: 2px dashed #ccc;\n\tborder-radius: 8px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.FeatureBuilderSuccessPopup_module_gifPlaceholderText__a6544e11 {\n\tcolor: #999;\n\tfont-size: 14px;\n\ttext-align: center;\n\tpadding: 20px;\n}\n\n.FeatureBuilderSuccessPopup_module_successMessage__a6544e11 {\n\tfont-size: 16px;\n\tline-height: 1.5;\n\tmax-width: 400px;\n\tcolor: #181c4a;\n}\n\n.FeatureBuilderSuccessPopup_module_featureName__a6544e11 {\n\tfont-weight: 600;\n\tcolor: #333;\n}\n";
+var modules_b5a7fccb = {"successContent":"FeatureBuilderSuccessPopup_module_successContent__a6544e11","gifPlaceholder":"FeatureBuilderSuccessPopup_module_gifPlaceholder__a6544e11","gifContainer":"FeatureBuilderSuccessPopup_module_gifContainer__a6544e11","gifPlaceholderText":"FeatureBuilderSuccessPopup_module_gifPlaceholderText__a6544e11","successMessage":"FeatureBuilderSuccessPopup_module_successMessage__a6544e11","featureName":"FeatureBuilderSuccessPopup_module_featureName__a6544e11"};
 n(css$v,{});
 
 const {
@@ -591,8 +591,7 @@ const FeatureBuilderSuccessPopup = _ref => {
   let {
     isOpen,
     onClose,
-    featureName,
-    displayName
+    featureName
   } = _ref;
   if (!isOpen) {
     return null;
@@ -603,9 +602,10 @@ const FeatureBuilderSuccessPopup = _ref => {
     onClick: onClose,
     isActive: true
   }];
+  const capitalisedName = featureName && featureName[0].toUpperCase() + featureName.slice(1);
   return /*#__PURE__*/React__default["default"].createElement(Popup$3, {
-    title: "".concat(featureName, " Created"),
-    subtitle: /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", null, featureName), " is now saved and available for your communities!"),
+    title: "".concat(capitalisedName, " Created"),
+    subtitle: /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, capitalisedName, " is now saved and available for your communities!"),
     onClose: onClose,
     buttons: buttons,
     hasPadding: true,
@@ -615,9 +615,9 @@ const FeatureBuilderSuccessPopup = _ref => {
     className: modules_b5a7fccb.successContent
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: modules_b5a7fccb.successMessage
-  }, "To activate this feature, please add it to your sites using the Feature Picker."), /*#__PURE__*/React__default["default"].createElement("div", {
+  }, capitalisedName, " is saved and ready to go. To use it, add it to your site using the ", /*#__PURE__*/React__default["default"].createElement("b", null, "Feature Picker.")), /*#__PURE__*/React__default["default"].createElement("div", {
     className: modules_b5a7fccb.successMessage
-  }, "Team members with the right permissions can start creating content for the communities that have installed the feature.")));
+  }, "Once added, your team can start creating content for the feature.")));
 };
 
 var css$u = ".FeatureBuilderWelcomePopup_module_welcomeContent__0e08704b {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 20px;\n\tpadding: 20px 0;\n}\n\n.FeatureBuilderWelcomePopup_module_welcomeMessage__0e08704b {\n\tcolor: #666;\n\tfont-size: 16px;\n\tline-height: 1.6;\n\twidth: 100%;\n}\n\n.FeatureBuilderWelcomePopup_module_welcomeMessage__0e08704b p {\n\tmargin: 0 0 16px 0;\n}\n\n.FeatureBuilderWelcomePopup_module_welcomeMessage__0e08704b p:last-child {\n\tmargin-bottom: 0;\n}\n";
@@ -3578,8 +3578,6 @@ const Field = props => {
     className: "".concat(modules_eca69fd0.field, " ").concat(hasError ? modules_eca69fd0["field--invalid"] : "")
   }, fieldContent));
 };
-
-// Padlock icon component for base fields
 const PadlockIcon = () => {
   const icon = iconImports.lock;
   return /*#__PURE__*/React__default["default"].createElement("span", {
@@ -3624,25 +3622,21 @@ const TitleField = props => {
   const {
     placeholder,
     label,
-    isRequired,
     helpText
   } = props.values;
   return /*#__PURE__*/React__default["default"].createElement(BaseFieldConfig, {
     label: label,
     placeholder: placeholder,
     helpText: helpText,
-    isRequired: true // Title fields are always required
-    ,
+    isRequired: true,
     setLabel: setLabel,
-    setPlaceholder: () => {},
+    setPlaceholder: setPlaceholder,
     setHelpText: setHelpText,
-    toggleIsRequired: () => {} // Disable toggling - title fields are always required
-    ,
+    toggleIsRequired: () => {},
     stepErrors: stepErrors,
     showWarnings: showWarnings,
     id: id,
-    fieldType: "title",
-    id: id // Fix: pass the field ID
+    fieldType: "title"
   });
 };
 const TextField = props => {
@@ -3652,30 +3646,28 @@ const TextField = props => {
     setHelpText,
     stepErrors,
     showWarnings,
+    toggleIsRequired,
     id
   } = props;
   const {
     placeholder,
     label,
-    isRequired,
-    helpText
+    helpText,
+    isRequired
   } = props.values;
   return /*#__PURE__*/React__default["default"].createElement(BaseFieldConfig, {
     label: label,
     placeholder: placeholder,
     helpText: helpText,
-    isRequired: true // Text fields are always required
-    ,
+    isRequired: isRequired,
     setLabel: setLabel,
-    setPlaceholder: () => {},
+    setPlaceholder: setPlaceholder,
     setHelpText: setHelpText,
-    toggleIsRequired: () => {} // Disable toggling - text fields are always required
-    ,
+    toggleIsRequired: toggleIsRequired,
     stepErrors: stepErrors,
     showWarnings: showWarnings,
     id: id,
-    fieldType: "text",
-    id: id // Fix: pass the field ID
+    fieldType: "text"
   });
 };
 const DescriptionField = props => {
@@ -3687,7 +3679,7 @@ const DescriptionField = props => {
     stepErrors,
     showWarnings,
     setUseAsSummary,
-    id // Get ID from root props
+    id
   } = props;
   const {
     placeholder,
@@ -3702,7 +3694,7 @@ const DescriptionField = props => {
     helpText: helpText,
     isRequired: isRequired,
     setLabel: setLabel,
-    setPlaceholder: () => {},
+    setPlaceholder: setPlaceholder,
     setHelpText: setHelpText,
     toggleIsRequired: toggleIsRequired,
     stepErrors: stepErrors,
@@ -3722,7 +3714,7 @@ const ImageField = props => {
     toggleAllowCaption,
     stepErrors,
     showWarnings,
-    id // Get ID from root props
+    id
   } = props;
   const {
     label,
@@ -3745,8 +3737,7 @@ const ImageField = props => {
     toggleAllowCaption: toggleAllowCaption,
     stepErrors: stepErrors,
     showWarnings: showWarnings,
-    id: id // Fix: pass the field ID
-    ,
+    id: id,
     fieldType: "image"
   });
 };
@@ -3756,7 +3747,7 @@ const FeatureImageField = props => {
     setHelpText,
     stepErrors,
     showWarnings,
-    id // Get ID from root props
+    id
   } = props;
   const {
     label,
@@ -3767,17 +3758,14 @@ const FeatureImageField = props => {
     label: label,
     placeholder: placeholder,
     helpText: helpText,
-    isRequired: true // Feature image fields are always required
-    ,
+    isRequired: true,
     setLabel: setLabel,
     setPlaceholder: () => {},
     setHelpText: setHelpText,
-    toggleIsRequired: () => {} // Disable toggling - feature image fields are always required
-    ,
+    toggleIsRequired: () => {},
     stepErrors: stepErrors,
     showWarnings: showWarnings,
-    id: id // Fix: pass the field ID
-    ,
+    id: id,
     fieldType: "feature-image",
     customLabel: "Label"
   });
@@ -3793,7 +3781,7 @@ const GalleryField = props => {
     setAllowedTypes,
     stepErrors,
     showWarnings,
-    id // Get ID from root props
+    id
   } = props;
   const {
     label,
@@ -3836,7 +3824,8 @@ const CTAField = props => {
     setHelpText,
     setPlaceholder,
     stepErrors,
-    showWarnings
+    showWarnings,
+    id
   } = props;
   const {
     label,
@@ -3844,23 +3833,18 @@ const CTAField = props => {
     helpText,
     placeholder
   } = props.values;
-  const {
-    id
-  } = props; // Get ID from root props
-
   return /*#__PURE__*/React__default["default"].createElement(BaseFieldConfig, {
     label: label,
     placeholder: placeholder,
     helpText: helpText,
     isRequired: isRequired,
     setLabel: setLabel,
-    setPlaceholder: () => {},
+    setPlaceholder: setPlaceholder,
     setHelpText: setHelpText,
     toggleIsRequired: toggleIsRequired,
     stepErrors: stepErrors,
     showWarnings: showWarnings,
-    id: id // Fix: pass the field ID
-    ,
+    id: id,
     fieldType: "cta"
   });
 };
@@ -3870,11 +3854,9 @@ const FileField = props => {
     setLabel,
     setHelpText,
     stepErrors,
-    showWarnings
-  } = props;
-  const {
+    showWarnings,
     id
-  } = props; // Get ID from root props
+  } = props;
   const {
     label,
     isRequired,
@@ -4116,32 +4098,20 @@ const FormFieldsStepInner = props => {
     UseCase: "Link to reservations, bookings, or external sites",
     Icon: "arrow-circle-right"
   }];
-
-  // Use custom hook to handle definition loading
   const {
     definition,
     definitionIsLoading,
     reloadDefinition
   } = useFeatureDefinitionLoader();
-
-  // Get form state for display name
   const formDisplayName = reactRedux.useSelector(selectFormDisplayName);
-
-  // Get wizard state
   const isCreateMode = reactRedux.useSelector(selectIsCreateMode);
   const isEditMode = reactRedux.useSelector(selectIsEditMode);
-
-  // Get validation state
   const isStepValid = reactRedux.useSelector(selectIsStepValid("fields"));
   const stepErrors = reactRedux.useSelector(selectStepErrors("fields"));
   const showWarnings = !isStepValid && Object.keys(stepErrors).length > 0;
-
-  // Get submission state
   const isSubmitting = reactRedux.useSelector(selectFormIsSubmitting);
   const submitError = reactRedux.useSelector(selectFormSubmitError);
   const submitSuccess = reactRedux.useSelector(selectFormSubmitSuccess);
-
-  // Toast management functions
   const addToast = (type, message) => {
     const id = Date.now();
     setToasts(prev => [...prev, {
@@ -4155,9 +4125,6 @@ const FormFieldsStepInner = props => {
     setToasts(prev => prev.filter(toast => toast.id !== id));
   };
 
-  // Note: Removed automatic redirect after successful save in edit mode
-  // User should stay on the current step until they manually navigate
-
   // Handle successful submission with optimistic update and redirect
   React__default["default"].useEffect(() => {
     if (submitSuccess && !isSubmitting) {
@@ -4165,14 +4132,11 @@ const FormFieldsStepInner = props => {
         addToast("success", "Changes saved");
         dispatch(clearFormSubmissionState());
       } else {
-        // In create mode, show success toast and redirect immediately
         addToast("success", "Feature created successfully");
-
-        // Clear submission state and redirect to overview step
         dispatch(clearFormSubmissionState());
         setTimeout(() => {
           history.push(values.routeFormOverviewStep);
-        }, 1000); // Brief delay to show toast
+        }, 1000);
       }
     }
   }, [submitSuccess, isEditMode, isSubmitting, dispatch, history]);
@@ -4186,8 +4150,6 @@ const FormFieldsStepInner = props => {
       }, 1000);
     }
   }, [submitError]);
-
-  // Scroll to top when validation errors appear
   React.useEffect(() => {
     if (showWarnings) {
       // Scroll to top of form to show validation errors
@@ -4197,24 +4159,15 @@ const FormFieldsStepInner = props => {
       });
     }
   }, [showWarnings]);
-
-  // Error boundary handlers
   const handleRefresh = () => {
-    // Refresh current step data
     dispatch(validateAndUpdateStep("fields"));
   };
   React.useEffect(() => {
-    // Set current step when component mounts
     dispatch(setCurrentStepAndSave("fields"));
   }, [dispatch]);
-
-  // Add effect to handle definition loading and validation in edit mode
-  // ADD THIS EFFECT: Hydrate form data from definition on refresh
   React.useEffect(() => {
     if (definition && !definitionIsLoading && isFormInitial) {
       dispatch(setInitialValues(definition));
-
-      // In edit mode, trigger validation after setting initial values
       if (isEditMode) {
         setTimeout(() => {
           dispatch(validateAndUpdateStep("fields"));
@@ -4224,9 +4177,7 @@ const FormFieldsStepInner = props => {
   }, [definition, definitionIsLoading, isFormInitial, isEditMode, dispatch]);
   React.useEffect(() => {
     // In edit mode, trigger validation when definition is available
-    // Note: The new effect above handles the data population, this handles re-validation
     if (isEditMode && definition && !definitionIsLoading && !isFormInitial) {
-      // Only validate if form is NOT initial (meaning it has data)
       setTimeout(() => {
         dispatch(validateAndUpdateStep("fields"));
       }, 100);
@@ -4234,59 +4185,47 @@ const FormFieldsStepInner = props => {
   }, [definition, definitionIsLoading, isEditMode, isFormInitial, dispatch]);
   function handleAddField(fieldType) {
     dispatch(addField(fieldType));
-    setShowFieldSelector(false); // Close popup after adding field
+    setShowFieldSelector(false);
   }
   function handleOpenFieldSelector() {
-    setReplacingFieldIndex(null); // Reset to add mode
+    setReplacingFieldIndex(null);
     setShowFieldSelector(true);
   }
   function handleCloseFieldSelector() {
-    setReplacingFieldIndex(null); // Reset replacement state
+    setReplacingFieldIndex(null);
     setShowFieldSelector(false);
   }
   function handleDeleteField(fieldId) {
     dispatch(deleteField(fieldId));
   }
   function handleReplaceField(fieldIndex) {
-    // Store the field index to replace and open the field selector
     setReplacingFieldIndex(fieldIndex);
     setShowFieldSelector(true);
   }
   function handleAddReplacementField(fieldType) {
     const fieldIndex = replacingFieldIndex;
     if (fieldIndex !== null) {
-      // Delete the current field at this index
       const currentField = allFields[fieldIndex];
       if (currentField && !currentField.isMandatory) {
         dispatch(deleteField(currentField.id));
       }
-
-      // Add the new field
       dispatch(addField(fieldType));
-
-      // Reset replacement state
       setReplacingFieldIndex(null);
       setShowFieldSelector(false);
     }
   }
   function handleNext() {
-    // Validate before proceeding
     const validationResult = dispatch(validateAndUpdateStep("fields"));
-
-    // If validation passes, navigate to next step
     if (validationResult !== null && validationResult !== void 0 && validationResult.isValid) {
-      // Clear form submission state when changing steps
       dispatch(clearFormSubmissionState());
       if (isCreateMode) {
         history.push(values.routeFormLayoutStep);
       } else {
-        // In edit mode, navigate directly
         history.push(values.routeFormLayoutStep);
       }
     }
     // If validation fails, scroll to top to show error summary
     else {
-      // Scroll to top of form to show validation errors
       window.scrollTo({
         top: 0,
         behavior: "smooth"
@@ -4294,42 +4233,29 @@ const FormFieldsStepInner = props => {
     }
   }
   function handlePrevious() {
-    // Clear form submission state when changing steps
     dispatch(clearFormSubmissionState());
     if (isCreateMode) {
       history.push(values.routeFormOverviewStep);
     } else {
-      // In edit mode, go back to overview screen
       history.push(values.routeFormOverviewStep);
     }
   }
   function handleSaveStep() {
-    // Validate before saving in edit mode
     const validationResult = dispatch(validateAndUpdateStep("fields"));
-
-    // If validation passes, save the entire form
     if (validationResult !== null && validationResult !== void 0 && validationResult.isValid) {
       dispatch(submitForm());
     }
     // If validation fails, scroll to top to show error summary
     else {
-      // Scroll to top of form to show validation errors
       window.scrollTo({
         top: 0,
         behavior: "smooth"
       });
     }
   }
-
-  // Get all fields in unified list (base + custom)
   const allFields = fields || [];
-
-  // Create sorted copy for rendering
   const sortedFields = allFields.slice().sort((a, b) => a.order - b.order);
 
-  // Filter description fields for summary demo
-  allFields.filter(field => field.type === "description");
-
   // Check for definition management permission
   if (!PlussCore__namespace.Session.validateAccess(auth.site, values.permissionFeatureBuilderDefinition, auth)) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -4586,11 +4512,9 @@ const useField = id => {
     dispatch(updateFieldById(id, updatedField));
   }
   function setUseAsSummary(value) {
-    // When setting a field as summary, use the new action to ensure only one field is selected
     if (value) {
       dispatch(setSummaryField(id));
     } else {
-      // When unsetting, use regular update to unset this specific field
       const updatedField = {
         values: _objectSpread$5(_objectSpread$5({}, values), {}, {
           useAsSummary: false
@@ -4623,11 +4547,8 @@ const FormLayoutStepInner = props => {
   const overviewIcon = reactRedux.useSelector(selectFormIcon);
   const definitionId = reactRedux.useSelector(selectDefinitionId);
   const layoutType = (layout === null || layout === void 0 ? void 0 : layout.type) || "round";
-  // Get wizard state
   const isCreateMode = reactRedux.useSelector(selectIsCreateMode);
   const isEditMode = reactRedux.useSelector(selectIsEditMode);
-
-  // Use custom hook to handle definition loading
   const {
     definition,
     definitionIsLoading
@@ -4644,14 +4565,8 @@ const FormLayoutStepInner = props => {
   const isSubmitting = reactRedux.useSelector(selectFormIsSubmitting);
   const submitError = reactRedux.useSelector(selectFormSubmitError);
   const submitSuccess = reactRedux.useSelector(selectFormSubmitSuccess);
-
-  // Toast state
   const [toasts, setToasts] = React__default["default"].useState([]);
-
-  // Success popup state
   const [showSuccessPopup, setShowSuccessPopup] = React__default["default"].useState(false);
-
-  // Toast management functions
   const addToast = (type, message) => {
     const id = Date.now();
     setToasts(prev => [...prev, {
@@ -4664,28 +4579,21 @@ const FormLayoutStepInner = props => {
   const removeToast = id => {
     setToasts(prev => prev.filter(toast => toast.id !== id));
   };
-
-  // Handle success popup close
   const handleSuccessPopupClose = () => {
     setShowSuccessPopup(false);
     dispatch(clearFormSubmissionState());
-    history.push(values.routeFormOverviewStep);
+    window.location.replace(values.routeFormOverviewStep);
   };
-
-  // Handle successful submission with popup and redirect
   React.useEffect(() => {
     if (submitSuccess && !isSubmitting) {
       if (isEditMode) {
         addToast("success", "Changes saved");
         dispatch(clearFormSubmissionState());
       } else {
-        // In create mode, show success popup
         setShowSuccessPopup(true);
       }
     }
   }, [submitSuccess, isEditMode, isSubmitting, dispatch]);
-
-  // Handle submit error
   React.useEffect(() => {
     if (submitError) {
       addToast("error", "It didn't work. Please try again.");
@@ -4694,10 +4602,7 @@ const FormLayoutStepInner = props => {
       }, 1000);
     }
   }, [submitError]);
-
-  // Error boundary handlers
   const handleRefresh = () => {
-    // Refresh current step data
     dispatch(validateAndUpdateStep("layout"));
   };
   const layoutOptions = [{
@@ -4739,8 +4644,6 @@ const FormLayoutStepInner = props => {
       }
     }
   }, [definition, definitionIsLoading, isFormInitial, isEditMode, dispatch]);
-
-  // Add effect to handle definition loading and validation in edit mode
   React.useEffect(() => {
     // In edit mode, trigger validation when definition is available
     // Note: The new effect above handles data population, this handles re-validation
@@ -4755,23 +4658,20 @@ const FormLayoutStepInner = props => {
     dispatch(setLayoutType(layoutType));
   }
   function handlePrevious() {
-    // Clear form submission state when changing steps
     dispatch(clearFormSubmissionState());
     if (isCreateMode) {
       history.push(values.routeFormFieldsStep);
     } else {
-      // In edit mode, go back to fields screen
       history.push(values.routeFormFieldsStep);
     }
   }
   function handleNext() {
-    // Validate before proceeding
+    if (isSubmitting) {
+      return;
+    }
     const validationResult = dispatch(validateAndUpdateStep("layout"));
-
-    // If validation passes, proceed with submission/navigation
     if (validationResult !== null && validationResult !== void 0 && validationResult.isValid) {
       if (isCreateMode) {
-        // In create mode, submit form - success popup will be shown by useEffect
         dispatch(submitForm());
       } else {
         // In edit mode, just save changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plusscommunities/pluss-feature-builder-web-c",
-  "version": "1.0.4",
+  "version": "1.0.6-beta.0",
   "description": "Contains the feature builder extension for the pluss communities ",
   "main": "dist/index.cjs.js",
   "scripts": {
@@ -39,16 +39,16 @@
     "@babel/runtime": "^7.14.0"
   },
   "peerDependencies": {
-    "@fortawesome/fontawesome-svg-core": "*",
-    "@fortawesome/free-solid-svg-icons": "*",
-    "@fortawesome/react-fontawesome": "*",
-    "@plusscommunities/pluss-core-web": "*",
-    "lodash": "*",
-    "moment": "*",
-    "react": "*",
-    "react-bootstrap": "*",
-    "react-dom": "*",
-    "react-fontawesome": "*"
+    "@fortawesome/fontawesome-svg-core": "^6.4.0",
+    "@fortawesome/free-solid-svg-icons": "^6.4.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
+    "@plusscommunities/pluss-core-web": "^1.6.15-beta.1",
+    "lodash": "^4.17.4",
+    "moment": "^2.30.1",
+    "react": "^16.14.0",
+    "react-bootstrap": "^0.31.2",
+    "react-dom": "^16.14.0",
+    "react-fontawesome": "^1.6.1"
   },
   "keywords": []
 }