fix: add supported gateways check (#3650)

Automattic · Jan 20, 2025 · 74f7773 · 74f7773
1 parent 658416c
commit 74f7773
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 3 deletions.
diff --git a/src/reader-activation-auth/auth-form.js b/src/reader-activation-auth/auth-form.js
@@ -67,6 +67,7 @@ window.newspackRAS.push( function ( readerActivation ) {
 					if ( isError ) {
 						messageContentElement.classList.remove( 'newspack-ui__helper-text' );
 						messageContentElement.classList.add( 'newspack-ui__inline-error' );
+						form.style.opacity = 1;
 					} else {
 						messageContentElement.classList.remove( 'newspack-ui__inline-error' );
 						messageContentElement.classList.add( 'newspack-ui__helper-text' );
@@ -272,7 +273,10 @@ window.newspackRAS.push( function ( readerActivation ) {
 
 			form.endLoginFlow = ( message = null, status = 500, data = null ) => {
 				container.setAttribute( 'data-form-status', status );
-				form.style.opacity = 1;
+				// Only reset opacity if modal should close on success.
+				if ( container.config?.closeOnSuccess ) {
+					form.style.opacity = 1;
+				}
 				submitButtons.forEach( button => {
 					button.disabled = false;
 				} );
@@ -383,6 +387,7 @@ window.newspackRAS.push( function ( readerActivation ) {
 					url.searchParams.set( 'checkout', 1 );
 					body.set( 'redirect_url', url.toString() );
 				}
+
 				if ( 'otp' === action ) {
 					readerActivation
 						.authenticateOTP( body.get( 'otp_code' ) )
@@ -418,6 +423,9 @@ window.newspackRAS.push( function ( readerActivation ) {
 											readerActivation.setOTPTimer();
 											handleOTPTimer();
 										}
+										if ( data.action === 'otp' || data.action === 'pwd' ) {
+											form.style.opacity = 1;
+										}
 									} else {
 										form.endLoginFlow( message, status, data );
 									}
@@ -426,7 +434,14 @@ window.newspackRAS.push( function ( readerActivation ) {
 									form.endLoginFlow();
 								} )
 								.finally( () => {
-									form.style.opacity = 1;
+									const status = res.status;
+									// Check if modal should close on success. If no, reset opacity to 1.
+									// If yes, only reset opacity to 1 if the status is not successful.
+									if ( container.config?.closeOnSuccess ) {
+										form.style.opacity = 1;
+									} else if ( status !== 200 && ! container.config?.closeOnSuccess ) {
+										form.style.opacity = 1;
+									}
 									submitButtons.forEach( button => {
 										button.disabled = false;
 									} );

diff --git a/src/reader-activation-auth/auth-modal.js b/src/reader-activation-auth/auth-modal.js
@@ -96,7 +96,9 @@ export function openAuthModal( config = {} ) {
 	container.config = config;
 
 	container.authCallback = ( message, data ) => {
-		close( false );
+		if ( config?.closeOnSuccess ) {
+			close( false );
+		}
 		if ( config.onSuccess && typeof config.onSuccess === 'function' ) {
 			config.onSuccess( message, data );
 		}

diff --git a/src/reader-activation-auth/index.js b/src/reader-activation-auth/index.js
@@ -72,6 +72,7 @@ window.newspackRAS.push( readerActivation => {
 				onSuccess: callback,
 				onError: callback,
 				trigger: modalTrigger,
+				closeOnSuccess: true,
 			} );
 		}
 

diff --git a/src/reader-activation/index.js b/src/reader-activation/index.js
@@ -162,6 +162,7 @@ export function openAuthModal( config = {} ) {
 			},
 			content: null,
 			trigger: null,
+			closeOnSuccess: true,
 		},
 		...config,
 	};