Merge pull request #1483 from brainstormforce/next-release

Version 1.7.0

Author: osk02

.distignore

@@ -45,6 +45,7 @@ multisite.xml
 multisite.xml.dist
 phpcs.xml
 phpcs.xml.dist
+phpcs-report.xml
 README.md
 wp-cli.local.yml
 yarn.lock

.gitignore

@@ -8,6 +8,7 @@ sureforms/
 
 # Vscode
 .vscode
+.cursor
 
 # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
 .grunt

.prettierignore

@@ -6,7 +6,7 @@ packages/block-serialization-spec-parser/parser.js
 packages/e2e-tests/plugins
 packages/react-native-editor/bundle
 vendor
-admin
+./admin
 dist
 node_modules
 

README.md

@@ -4,7 +4,7 @@
 **Requires at least:** 6.4  
 **Tested up to:** 6.8.1  
 **Requires PHP:** 7.4  
-**Stable tag:** 1.6.4  
+**Stable tag:** 1.7.0  
 **License:** GPLv2 or later  
 **License URI:** http://www.gnu.org/licenses/gpl-2.0.html  
 
@@ -260,6 +260,10 @@ Yes! You can certainly use SureForms on yours as well as your client’s website
 When you use SureForms, you get an easy-to-use AI-powered form builder that can be used to build your forms fast.
 
 ## Changelog ##
+### 1.7.0 - 22nd May 2025 ###
+* New: Revamped user interface for Dashboard and Settings with a more modern and intuitive experience.
+* Improvement: Improved reCAPTCHA handling by adding detailed logging for failure responses.
+* Improvement: Number and range components now support float values.
 ### 1.6.4 - 14th May 2025 ###
 * New: Introduced Advanced Form Styling.
 * Improvement: Updated Phone Number field to announce the country code only once for better accessibility.

admin/admin.php

@@ -272,7 +272,7 @@ public function add_upgrade_to_pro() {
 	 * @since 0.0.1
 	 */
 	public function render_dashboard() {
-		echo '<div id="srfm-dashboard-container"></div>';
+		echo '<div id="srfm-dashboard-container" class="srfm-admin-wrapper"></div>';
 	}
 
 	/**
@@ -282,7 +282,7 @@ public function render_dashboard() {
 	 * @since 0.0.1
 	 */
 	public function settings_page_callback() {
-		echo '<div id="srfm-settings-container"></div>';
+		echo '<div id="srfm-settings-container" class="srfm-admin-wrapper"></div>';
 	}
 
 	/**
@@ -319,7 +319,7 @@ public function add_new_form() {
 	 * @since 0.0.1
 	 */
 	public function add_new_form_callback() {
-		echo '<div id="srfm-add-new-form-container"></div>';
+		echo '<div id="srfm-add-new-form-container" class="srfm-admin-wrapper"></div>';
 	}
 
 	/**
@@ -504,6 +504,16 @@ public function enqueue_scripts() {
 			'sureforms_pricing_page'  => Helper::get_sureforms_website_url( 'pricing' ),
 			'field_spacing_vars'      => Helper::get_css_vars(),
 			'is_ver_lower_than_6_7'   => version_compare( $wp_version, '6.6.2', '<=' ),
+			'integrations'            => Helper::sureforms_get_integration(),
+			'ajax_url'                => admin_url( 'admin-ajax.php' ),
+			'sf_plugin_manager_nonce' => wp_create_nonce( 'sf_plugin_manager_nonce' ),
+			'plugin_installer_nonce'  => wp_create_nonce( 'updates' ),
+			'plugin_activating_text'  => __( 'Activating...', 'sureforms' ),
+			'plugin_activated_text'   => __( 'Activated', 'sureforms' ),
+			'plugin_activate_text'    => __( 'Activate', 'sureforms' ),
+			'plugin_installing_text'  => __( 'Installing...', 'sureforms' ),
+			'plugin_installed_text'   => __( 'Installed', 'sureforms' ),
+			'is_rtl'                  => $is_rtl,
 		];
 
 		$is_screen_sureforms_menu          = Helper::validate_request_context( 'sureforms_menu', 'page' );
@@ -558,20 +568,6 @@ public function enqueue_scripts() {
 
 		if ( $is_screen_sureforms_form_settings ) {
 			wp_enqueue_style( SRFM_SLUG . '-settings', $css_uri . 'backend/settings' . $file_prefix . $rtl . '.css', [], SRFM_VER );
-
-			// if version is equal to or lower than 6.6.2 then add compatibility css.
-			if ( version_compare( $wp_version, '6.6.2', '<=' ) ) {
-				$srfm_inline_css = '
-				.srfm-settings-page-container
-					.components-toggle-control {
-						.components-base-control__help{
-							margin-left: 4em;
-						}
-					}
-				}
-				';
-				wp_add_inline_style( SRFM_SLUG . '-settings', $srfm_inline_css );
-			}
 		}
 
 		// Enqueue styles for the entries page.

assets/js/unminified/form-submit.js

@@ -250,12 +250,22 @@ function redirectToUrl( url ) {
  * @param {string}      [event.detail.position='footer'] - The position to display the error message ('header' or 'footer').
  */
 function dispatchErrorEvent( event ) {
-	const { form, message = '', position = 'footer' } = event.detail || {};
+	const {
+		form,
+		message = '',
+		position = 'footer',
+		log_message = null,
+	} = event.detail || {};
 
 	if ( ! form ) {
 		return;
 	}
 
+	// Log the error message to the console if provided.
+	if ( log_message ) {
+		console.warn( log_message );
+	}
+
 	const errorMessage =
 		message ||
 		__(
@@ -287,13 +297,19 @@ function dispatchErrorEvent( event ) {
 document.addEventListener( 'srfm_show_common_form_error', dispatchErrorEvent );
 
 function showErrorMessage( args ) {
-	const { form, message = '', position = 'footer' } = args;
+	const {
+		form,
+		message = '',
+		position = 'footer',
+		log_message = null,
+	} = args;
 
 	const errorEvent = new CustomEvent( 'srfm_show_common_form_error', {
 		detail: {
 			form,
 			message,
 			position,
+			log_message,
 		},
 	} );
 
@@ -540,6 +556,12 @@ function recaptchaCallback( token = '' ) {
 					);
 					isRecaptchaRender = true;
 				},
+				'error-callback': () => {
+					showErrorMessageOnRecaptchaError( {
+						containerSelector: '.g-recaptcha[recaptcha-type="v2-invisible"]:not(.captcha-error-added)',
+						message: srfm_submit?.messages?.srfm_google_captcha_error_message,
+					} );
+				},
 			} );
 
 			submitBtn.addEventListener( 'click', () => {
@@ -580,6 +602,25 @@ function recaptchaCallback( token = '' ) {
 	} );
 }
 
+function showErrorMessageOnRecaptchaError( args ) {
+	const { containerSelector, message = '' } = args;
+
+	const getCaptchaContainer = document.querySelectorAll( containerSelector );
+	if ( ! getCaptchaContainer ) {
+		return;
+	}
+
+	getCaptchaContainer.forEach( ( element ) => {
+		const getTheForm = element.closest( '.srfm-form' );
+		if ( getTheForm ) {
+			showErrorMessage( { form: getTheForm, message } );
+
+			// Add class
+			element.classList.add( 'captcha-error-added' );
+		}
+	} );
+}
+
 /**
  * Emits a custom event to signal the successful submission of a form.
  *

assets/js/unminified/frontend.js

@@ -153,6 +153,71 @@ function onSuccess( response ) {
 	}
 }
 
+function showErrorMessage( args ) {
+	const { form, message = '', position = 'footer' } = args;
+
+	const errorEvent = new CustomEvent( 'srfm_show_common_form_error', {
+		detail: {
+			form,
+			message,
+			position,
+		},
+	} );
+
+	document.dispatchEvent( errorEvent );
+}
+
+function showErrorMessageOnRecaptchaError( args ) {
+	const { containerSelector, message = '' } = args;
+
+	const getCaptchaContainer = document.querySelectorAll( containerSelector );
+	if ( ! getCaptchaContainer ) {
+		return;
+	}
+
+	getCaptchaContainer.forEach( ( element ) => {
+		const getTheForm = element.closest( '.srfm-form' );
+		if ( getTheForm ) {
+			showErrorMessage( { form: getTheForm, message } );
+
+			// Add class
+			element.classList.add( 'captcha-error-added' );
+		}
+	} );
+}
+
+// eslint-disable-next-line
+function onTurnstileError() {
+	showErrorMessageOnRecaptchaError( {
+		containerSelector: '.cf-turnstile:not(.captcha-error-added)',
+		message: srfm_submit?.messages?.srfm_turnstile_error_message,
+	} );
+}
+
+// eslint-disable-next-line
+function onGCaptchaV2CheckBoxError() {
+	showErrorMessageOnRecaptchaError( {
+		containerSelector: '.g-recaptcha[recaptcha-type="v2-checkbox"]:not(.captcha-error-added)',
+		message: srfm_submit?.messages?.srfm_google_captcha_error_message,
+	} );
+}
+
+// eslint-disable-next-line
+function onGCaptchaV3Error() {
+	showErrorMessageOnRecaptchaError( {
+		containerSelector: '.g-recaptcha[recaptcha-type="v3-reCAPTCHA"]:not(.captcha-error-added)',
+		message: srfm_submit?.messages?.srfm_google_captcha_error_message,
+	} );
+}
+
+// eslint-disable-next-line
+function onHCaptchaError() {
+	showErrorMessageOnRecaptchaError( {
+		containerSelector: '.h-captcha:not(.captcha-error-added)',
+		message: srfm_submit?.messages?.srfm_captcha_h_error_message,
+	} );
+}
+
 /**
  * An Immediately Invoked Function Expression (IIFE) is a function that is defined
  * and executed immediately after its creation. It is used to create a new scope,