From a18ae985bca3622cd77d37f30b889b5f9674237b Mon Sep 17 00:00:00 2001 From: Mike Letellier Date: Fri, 8 May 2026 10:46:46 -0300 Subject: [PATCH 1/2] Update gateway setting toggle logic --- square/js/action.js | 75 +++++++++++++++++++++++++++++++++------------ 1 file changed, 55 insertions(+), 20 deletions(-) diff --git a/square/js/action.js b/square/js/action.js index 3e6e20a126..a61da5b2fe 100644 --- a/square/js/action.js +++ b/square/js/action.js @@ -8,31 +8,71 @@ const { __ } = wp.i18n; - function onGatewayToggle( { gateway, settings, checked } ) { - if ( 'square' === gateway && checked ) { - syncRepeat( settings.get( 0 ) ); + function updateGatewaySettingsVisibility( settings ) { + const typeDropdown = settings.querySelector( 'select.frm_trans_type' ); + if ( ! typeDropdown ) { + return; } - syncCurrency( gateway, settings.get( 0 ) ); + if ( 'recurring' === typeDropdown.value ) { + const activeGateway = settings.querySelector( '[name*="[post_content][gateway]"]:checked' )?.value; - const typeDropdown = settings.get( 0 ).querySelector( 'select.frm_trans_type' ); - if ( typeDropdown && 'recurring' !== typeDropdown.value ) { - settings.get( 0 ).querySelectorAll( '.frm_trans_sub_opts' ).forEach( + settings.querySelectorAll( '.frm_trans_sub_opts' ).forEach( function( subOpts ) { - subOpts.style.display = 'none'; + // Check if this setting has a show_* class for the active gateway + const hasActiveGatewayClass = subOpts.classList.contains( 'show_' + activeGateway ); + + if ( hasActiveGatewayClass ) { + subOpts.classList.remove( 'frm_hidden' ); + if ( subOpts.classList.contains( 'frm_grid_container' ) ) { + subOpts.style.display = 'grid'; + } + } else { + // Check if it has any show_* class for a different gateway + const hasAnyGatewayClass = Array.from( subOpts.classList ).some( function( className ) { + return className.startsWith( 'show_' ); + } ); + + if ( hasAnyGatewayClass ) { + // Hide if it has a show_* class but not for the active gateway + subOpts.classList.add( 'frm_hidden' ); + subOpts.style.display = 'none'; + } else { + // Show if it has no show_* class (shared setting) + subOpts.classList.remove( 'frm_hidden' ); + if ( subOpts.classList.contains( 'frm_grid_container' ) ) { + subOpts.style.display = 'grid'; + } + } + } } ); + return; + } + + settings.querySelectorAll( '.frm_trans_sub_opts' ).forEach( + function( subOpts ) { + subOpts.classList.add( 'frm_hidden' ); + subOpts.style.display = 'none'; + } + ); + } + + function onGatewayToggle( { gateway, settings, checked } ) { + if ( 'square' === gateway && checked ) { + syncRepeat( settings.get( 0 ) ); } + syncCurrency( gateway, settings.get( 0 ) ); + + updateGatewaySettingsVisibility( settings.get( 0 ) ); + const captureSetting = settings.get( 0 ).querySelector( '[name*="[post_content][capture]"]' ); if ( captureSetting ) { const wrapper = captureSetting.closest( '.frm_gateway_no_recur' ); if ( wrapper ) { if ( 'square' === gateway ) { wrapper.style.display = 'none'; - } else if ( 'recurring' !== typeDropdown.value ) { - // Capture appearing with Stripe selected and recurring selected. - wrapper.style.removeProperty( 'display' ); } } } @@ -48,21 +88,15 @@ if ( squareGatewayOption?.checked ) { syncRepeat( settings ); } + + updateGatewaySettingsVisibility( settings ); } function onToggleSub() { const target = this; setTimeout( function() { const settings = target.closest( '.frm_form_action_settings' ); - const squareIsActive = settings.querySelector( '[name*="[post_content][gateway]"][value="square"]' ).checked; - - settings.querySelectorAll( '.frm_trans_sub_opts' ).forEach( - function( subOpts ) { - if ( subOpts.classList.contains( 'show_stripe' ) && ! subOpts.classList.contains( 'show_square' ) && squareIsActive ) { - subOpts.style.display = 'none'; - } - } - ); + updateGatewaySettingsVisibility( settings ); }, 0 ); } @@ -132,6 +166,7 @@ } newDropdown.closest( '.frm_trans_sub_opts' )?.classList.add( 'show_square' ); + newDropdown.closest( '.frm_trans_sub_opts' )?.classList.remove( 'frm_hidden' ); const stripeLabel = intervalCount.closest( '.frm_trans_sub_opts' )?.querySelector( 'label' ); if ( stripeLabel?.textContent.includes( 'Repeat Every' ) ) { From 1b61848ff5bad5a19f4c453dc9bd84b8e4d835e3 Mon Sep 17 00:00:00 2001 From: Mike Letellier Date: Fri, 8 May 2026 13:16:00 -0300 Subject: [PATCH 2/2] Update logic for possibility of multiple selected gateways --- square/js/action.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/square/js/action.js b/square/js/action.js index a61da5b2fe..40fe620b2e 100644 --- a/square/js/action.js +++ b/square/js/action.js @@ -15,12 +15,18 @@ } if ( 'recurring' === typeDropdown.value ) { - const activeGateway = settings.querySelector( '[name*="[post_content][gateway]"]:checked' )?.value; + const activeGateways = Array.from( settings.querySelectorAll( '[name*="[post_content][gateway]"]:checked' ) ).map( function( el ) { + return el.value; + } ); settings.querySelectorAll( '.frm_trans_sub_opts' ).forEach( function( subOpts ) { - // Check if this setting has a show_* class for the active gateway - const hasActiveGatewayClass = subOpts.classList.contains( 'show_' + activeGateway ); + // Check if this setting has a show_* class for any active gateway + const hasActiveGatewayClass = Array.from( subOpts.classList ).some( function( className ) { + return activeGateways.some( function( gateway ) { + return className === 'show_' + gateway; + } ); + } ); if ( hasActiveGatewayClass ) { subOpts.classList.remove( 'frm_hidden' ); @@ -34,7 +40,7 @@ } ); if ( hasAnyGatewayClass ) { - // Hide if it has a show_* class but not for the active gateway + // Hide if it has a show_* class but not for any active gateway subOpts.classList.add( 'frm_hidden' ); subOpts.style.display = 'none'; } else {