From 39367e7b51aeb8857c5f2769ff348c214c7cda91 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Wed, 12 Jan 2022 09:34:12 +0200
Subject: [PATCH 01/21] Remove unused

---
 .../ppcp-onboarding/assets/js/onboarding.js   | 27 -------------------
 1 file changed, 27 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index fd63915ff..fa0522d1c 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -101,27 +101,6 @@ function ppcp_onboarding_productionCallback(...args) {
 	return ppcp_onboarding.loginSeller('production', ...args);
 }
 
-/**
- * Since the PayPal modal will redirect the user a dirty form
- * provokes an alert if the user wants to leave the page. Since the user
- * needs to toggle the sandbox switch, we disable this dirty state with the
- * following workaround for checkboxes.
- *
- * @param event
- */
-const checkBoxOnClick = (event) => {
-	const value = event.target.checked;
-	if (event.target.getAttribute('id') === 'ppcp-sandbox_on') {
-		toggleSandboxProduction(! value);
-	}
-	event.preventDefault();
-	event.stopPropagation();
-	setTimeout( () => {
-		event.target.checked = value;
-		},1
-	);
-};
-
 /**
  * Toggles the credential input fields.
  *
@@ -274,12 +253,6 @@ const disconnect = (event) => {
 		);
 	}
 
-	// document.querySelectorAll('#mainform input[type="checkbox"]').forEach(
-	// 	(checkbox) => {
-	// 		checkbox.addEventListener('click', checkBoxOnClick);
-	// 	}
-	// );
-
 	document.querySelectorAll('#field-sandbox_toggle_manual_input button, #field-production_toggle_manual_input button').forEach(
 		(button) => {
 			button.addEventListener(

From f5e02e8c936f00d50bb2e9d6b63db28c78098fb5 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Thu, 13 Jan 2022 08:24:33 +0200
Subject: [PATCH 02/21] Allow settings items without titles

---
 .../ppcp-onboarding/assets/css/onboarding.css |  2 +-
 .../src/Settings/SettingsRenderer.php         | 19 ++++++++++++++++---
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/css/onboarding.css b/modules/ppcp-onboarding/assets/css/onboarding.css
index affc68415..2b40e1ab1 100644
--- a/modules/ppcp-onboarding/assets/css/onboarding.css
+++ b/modules/ppcp-onboarding/assets/css/onboarding.css
@@ -81,7 +81,7 @@
 }
 
 /* Probably not the best location for this but will do until there's a general purpose settings CSS file. */
-.ppcp-settings-field-heading td, .ppcp-settings-field-heading th {
+.ppcp-settings-field-heading td, .ppcp-settings-field-heading th, .ppcp-settings-no-title-col td {
 	padding-left: 0;
 }
 
diff --git a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
index 39c6c8390..c9f40bc4a 100644
--- a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
+++ b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
@@ -377,6 +377,16 @@ $data_rows_html
 		?>
 		<input type="hidden" name="ppcp-nonce" value="<?php echo esc_attr( $nonce ); ?>">
 		<?php
+
+		// Create a hidden first row with 2 cells to avoid issues with table-layout: fixed
+		// when the first visible row needs to have one cell.
+		?>
+		<tr style="height: 1px; padding-top: 0; padding-bottom: 0;">
+			<th style="padding-top: 0; padding-bottom: 0;"></th>
+			<td style="padding-top: 0; padding-bottom: 0;"></td>
+		</tr>
+		<?php
+
 		foreach ( $this->fields as $field => $config ) :
 			if ( ! in_array( $this->state->current_state(), $config['screens'], true ) ) {
 				continue;
@@ -406,14 +416,17 @@ $data_rows_html
 			$key          = 'ppcp[' . $field . ']';
 			$id           = 'ppcp-' . $field;
 			$config['id'] = $id;
-			$colspan      = 'ppcp-heading' !== $config['type'] ? 1 : 2;
+			$colspan      = ( 'ppcp-heading' !== $config['type'] && isset( $config['title'] ) ) ? 1 : 2;
 			$classes      = isset( $config['classes'] ) ? $config['classes'] : array();
 			$classes[]    = sprintf( 'ppcp-settings-field-%s', str_replace( 'ppcp-', '', $config['type'] ) );
-			$description  = isset( $config['description'] ) ? $config['description'] : '';
+			if ( 1 !== $colspan ) {
+				$classes[] = 'ppcp-settings-no-title-col';
+			}
+			$description = isset( $config['description'] ) ? $config['description'] : '';
 			unset( $config['description'] );
 			?>
 		<tr valign="top" id="<?php echo esc_attr( 'field-' . $field ); ?>" class="<?php echo esc_attr( implode( ' ', $classes ) ); ?>">
-			<?php if ( 'ppcp-heading' !== $config['type'] ) : ?>
+			<?php if ( 'ppcp-heading' !== $config['type'] && isset( $config['title'] ) ) : ?>
 			<th scope="row">
 				<label
 					for="<?php echo esc_attr( $id ); ?>"

From 89782be6c456d7dab3103d00847641a7bf6ceec5 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Thu, 13 Jan 2022 08:44:26 +0200
Subject: [PATCH 03/21] Use different style for sandbox button

---
 modules/ppcp-onboarding/src/Render/OnboardingRenderer.php | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
index cc2fa38f1..d76834355 100644
--- a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
+++ b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
@@ -79,7 +79,8 @@ class OnboardingRenderer {
 			$this->render_button(
 				$this->get_signup_link( $is_production ),
 				$is_production ? 'connect-to-production' : 'connect-to-sandbox',
-				$is_production ? __( 'Connect to PayPal', 'woocommerce-paypal-payments' ) : __( 'Connect to PayPal Sandbox', 'woocommerce-paypal-payments' ),
+				$is_production ? __( 'Connect PayPal', 'woocommerce-paypal-payments' ) : __( 'Test Payments', 'woocommerce-paypal-payments' ),
+				$is_production ? 'primary' : 'secondary',
 				$is_production ? 'production' : 'sandbox'
 			);
 		} catch ( RuntimeException $exception ) {
@@ -96,13 +97,14 @@ class OnboardingRenderer {
 	 * @param string $url The url of the button.
 	 * @param string $id The ID of the button.
 	 * @param string $label The button text.
+	 * @param string $class The CSS class for button ('primary', 'secondary').
 	 * @param string $env The environment ('production' or 'sandbox').
 	 */
-	private function render_button( string $url, string $id, string $label, string $env ) {
+	private function render_button( string $url, string $id, string $label, string $class, string $env ) {
 		?>
 					<a
 							target="_blank"
-							class="button-primary"
+							class="button-<?php echo esc_attr( $class ); ?>"
 							id="<?php echo esc_attr( $id ); ?>"
 							data-paypal-onboard-complete="ppcp_onboarding_<?php echo esc_attr( $env ); ?>Callback"
 							data-paypal-onboard-button="true"

From 3b488fbf8e233f9adfb4e9bb71b3f60b0ec5e319 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Fri, 14 Jan 2022 13:56:52 +0200
Subject: [PATCH 04/21] Allow to specify products value in partner referrals
 data

---
 modules/ppcp-api-client/services.php          |  4 +-
 .../src/Endpoint/PartnerReferrals.php         | 21 ++------
 .../src/Repository/PartnerReferralsData.php   | 51 +++++++++----------
 modules/ppcp-onboarding/services.php          |  6 +--
 .../ppcp-onboarding/src/OnboardingModule.php  | 15 +++---
 .../src/Render/OnboardingRenderer.php         | 41 +++++++++++----
 6 files changed, 72 insertions(+), 66 deletions(-)

diff --git a/modules/ppcp-api-client/services.php b/modules/ppcp-api-client/services.php
index 97306058f..f254169ed 100644
--- a/modules/ppcp-api-client/services.php
+++ b/modules/ppcp-api-client/services.php
@@ -126,7 +126,6 @@ return array(
 		return new PartnerReferrals(
 			$container->get( 'api.host' ),
 			$container->get( 'api.bearer' ),
-			$container->get( 'api.repository.partner-referrals-data' ),
 			$container->get( 'woocommerce.logger.woocommerce' )
 		);
 	},
@@ -208,9 +207,8 @@ return array(
 	},
 	'api.repository.partner-referrals-data'     => static function ( ContainerInterface $container ) : PartnerReferralsData {
 
-		$merchant_email = $container->get( 'api.merchant_email' );
 		$dcc_applies    = $container->get( 'api.helpers.dccapplies' );
-		return new PartnerReferralsData( $merchant_email, $dcc_applies );
+		return new PartnerReferralsData( $dcc_applies );
 	},
 	'api.repository.cart'                       => static function ( ContainerInterface $container ): CartRepository {
 		$factory = $container->get( 'api.factory.purchase-unit' );
diff --git a/modules/ppcp-api-client/src/Endpoint/PartnerReferrals.php b/modules/ppcp-api-client/src/Endpoint/PartnerReferrals.php
index 38526927f..0f188f025 100644
--- a/modules/ppcp-api-client/src/Endpoint/PartnerReferrals.php
+++ b/modules/ppcp-api-client/src/Endpoint/PartnerReferrals.php
@@ -12,7 +12,6 @@ namespace WooCommerce\PayPalCommerce\ApiClient\Endpoint;
 use WooCommerce\PayPalCommerce\ApiClient\Authentication\Bearer;
 use WooCommerce\PayPalCommerce\ApiClient\Exception\PayPalApiException;
 use WooCommerce\PayPalCommerce\ApiClient\Exception\RuntimeException;
-use WooCommerce\PayPalCommerce\ApiClient\Repository\PartnerReferralsData;
 use Psr\Log\LoggerInterface;
 
 /**
@@ -36,13 +35,6 @@ class PartnerReferrals {
 	 */
 	private $bearer;
 
-	/**
-	 * The PartnerReferralsData.
-	 *
-	 * @var PartnerReferralsData
-	 */
-	private $data;
-
 	/**
 	 * The logger.
 	 *
@@ -53,32 +45,29 @@ class PartnerReferrals {
 	/**
 	 * PartnerReferrals constructor.
 	 *
-	 * @param string               $host The host.
-	 * @param Bearer               $bearer The bearer.
-	 * @param PartnerReferralsData $data The partner referrals data.
-	 * @param LoggerInterface      $logger The logger.
+	 * @param string          $host The host.
+	 * @param Bearer          $bearer The bearer.
+	 * @param LoggerInterface $logger The logger.
 	 */
 	public function __construct(
 		string $host,
 		Bearer $bearer,
-		PartnerReferralsData $data,
 		LoggerInterface $logger
 	) {
 
 		$this->host   = $host;
 		$this->bearer = $bearer;
-		$this->data   = $data;
 		$this->logger = $logger;
 	}
 
 	/**
 	 * Fetch the signup link.
 	 *
+	 * @param array $data The partner referrals data.
 	 * @return string
 	 * @throws RuntimeException If the request fails.
 	 */
-	public function signup_link(): string {
-		$data     = $this->data->data();
+	public function signup_link( array $data ): string {
 		$bearer   = $this->bearer->bearer();
 		$args     = array(
 			'method'  => 'POST',
diff --git a/modules/ppcp-api-client/src/Repository/PartnerReferralsData.php b/modules/ppcp-api-client/src/Repository/PartnerReferralsData.php
index d893e9c91..cdcdabac5 100644
--- a/modules/ppcp-api-client/src/Repository/PartnerReferralsData.php
+++ b/modules/ppcp-api-client/src/Repository/PartnerReferralsData.php
@@ -15,14 +15,6 @@ use WooCommerce\PayPalCommerce\ApiClient\Helper\DccApplies;
  * Class PartnerReferralsData
  */
 class PartnerReferralsData {
-
-	/**
-	 * The merchant email.
-	 *
-	 * @var string
-	 */
-	private $merchant_email;
-
 	/**
 	 * The DCC Applies Helper object.
 	 *
@@ -30,19 +22,39 @@ class PartnerReferralsData {
 	 */
 	private $dcc_applies;
 
+	/**
+	 * The list of products ('PPCP', 'EXPRESS_CHECKOUT').
+	 *
+	 * @var string[]
+	 */
+	private $products;
+
 	/**
 	 * PartnerReferralsData constructor.
 	 *
-	 * @param string     $merchant_email  The email of the merchant.
 	 * @param DccApplies $dcc_applies The DCC Applies helper.
 	 */
 	public function __construct(
-		string $merchant_email,
 		DccApplies $dcc_applies
 	) {
+		$this->dcc_applies = $dcc_applies;
+		$this->products    = array(
+			$this->dcc_applies->for_country_currency() ? 'PPCP' : 'EXPRESS_CHECKOUT',
+		);
+	}
 
-		$this->merchant_email = $merchant_email;
-		$this->dcc_applies    = $dcc_applies;
+	/**
+	 * Returns a new copy of this object with the given value set.
+	 *
+	 * @param string[] $products The list of products ('PPCP', 'EXPRESS_CHECKOUT').
+	 * @return static
+	 */
+	public function with_products( array $products ): self {
+		$obj = clone $this;
+
+		$obj->products = $products;
+
+		return $obj;
 	}
 
 	/**
@@ -60,17 +72,6 @@ class PartnerReferralsData {
 	 * @return array
 	 */
 	public function data(): array {
-		$data = $this->default_data();
-		return $data;
-	}
-
-	/**
-	 * Returns the default data.
-	 *
-	 * @return array
-	 */
-	private function default_data(): array {
-
 		return array(
 			'partner_config_override' => array(
 				'partner_logo_url'       => 'https://connect.woocommerce.com/images/woocommerce_logo.png',
@@ -84,9 +85,7 @@ class PartnerReferralsData {
 				),
 				'show_add_credit_card'   => true,
 			),
-			'products'                => array(
-				$this->dcc_applies->for_country_currency() ? 'PPCP' : 'EXPRESS_CHECKOUT',
-			),
+			'products'                => $this->products,
 			'legal_consents'          => array(
 				array(
 					'type'    => 'SHARE_DATA_CONSENT',
diff --git a/modules/ppcp-onboarding/services.php b/modules/ppcp-onboarding/services.php
index de6de7d3a..cb83b2bd5 100644
--- a/modules/ppcp-onboarding/services.php
+++ b/modules/ppcp-onboarding/services.php
@@ -188,7 +188,6 @@ return array(
 		return new PartnerReferrals(
 			CONNECT_WOO_SANDBOX_URL,
 			new ConnectBearer(),
-			$container->get( 'api.repository.partner-referrals-data' ),
 			$container->get( 'woocommerce.logger.woocommerce' )
 		);
 	},
@@ -197,7 +196,6 @@ return array(
 		return new PartnerReferrals(
 			CONNECT_WOO_URL,
 			new ConnectBearer(),
-			$container->get( 'api.repository.partner-referrals-data' ),
 			$container->get( 'woocommerce.logger.woocommerce' )
 		);
 	},
@@ -205,11 +203,13 @@ return array(
 
 		$partner_referrals         = $container->get( 'api.endpoint.partner-referrals-production' );
 		$partner_referrals_sandbox = $container->get( 'api.endpoint.partner-referrals-sandbox' );
+		$partner_referrals_data    = $container->get( 'api.repository.partner-referrals-data' );
 		$settings                  = $container->get( 'wcgateway.settings' );
 		return new OnboardingRenderer(
 			$settings,
 			$partner_referrals,
-			$partner_referrals_sandbox
+			$partner_referrals_sandbox,
+			$partner_referrals_data
 		);
 	},
 	'onboarding.rest'                           => static function( $container ) : OnboardingRESTController {
diff --git a/modules/ppcp-onboarding/src/OnboardingModule.php b/modules/ppcp-onboarding/src/OnboardingModule.php
index d05b9509f..0960c7b6c 100644
--- a/modules/ppcp-onboarding/src/OnboardingModule.php
+++ b/modules/ppcp-onboarding/src/OnboardingModule.php
@@ -65,16 +65,15 @@ class OnboardingModule implements ModuleInterface {
 				if ( 'ppcp_onboarding' !== $config['type'] ) {
 					return $field;
 				}
-				$renderer      = $c->get( 'onboarding.render' );
-				$is_production = 'production' === $config['env'];
 
-				/**
-				 * The OnboardingRenderer.
-				 *
-				 * @var OnboardingRenderer $renderer
-				 */
+				$renderer = $c->get( 'onboarding.render' );
+				assert( $renderer instanceof OnboardingRenderer );
+
+				$is_production = 'production' === $config['env'];
+				$products      = $config['products'];
+
 				ob_start();
-				$renderer->render( $is_production );
+				$renderer->render( $is_production, $products );
 				$content = ob_get_contents();
 				ob_end_clean();
 				return $content;
diff --git a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
index d76834355..720d71888 100644
--- a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
+++ b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
@@ -11,6 +11,7 @@ namespace WooCommerce\PayPalCommerce\Onboarding\Render;
 
 use WooCommerce\PayPalCommerce\ApiClient\Endpoint\PartnerReferrals;
 use WooCommerce\PayPalCommerce\ApiClient\Exception\RuntimeException;
+use WooCommerce\PayPalCommerce\ApiClient\Repository\PartnerReferralsData;
 use WooCommerce\PayPalCommerce\WcGateway\Settings\Settings;
 
 /**
@@ -39,31 +40,50 @@ class OnboardingRenderer {
 	 */
 	private $sandbox_partner_referrals;
 
+	/**
+	 * The default partner referrals data.
+	 *
+	 * @var PartnerReferralsData
+	 */
+	private $partner_referrals_data;
+
 	/**
 	 * OnboardingRenderer constructor.
 	 *
-	 * @param Settings         $settings The settings.
-	 * @param PartnerReferrals $production_partner_referrals The PartnerReferrals for production.
-	 * @param PartnerReferrals $sandbox_partner_referrals The PartnerReferrals for sandbox.
+	 * @param Settings             $settings The settings.
+	 * @param PartnerReferrals     $production_partner_referrals The PartnerReferrals for production.
+	 * @param PartnerReferrals     $sandbox_partner_referrals The PartnerReferrals for sandbox.
+	 * @param PartnerReferralsData $partner_referrals_data The default partner referrals data.
 	 */
-	public function __construct( Settings $settings, PartnerReferrals $production_partner_referrals, PartnerReferrals $sandbox_partner_referrals ) {
+	public function __construct(
+		Settings $settings,
+		PartnerReferrals $production_partner_referrals,
+		PartnerReferrals $sandbox_partner_referrals,
+		PartnerReferralsData $partner_referrals_data
+	) {
 		$this->settings                     = $settings;
 		$this->production_partner_referrals = $production_partner_referrals;
 		$this->sandbox_partner_referrals    = $sandbox_partner_referrals;
+		$this->partner_referrals_data       = $partner_referrals_data;
 	}
 
 	/**
 	 * Returns the action URL for the onboarding button/link.
 	 *
-	 * @param boolean $is_production Whether the production or sandbox button should be rendered.
+	 * @param boolean  $is_production Whether the production or sandbox button should be rendered.
+	 * @param string[] $products The list of products ('PPCP', 'EXPRESS_CHECKOUT').
 	 * @return string URL.
 	 */
-	public function get_signup_link( bool $is_production ) {
+	public function get_signup_link( bool $is_production, array $products ) {
 		$args = array(
 			'displayMode' => 'minibrowser',
 		);
 
-		$url = $is_production ? $this->production_partner_referrals->signup_link() : $this->sandbox_partner_referrals->signup_link();
+		$data = $this->partner_referrals_data
+			->with_products( $products )
+			->data();
+
+		$url = $is_production ? $this->production_partner_referrals->signup_link( $data ) : $this->sandbox_partner_referrals->signup_link( $data );
 		$url = add_query_arg( $args, $url );
 
 		return $url;
@@ -72,12 +92,13 @@ class OnboardingRenderer {
 	/**
 	 * Renders the "Connect to PayPal" button.
 	 *
-	 * @param bool $is_production Whether the production or sandbox button should be rendered.
+	 * @param bool     $is_production Whether the production or sandbox button should be rendered.
+	 * @param string[] $products The list of products ('PPCP', 'EXPRESS_CHECKOUT').
 	 */
-	public function render( bool $is_production ) {
+	public function render( bool $is_production, array $products ) {
 		try {
 			$this->render_button(
-				$this->get_signup_link( $is_production ),
+				$this->get_signup_link( $is_production, $products ),
 				$is_production ? 'connect-to-production' : 'connect-to-sandbox',
 				$is_production ? __( 'Connect PayPal', 'woocommerce-paypal-payments' ) : __( 'Test Payments', 'woocommerce-paypal-payments' ),
 				$is_production ? 'primary' : 'secondary',

From ff8c6fdf01f4b49832783719b9d056a585c1cbc2 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Fri, 14 Jan 2022 14:02:33 +0200
Subject: [PATCH 05/21] New onboarding options, buttons

---
 .../ppcp-onboarding/assets/css/onboarding.css |  18 +-
 .../ppcp-onboarding/assets/js/onboarding.js   |  70 +++-
 modules/ppcp-onboarding/services.php          |   4 +
 .../src/Render/OnboardingOptionsRenderer.php  |  68 ++++
 .../src/Render/OnboardingRenderer.php         |   4 +-
 modules/ppcp-wc-gateway/services.php          | 366 ++++++++++--------
 .../src/Settings/SettingsRenderer.php         |   9 +-
 7 files changed, 348 insertions(+), 191 deletions(-)
 create mode 100644 modules/ppcp-onboarding/src/Render/OnboardingOptionsRenderer.php

diff --git a/modules/ppcp-onboarding/assets/css/onboarding.css b/modules/ppcp-onboarding/assets/css/onboarding.css
index 2b40e1ab1..47428ca52 100644
--- a/modules/ppcp-onboarding/assets/css/onboarding.css
+++ b/modules/ppcp-onboarding/assets/css/onboarding.css
@@ -35,8 +35,7 @@
 	display: unset;
 }
 
-#field-production_toggle_manual_input button,
-#field-sandbox_toggle_manual_input button {
+#field-toggle_manual_input button {
 	color: #0073aa;
 	transition-property: border, background, color;
 	transition-duration: .05s;
@@ -49,8 +48,7 @@
 	padding: 0;
 }
 
-#field-sandbox_toggle_manual_input.onboarded,
-#field-production_toggle_manual_input.onboarded {
+#field-toggle_manual_input.onboarded {
 	display: none;
 }
 
@@ -92,3 +90,15 @@
 .input-text[pattern]:invalid {
 	border: red solid 2px;
 }
+
+ul.ppcp-onboarding-options, ul.ppcp-onboarding-options-sublist {
+	list-style: none;
+}
+
+ul.ppcp-onboarding-options-sublist {
+	margin-left: 15px;
+}
+
+.ppcp-muted-text {
+	opacity: 0.6;
+}
diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index fa0522d1c..9613196ae 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -15,7 +15,7 @@ const ppcp_onboarding = {
 			return;
 		}
 
-		// Add event listeners to buttons.
+		// Add event listeners to buttons preventing link clicking if PayPal init failed.
 		buttons.forEach(
 			(element) => {
 				if (element.hasAttribute('data-ppcp-button-initialized')) {
@@ -137,8 +137,6 @@ const credentialToggle = (forProduction) => {
 const toggleSandboxProduction = (showProduction) => {
 	const productionDisplaySelectors = [
 		'#field-credentials_production_heading',
-		'#field-production_toggle_manual_input',
-		'#field-ppcp_onboarding_production',
 	];
 	const productionClassSelectors = [
 
@@ -150,8 +148,6 @@ const toggleSandboxProduction = (showProduction) => {
 	];
 	const sandboxDisplaySelectors = [
 		'#field-credentials_sandbox_heading',
-		'#field-sandbox_toggle_manual_input',
-		'#field-ppcp_onboarding_sandbox',
 	];
 	const sandboxClassSelectors = [
 		'#field-ppcp_disconnect_sandbox',
@@ -197,6 +193,34 @@ const toggleSandboxProduction = (showProduction) => {
 	)
 };
 
+const updateOptionsState = () => {
+    const cardsChk = document.querySelector('#ppcp-onboarding-accept-cards');
+
+    document.querySelectorAll('#ppcp-onboarding-dcc-options input').forEach(input => {
+        input.disabled = !cardsChk.checked;
+    });
+
+    const basicRb = document.querySelector('#ppcp-onboarding-dcc-basic');
+
+    const isExpress = !cardsChk.checked || basicRb.checked;
+
+    const expressButtonSelectors = [
+        '#field-ppcp_onboarding_production_express',
+        '#field-ppcp_onboarding_sandbox_express',
+    ];
+    const ppcpButtonSelectors = [
+        '#field-ppcp_onboarding_production_ppcp',
+        '#field-ppcp_onboarding_sandbox_ppcp',
+    ];
+
+    document.querySelectorAll(expressButtonSelectors.join()).forEach(
+        element => element.style.display = isExpress ? '' : 'none'
+    );
+    document.querySelectorAll(ppcpButtonSelectors.join()).forEach(
+        element => element.style.display = !isExpress ? '' : 'none'
+    );
+};
+
 const disconnect = (event) => {
 	event.preventDefault();
 	const fields = event.target.classList.contains('production') ? [
@@ -234,7 +258,6 @@ const disconnect = (event) => {
 		}
 	);
 
-	// Prevent a possibly dirty form arising from this particular checkbox.
 	if (sandboxSwitchElement) {
 		sandboxSwitchElement.addEventListener(
 			'click',
@@ -243,6 +266,7 @@ const disconnect = (event) => {
 
 				toggleSandboxProduction( ! value );
 
+                // Prevent a possibly dirty form arising from this particular checkbox.
 				event.preventDefault();
 				event.stopPropagation();
 				setTimeout( () => {
@@ -253,18 +277,28 @@ const disconnect = (event) => {
 		);
 	}
 
-	document.querySelectorAll('#field-sandbox_toggle_manual_input button, #field-production_toggle_manual_input button').forEach(
-		(button) => {
-			button.addEventListener(
-				'click',
-				(event) => {
-					event.preventDefault();
-					const isProduction = event.target.classList.contains('production-toggle');
-					credentialToggle(isProduction);
-				}
-			)
-		}
-	);
+    document.querySelectorAll('.ppcp-onboarding-options input').forEach(
+        (element) => {
+            element.addEventListener('click', updateOptionsState);
+        }
+    );
+
+    updateOptionsState();
+
+    document.querySelectorAll('#field-toggle_manual_input button').forEach(
+        (button) => {
+            button.addEventListener(
+                'click',
+                (event) => {
+                    event.preventDefault();
+
+                    const isProduction = ! sandboxSwitchElement.checked;
+                    toggleSandboxProduction(isProduction);
+                    credentialToggle(isProduction);
+                }
+            )
+        }
+    );
 
 	// Onboarding buttons.
 	ppcp_onboarding.init();
diff --git a/modules/ppcp-onboarding/services.php b/modules/ppcp-onboarding/services.php
index cb83b2bd5..18b633bae 100644
--- a/modules/ppcp-onboarding/services.php
+++ b/modules/ppcp-onboarding/services.php
@@ -18,6 +18,7 @@ use WooCommerce\PayPalCommerce\ApiClient\Endpoint\PartnerReferrals;
 use WooCommerce\PayPalCommerce\ApiClient\Helper\Cache;
 use WooCommerce\PayPalCommerce\Onboarding\Assets\OnboardingAssets;
 use WooCommerce\PayPalCommerce\Onboarding\Endpoint\LoginSellerEndpoint;
+use WooCommerce\PayPalCommerce\Onboarding\Render\OnboardingOptionsRenderer;
 use WooCommerce\PayPalCommerce\Onboarding\Render\OnboardingRenderer;
 use WooCommerce\PayPalCommerce\Onboarding\OnboardingRESTController;
 
@@ -212,6 +213,9 @@ return array(
 			$partner_referrals_data
 		);
 	},
+	'onboarding.render-options'                 => static function ( ContainerInterface $container ) : OnboardingOptionsRenderer {
+		return new OnboardingOptionsRenderer();
+	},
 	'onboarding.rest'                           => static function( $container ) : OnboardingRESTController {
 		return new OnboardingRESTController( $container );
 	},
diff --git a/modules/ppcp-onboarding/src/Render/OnboardingOptionsRenderer.php b/modules/ppcp-onboarding/src/Render/OnboardingOptionsRenderer.php
new file mode 100644
index 000000000..852a60ad9
--- /dev/null
+++ b/modules/ppcp-onboarding/src/Render/OnboardingOptionsRenderer.php
@@ -0,0 +1,68 @@
+<?php
+/**
+ * Renders the onboarding options.
+ *
+ * @package WooCommerce\PayPalCommerce\Onboarding\Render
+ */
+
+declare(strict_types=1);
+
+namespace WooCommerce\PayPalCommerce\Onboarding\Render;
+
+/**
+ * Class OnboardingRenderer
+ */
+class OnboardingOptionsRenderer {
+	/**
+	 * Renders the onboarding options.
+	 *
+	 * @param bool $is_shop_supports_dcc Whether the shop can use DCC (country, currency).
+	 */
+	public function render( bool $is_shop_supports_dcc ): string {
+		return '
+<ul class="ppcp-onboarding-options">
+	<li>
+		<label><input type="checkbox" disabled checked> ' .
+			__( 'Accept PayPal, Venmo, Pay Later and local payment methods', 'woocommerce-paypal-payments' ) . '
+		</label>
+	</li>
+	<li>
+		<label><input type="checkbox" id="ppcp-onboarding-accept-cards" checked> ' .
+			__( 'Securely accept all major credit & debit cards on the strength of the PayPal network', 'woocommerce-paypal-payments' ) . '
+		</label>
+	</li>
+	<li>' . $this->render_dcc( $is_shop_supports_dcc ) . '</li>
+</ul>';
+	}
+
+	/**
+	 * Renders the onboarding DCC options.
+	 *
+	 * @param bool $is_shop_supports_dcc Whether the shop can use DCC (country, currency).
+	 */
+	private function render_dcc( bool $is_shop_supports_dcc ): string {
+		$items = array();
+
+		if ( $is_shop_supports_dcc ) {
+			$items[] = '
+<li>
+	<label><input type="radio" id="ppcp-onboarding-dcc-acdc" name="ppcp_onboarding_dcc" value="acdc" checked> ' .
+			__( 'Advanced credit and debit card processing', 'woocommerce-paypal-payments' ) . '*<br/> ' .
+			__( '(With advanced fraud protection and fully customizable card fields)', 'woocommerce-paypal-payments' ) . '
+		<span class="ppcp-muted-text">*' . __( 'Additional onboarding steps required', 'woocommerce-paypal-payments' ) . '</span>
+	</label>
+</li>';
+		}
+
+		$items[] = '
+<li>
+	<label><input type="radio" id="ppcp-onboarding-dcc-basic" name="ppcp_onboarding_dcc" value="basic" ' . ( ! $is_shop_supports_dcc ? 'checked' : '' ) . '> ' .
+		__( 'Basic credit and debit card processing', 'woocommerce-paypal-payments' ) . '
+	</label>
+</li>';
+
+		return '<ul id="ppcp-onboarding-dcc-options" class="ppcp-onboarding-options-sublist">' .
+			implode( '', $items ) .
+			'</ul>';
+	}
+}
diff --git a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
index 720d71888..ed1fb08bc 100644
--- a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
+++ b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
@@ -97,9 +97,11 @@ class OnboardingRenderer {
 	 */
 	public function render( bool $is_production, array $products ) {
 		try {
+			$id = 'connect-to' . ( $is_production ? 'production' : 'sandbox' ) . strtolower( implode( '-', $products ) );
+
 			$this->render_button(
 				$this->get_signup_link( $is_production, $products ),
-				$is_production ? 'connect-to-production' : 'connect-to-sandbox',
+				$id,
 				$is_production ? __( 'Connect PayPal', 'woocommerce-paypal-payments' ) : __( 'Test Payments', 'woocommerce-paypal-payments' ),
 				$is_production ? 'primary' : 'secondary',
 				$is_production ? 'production' : 'sandbox'
diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index 29996a486..c69382725 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -17,6 +17,7 @@ use WooCommerce\PayPalCommerce\ApiClient\Helper\Cache;
 use WooCommerce\PayPalCommerce\ApiClient\Helper\DccApplies;
 use WooCommerce\PayPalCommerce\Button\Helper\MessagesDisclaimers;
 use WooCommerce\PayPalCommerce\Onboarding\Environment;
+use WooCommerce\PayPalCommerce\Onboarding\Render\OnboardingOptionsRenderer;
 use WooCommerce\PayPalCommerce\Onboarding\State;
 use WooCommerce\PayPalCommerce\WcGateway\Admin\OrderTablePaymentStatusColumn;
 use WooCommerce\PayPalCommerce\WcGateway\Admin\PaymentStatusOrderDetail;
@@ -257,23 +258,16 @@ return array(
 		$state = $container->get( 'onboarding.state' );
 		$messages_disclaimers = $container->get( 'button.helper.messages-disclaimers' );
 
-		$fields              = array(
-			'sandbox_on'                     => array(
-				'title'        => __( 'Sandbox', 'woocommerce-paypal-payments' ),
-				'type'         => 'checkbox',
-				'label'        => __( 'To test your WooCommerce installation, you can use the sandbox mode.', 'woocommerce-paypal-payments' ),
-				'default'      => 0,
-				'screens'      => array(
-					State::STATE_START,
-					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
-				),
-				'requirements' => array(),
-				'gateway'      => 'paypal',
-			),
+		$dcc_applies = $container->get( 'api.helpers.dccapplies' );
+		assert( $dcc_applies instanceof DccApplies );
 
-			// Production credentials.
-			'credentials_production_heading' => array(
+		$is_shop_supports_dcc = $dcc_applies->for_country_currency();
+
+		$onboarding_options_renderer = $container->get( 'onboarding.render-options' );
+		assert( $onboarding_options_renderer instanceof OnboardingOptionsRenderer );
+
+		$fields              = array(
+			'credentials_production_heading'     => array(
 				'heading'      => __( 'API Credentials', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -283,8 +277,34 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'ppcp_onboarding_production'     => array(
-				'title'        => __( 'Connect to PayPal', 'woocommerce-paypal-payments' ),
+			'credentials_sandbox_heading'        => array(
+				'heading'      => __( 'Sandbox API Credentials', 'woocommerce-paypal-payments' ),
+				'type'         => 'ppcp-heading',
+				'screens'      => array(
+					State::STATE_PROGRESSIVE,
+					State::STATE_ONBOARDED,
+				),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+				'description'  => __( 'Your account setting is set to sandbox, no real charging takes place. To accept live payments, switch your environment to live and connect your PayPal account.', 'woocommerce-paypal-payments' ),
+			),
+
+			'ppcp_onboarading_options'           => array(
+				'type'         => 'ppcp-text',
+				'text'         => $onboarding_options_renderer->render( $is_shop_supports_dcc ),
+				'raw'          => true,
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+				),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+			),
+
+			// We need to have a button for each option (ppcp, express)
+			// because currently the only documented way to use the PayPal onboarding JS library
+			// is to have the buttons before loading the script.
+			'ppcp_onboarding_production_ppcp'    => array(
 				'type'         => 'ppcp_onboarding',
 				'screens'      => array(
 					State::STATE_START,
@@ -292,11 +312,50 @@ return array(
 					State::STATE_ONBOARDED,
 				),
 				'env'          => 'production',
+				'products'     => array( 'PPCP' ),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
-				'description'  => __( 'Setup or link an existing PayPal account.', 'woocommerce-paypal-payments' ),
 			),
-			'ppcp_disconnect_production'     => array(
+			'ppcp_onboarding_production_express' => array(
+				'type'         => 'ppcp_onboarding',
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+					State::STATE_ONBOARDED,
+				),
+				'env'          => 'production',
+				'products'     => array( 'EXPRESS_CHECKOUT' ),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+			),
+			'ppcp_onboarding_sandbox_ppcp'       => array(
+				'type'         => 'ppcp_onboarding',
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+					State::STATE_ONBOARDED,
+				),
+				'env'          => 'sandbox',
+				'products'     => array( 'PPCP' ),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+				'description'  => __( 'Prior to accepting live payments, you can test payments on your WooCommerce platform in a safe PayPal sandbox environment.', 'woocommerce-paypal-payments' ),
+			),
+			'ppcp_onboarding_sandbox_express'    => array(
+				'type'         => 'ppcp_onboarding',
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+					State::STATE_ONBOARDED,
+				),
+				'env'          => 'sandbox',
+				'products'     => array( 'EXPRESS_CHECKOUT' ),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+				'description'  => __( 'Prior to accepting live payments, you can test payments on your WooCommerce platform in a safe PayPal sandbox environment.', 'woocommerce-paypal-payments' ),
+			),
+
+			'ppcp_disconnect_production'         => array(
 				'title'        => __( 'Disconnect from PayPal', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-text',
 				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
@@ -311,11 +370,25 @@ return array(
 				'gateway'      => 'paypal',
 				'description'  => __( 'Click to reset current credentials and use another account.', 'woocommerce-paypal-payments' ),
 			),
-			'production_toggle_manual_input' => array(
+			'ppcp_disconnect_sandbox'            => array(
+				'title'        => __( 'Disconnect from PayPal Sandbox', 'woocommerce-paypal-payments' ),
+				'type'         => 'ppcp-text',
+				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
+				'text'         => '<button type="button" class="button ppcp-disconnect sandbox">' . esc_html__( 'Disconnect', 'woocommerce-paypal-payments' ) . '</button>',
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+					State::STATE_ONBOARDED,
+				),
+				'env'          => 'production',
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+				'description'  => __( 'Click to reset current credentials and use another account.', 'woocommerce-paypal-payments' ),
+			),
+			'toggle_manual_input'                => array(
 				'type'         => 'ppcp-text',
-				'title'        => __( 'Manual mode', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
-				'text'         => '<button type="button" id="ppcp[production_toggle_manual_input]" class="production-toggle">' . __( 'Toggle to manual credential input', 'woocommerce-paypal-payments' ) . '</button>',
+				'text'         => '<button type="button" id="ppcp[toggle_manual_input]">' . __( 'Toggle to manual credential input', 'woocommerce-paypal-payments' ) . '</button>',
 				'screens'      => array(
 					State::STATE_START,
 					State::STATE_PROGRESSIVE,
@@ -324,7 +397,20 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'merchant_email_production'      => array(
+			'sandbox_on'                         => array(
+				'title'        => __( 'Sandbox', 'woocommerce-paypal-payments' ),
+				'type'         => 'checkbox',
+				'label'        => __( 'To test your WooCommerce installation, you can use the sandbox mode.', 'woocommerce-paypal-payments' ),
+				'default'      => 0,
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+					State::STATE_ONBOARDED,
+				),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+			),
+			'merchant_email_production'          => array(
 				'title'        => __( 'Live Email address', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
 				'type'         => 'text',
@@ -340,7 +426,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'merchant_id_production'         => array(
+			'merchant_id_production'             => array(
 				'title'        => __( 'Live Merchant Id', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
 				'type'         => 'ppcp-text-input',
@@ -355,7 +441,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'client_id_production'           => array(
+			'client_id_production'               => array(
 				'title'        => __( 'Live Client Id', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
 				'type'         => 'ppcp-text-input',
@@ -370,7 +456,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'client_secret_production'       => array(
+			'client_secret_production'           => array(
 				'title'        => __( 'Live Secret Key', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
 				'type'         => 'ppcp-password',
@@ -386,61 +472,7 @@ return array(
 				'gateway'      => 'paypal',
 			),
 
-			// Sandbox credentials.
-			'credentials_sandbox_heading'    => array(
-				'heading'      => __( 'Sandbox API Credentials', 'woocommerce-paypal-payments' ),
-				'type'         => 'ppcp-heading',
-				'screens'      => array(
-					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
-				),
-				'requirements' => array(),
-				'gateway'      => 'paypal',
-				'description'  => __( 'Your account setting is set to sandbox, no real charging takes place. To accept live payments, switch your environment to live and connect your PayPal account.', 'woocommerce-paypal-payments' ),
-			),
-
-			'ppcp_onboarding_sandbox'        => array(
-				'title'        => __( 'Connect to PayPal', 'woocommerce-paypal-payments' ),
-				'type'         => 'ppcp_onboarding',
-				'screens'      => array(
-					State::STATE_START,
-					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
-				),
-				'env'          => 'sandbox',
-				'requirements' => array(),
-				'gateway'      => 'paypal',
-				'description'  => __( 'Setup or link an existing PayPal Sandbox account.', 'woocommerce-paypal-payments' ),
-			),
-			'ppcp_disconnect_sandbox'        => array(
-				'title'        => __( 'Disconnect from PayPal Sandbox', 'woocommerce-paypal-payments' ),
-				'type'         => 'ppcp-text',
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
-				'text'         => '<button type="button" class="button ppcp-disconnect sandbox">' . esc_html__( 'Disconnect', 'woocommerce-paypal-payments' ) . '</button>',
-				'screens'      => array(
-					State::STATE_START,
-					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
-				),
-				'env'          => 'production',
-				'requirements' => array(),
-				'gateway'      => 'paypal',
-				'description'  => __( 'Click to reset current credentials and use another account.', 'woocommerce-paypal-payments' ),
-			),
-			'sandbox_toggle_manual_input'    => array(
-				'type'         => 'ppcp-text',
-				'title'        => __( 'Manual mode', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
-				'text'         => '<button type="button" id="ppcp[sandbox_toggle_manual_input]" class="sandbox-toggle">' . __( 'Toggle to manual credential input', 'woocommerce-paypal-payments' ) . '</button>',
-				'screens'      => array(
-					State::STATE_START,
-					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
-				),
-				'requirements' => array(),
-				'gateway'      => 'paypal',
-			),
-			'merchant_email_sandbox'         => array(
+			'merchant_email_sandbox'             => array(
 				'title'        => __( 'Sandbox Email address', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
 				'type'         => 'text',
@@ -456,7 +488,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'merchant_id_sandbox'            => array(
+			'merchant_id_sandbox'                => array(
 				'title'        => __( 'Sandbox Merchant Id', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
 				'type'         => 'ppcp-text-input',
@@ -471,7 +503,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'client_id_sandbox'              => array(
+			'client_id_sandbox'                  => array(
 				'title'        => __( 'Sandbox Client Id', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
 				'type'         => 'ppcp-text-input',
@@ -486,7 +518,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'client_secret_sandbox'          => array(
+			'client_secret_sandbox'              => array(
 				'title'        => __( 'Sandbox Secret Key', 'woocommerce-paypal-payments' ),
 				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
 				'type'         => 'ppcp-password',
@@ -502,7 +534,7 @@ return array(
 				'gateway'      => 'paypal',
 			),
 
-			'checkout_settings_heading'      => array(
+			'checkout_settings_heading'          => array(
 				'heading'      => __( 'PayPal Checkout Settings', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -512,7 +544,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'title'                          => array(
+			'title'                              => array(
 				'title'        => __( 'Title', 'woocommerce-paypal-payments' ),
 				'type'         => 'text',
 				'description'  => __(
@@ -528,7 +560,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'dcc_enabled'                    => array(
+			'dcc_enabled'                        => array(
 				'title'        => __( 'Enable/Disable', 'woocommerce-paypal-payments' ),
 				'desc_tip'     => true,
 				'description'  => __( 'Once enabled, the Credit Card option will show up in the checkout.', 'woocommerce-paypal-payments' ),
@@ -543,7 +575,7 @@ return array(
 					State::STATE_ONBOARDED,
 				),
 			),
-			'dcc_gateway_title'              => array(
+			'dcc_gateway_title'                  => array(
 				'title'        => __( 'Title', 'woocommerce-paypal-payments' ),
 				'type'         => 'text',
 				'description'  => __(
@@ -560,7 +592,7 @@ return array(
 				),
 				'gateway'      => 'dcc',
 			),
-			'description'                    => array(
+			'description'                        => array(
 				'title'        => __( 'Description', 'woocommerce-paypal-payments' ),
 				'type'         => 'text',
 				'desc_tip'     => true,
@@ -579,7 +611,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'intent'                         => array(
+			'intent'                             => array(
 				'title'        => __( 'Intent', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -600,7 +632,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'capture_for_virtual_only'       => array(
+			'capture_for_virtual_only'           => array(
 				'title'        => __( 'Capture Virtual-Only Orders ', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'default'      => false,
@@ -616,7 +648,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'payee_preferred'                => array(
+			'payee_preferred'                    => array(
 				'title'        => __( 'Instant Payments ', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'default'      => false,
@@ -633,7 +665,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'brand_name'                     => array(
+			'brand_name'                         => array(
 				'title'        => __( 'Brand Name', 'woocommerce-paypal-payments' ),
 				'type'         => 'text',
 				'default'      => get_bloginfo( 'name' ),
@@ -649,7 +681,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'landing_page'                   => array(
+			'landing_page'                       => array(
 				'title'        => __( 'Landing Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -671,7 +703,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'disable_funding'                => array(
+			'disable_funding'                    => array(
 				'title'        => __( 'Disable funding sources', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-multiselect',
 				'class'        => array(),
@@ -704,7 +736,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'vault_enabled'                  => array(
+			'vault_enabled'                      => array(
 				'title'        => __( 'Vaulting', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'desc_tip'     => true,
@@ -725,7 +757,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => array( 'paypal', 'dcc' ),
 			),
-			'logging_enabled'                => array(
+			'logging_enabled'                    => array(
 				'title'        => __( 'Logging', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'desc_tip'     => true,
@@ -740,7 +772,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'prefix'                         => array(
+			'prefix'                             => array(
 				'title'             => __( 'Invoice prefix', 'woocommerce-paypal-payments' ),
 				'type'              => 'text',
 				'desc_tip'          => true,
@@ -764,7 +796,7 @@ return array(
 			),
 
 			// General button styles.
-			'button_style_heading'           => array(
+			'button_style_heading'               => array(
 				'heading'      => __( 'Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -775,7 +807,7 @@ return array(
 				'gateway'      => 'paypal',
 				'description'  => __( 'Customize the appearance of PayPal Checkout on the checkout page.', 'woocommerce-paypal-payments' ),
 			),
-			'button_enabled'                 => array(
+			'button_enabled'                     => array(
 				'title'        => __( 'Enable buttons on Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Checkout', 'woocommerce-paypal-payments' ),
@@ -787,7 +819,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_layout'                  => array(
+			'button_layout'                      => array(
 				'title'        => __( 'Button Layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -809,7 +841,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_tagline'                 => array(
+			'button_tagline'                     => array(
 				'title'        => __( 'Tagline', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'default'      => true,
@@ -826,7 +858,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_label'                   => array(
+			'button_label'                       => array(
 				'title'        => __( 'Button Label', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -850,7 +882,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_color'                   => array(
+			'button_color'                       => array(
 				'title'        => __( 'Color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -874,7 +906,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_shape'                   => array(
+			'button_shape'                       => array(
 				'title'        => __( 'Shape', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -896,7 +928,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'message_heading'                => array(
+			'message_heading'                    => array(
 				'heading'      => __( 'Pay Later on Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -908,7 +940,7 @@ return array(
 				'description'  => str_replace( '<a>', '<a href="' . $messages_disclaimers->link_for_country() . '" target="_blank">', __( 'Displays Pay Later messaging for available offers. Restrictions apply. <a>Click here to learn more</a>. Pay Later button will show for eligible buyers and PayPal determines eligibility.', 'woocommerce-paypal-payments' ) ),
 				'class'        => array( 'ppcp-subheading' ),
 			),
-			'message_enabled'                => array(
+			'message_enabled'                    => array(
 				'title'        => __( 'Enable message on Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Checkout', 'woocommerce-paypal-payments' ),
@@ -920,7 +952,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_layout'                 => array(
+			'message_layout'                     => array(
 				'title'        => __( 'Pay Later Messaging layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -942,7 +974,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_logo'                   => array(
+			'message_logo'                       => array(
 				'title'        => __( 'Pay Later Messaging logo', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -966,7 +998,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_position'               => array(
+			'message_position'                   => array(
 				'title'        => __( 'Pay Later Messaging logo position', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -989,7 +1021,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_color'                  => array(
+			'message_color'                      => array(
 				'title'        => __( 'Pay Later Messaging text color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1013,7 +1045,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_flex_color'             => array(
+			'message_flex_color'                 => array(
 				'title'        => __( 'Pay Later Messaging color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1040,7 +1072,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_flex_ratio'             => array(
+			'message_flex_ratio'                 => array(
 				'title'        => __( 'Pay Later Messaging ratio', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1066,7 +1098,7 @@ return array(
 			),
 
 			// Single product page.
-			'button_product_heading'         => array(
+			'button_product_heading'             => array(
 				'heading'      => __( 'Single Product Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -1077,7 +1109,7 @@ return array(
 				'gateway'      => 'paypal',
 				'description'  => __( 'Customize the appearance of PayPal Checkout on the single product page.', 'woocommerce-paypal-payments' ),
 			),
-			'button_product_enabled'         => array(
+			'button_product_enabled'             => array(
 				'title'        => __( 'Enable buttons on Single Product', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Single Product', 'woocommerce-paypal-payments' ),
@@ -1089,7 +1121,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_product_layout'          => array(
+			'button_product_layout'              => array(
 				'title'        => __( 'Button Layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1111,7 +1143,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_product_tagline'         => array(
+			'button_product_tagline'             => array(
 				'title'        => __( 'Tagline', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable tagline', 'woocommerce-paypal-payments' ),
@@ -1128,7 +1160,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_product_label'           => array(
+			'button_product_label'               => array(
 				'title'        => __( 'Button Label', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1152,7 +1184,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_product_color'           => array(
+			'button_product_color'               => array(
 				'title'        => __( 'Color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1176,7 +1208,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_product_shape'           => array(
+			'button_product_shape'               => array(
 				'title'        => __( 'Shape', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1199,7 +1231,7 @@ return array(
 				'gateway'      => 'paypal',
 			),
 
-			'message_product_heading'        => array(
+			'message_product_heading'            => array(
 				'heading'      => __( 'Pay Later on Single Product Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -1211,7 +1243,7 @@ return array(
 				'description'  => str_replace( '<a>', '<a href="' . $messages_disclaimers->link_for_country() . '" target="_blank">', __( 'Displays Pay Later messaging for available offers. Restrictions apply. <a>Click here to learn more</a>. Pay Later button will show for eligible buyers and PayPal determines eligibility.', 'woocommerce-paypal-payments' ) ),
 				'class'        => array( 'ppcp-subheading' ),
 			),
-			'message_product_enabled'        => array(
+			'message_product_enabled'            => array(
 				'title'        => __( 'Enable message on Single Product', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Single Product', 'woocommerce-paypal-payments' ),
@@ -1223,7 +1255,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_product_layout'         => array(
+			'message_product_layout'             => array(
 				'title'        => __( 'Pay Later Messaging layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1245,7 +1277,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_product_logo'           => array(
+			'message_product_logo'               => array(
 				'title'        => __( 'Pay Later Messaging logo', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1269,7 +1301,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_product_position'       => array(
+			'message_product_position'           => array(
 				'title'        => __( 'Pay Later Messaging logo position', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1292,7 +1324,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_product_color'          => array(
+			'message_product_color'              => array(
 				'title'        => __( 'Pay Later Messaging text color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1316,7 +1348,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_product_flex_color'     => array(
+			'message_product_flex_color'         => array(
 				'title'        => __( 'Pay Later Messaging color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1343,7 +1375,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_product_flex_ratio'     => array(
+			'message_product_flex_ratio'         => array(
 				'title'        => __( 'Pay Later Messaging ratio', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1369,7 +1401,7 @@ return array(
 			),
 
 			// Cart settings.
-			'button_cart_heading'            => array(
+			'button_cart_heading'                => array(
 				'heading'      => __( 'Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -1380,7 +1412,7 @@ return array(
 				'gateway'      => 'paypal',
 				'description'  => __( 'Customize the appearance of PayPal Checkout on the cart page.', 'woocommerce-paypal-payments' ),
 			),
-			'button_cart_enabled'            => array(
+			'button_cart_enabled'                => array(
 				'title'        => __( 'Buttons on Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Cart', 'woocommerce-paypal-payments' ),
@@ -1392,7 +1424,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_cart_layout'             => array(
+			'button_cart_layout'                 => array(
 				'title'        => __( 'Button Layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1414,7 +1446,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_cart_tagline'            => array(
+			'button_cart_tagline'                => array(
 				'title'        => __( 'Tagline', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable tagline', 'woocommerce-paypal-payments' ),
@@ -1431,7 +1463,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_cart_label'              => array(
+			'button_cart_label'                  => array(
 				'title'        => __( 'Button Label', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1455,7 +1487,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_cart_color'              => array(
+			'button_cart_color'                  => array(
 				'title'        => __( 'Color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1479,7 +1511,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_cart_shape'              => array(
+			'button_cart_shape'                  => array(
 				'title'        => __( 'Shape', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1502,7 +1534,7 @@ return array(
 				'gateway'      => 'paypal',
 			),
 
-			'message_cart_heading'           => array(
+			'message_cart_heading'               => array(
 				'heading'      => __( 'Pay Later on Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -1514,7 +1546,7 @@ return array(
 				'description'  => str_replace( '<a>', '<a href="' . $messages_disclaimers->link_for_country() . '" target="_blank">', __( 'Displays Pay Later messaging for available offers. Restrictions apply. <a>Click here to learn more</a>. Pay Later button will show for eligible buyers and PayPal determines eligibility.', 'woocommerce-paypal-payments' ) ),
 				'class'        => array( 'ppcp-subheading' ),
 			),
-			'message_cart_enabled'           => array(
+			'message_cart_enabled'               => array(
 				'title'        => __( 'Enable message on Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Cart', 'woocommerce-paypal-payments' ),
@@ -1526,7 +1558,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_cart_layout'            => array(
+			'message_cart_layout'                => array(
 				'title'        => __( 'Pay Later Messaging layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1548,7 +1580,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_cart_logo'              => array(
+			'message_cart_logo'                  => array(
 				'title'        => __( 'Pay Later Messaging logo', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1572,7 +1604,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_cart_position'          => array(
+			'message_cart_position'              => array(
 				'title'        => __( 'Pay Later Messaging logo position', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1595,7 +1627,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_cart_color'             => array(
+			'message_cart_color'                 => array(
 				'title'        => __( 'Pay Later Messaging text color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1619,7 +1651,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_cart_flex_color'        => array(
+			'message_cart_flex_color'            => array(
 				'title'        => __( 'Pay Later Messaging color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1646,7 +1678,7 @@ return array(
 				'requirements' => array( 'messages' ),
 				'gateway'      => 'paypal',
 			),
-			'message_cart_flex_ratio'        => array(
+			'message_cart_flex_ratio'            => array(
 				'title'        => __( 'Pay Later Messaging ratio', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1672,7 +1704,7 @@ return array(
 			),
 
 			// Mini cart settings.
-			'button_mini-cart_heading'       => array(
+			'button_mini-cart_heading'           => array(
 				'heading'      => __( 'Mini Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
@@ -1683,7 +1715,7 @@ return array(
 				'gateway'      => 'paypal',
 				'description'  => __( 'Customize the appearance of PayPal Checkout on the Mini Cart.', 'woocommerce-paypal-payments' ),
 			),
-			'button_mini-cart_enabled'       => array(
+			'button_mini-cart_enabled'           => array(
 				'title'        => __( 'Buttons on Mini Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable on Mini Cart', 'woocommerce-paypal-payments' ),
@@ -1695,7 +1727,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_mini-cart_layout'        => array(
+			'button_mini-cart_layout'            => array(
 				'title'        => __( 'Button Layout', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1717,7 +1749,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_mini-cart_tagline'       => array(
+			'button_mini-cart_tagline'           => array(
 				'title'        => __( 'Tagline', 'woocommerce-paypal-payments' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'Enable tagline', 'woocommerce-paypal-payments' ),
@@ -1734,7 +1766,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_mini-cart_label'         => array(
+			'button_mini-cart_label'             => array(
 				'title'        => __( 'Button Label', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1758,7 +1790,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_mini-cart_color'         => array(
+			'button_mini-cart_color'             => array(
 				'title'        => __( 'Color', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1782,7 +1814,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_mini-cart_shape'         => array(
+			'button_mini-cart_shape'             => array(
 				'title'        => __( 'Shape', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'class'        => array(),
@@ -1804,7 +1836,7 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
-			'button_mini-cart_height'        => array(
+			'button_mini-cart_height'            => array(
 				'title'        => __( 'Button Height', 'woocommerce-paypal-payments' ),
 				'type'         => 'number',
 				'default'      => '35',
@@ -1818,7 +1850,7 @@ return array(
 				'gateway'      => 'paypal',
 			),
 
-			'disable_cards'                  => array(
+			'disable_cards'                      => array(
 				'title'        => __( 'Disable specific credit cards', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-multiselect',
 				'class'        => array(),
@@ -1846,7 +1878,7 @@ return array(
 				),
 				'gateway'      => 'dcc',
 			),
-			'card_icons'                     => array(
+			'card_icons'                         => array(
 				'title'        => __( 'Show logo of the following credit cards', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-multiselect',
 				'class'        => array(),
@@ -1874,7 +1906,7 @@ return array(
 				),
 				'gateway'      => 'dcc',
 			),
-			'3d_secure_heading'              => array(
+			'3d_secure_heading'                  => array(
 				'heading'      => __( '3D Secure', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'description'  => wp_kses_post(
@@ -1902,7 +1934,7 @@ return array(
 				),
 				'gateway'      => 'dcc',
 			),
-			'3d_secure_contingency'          => array(
+			'3d_secure_contingency'              => array(
 				'title'        => __( 'Contingency for 3D Secure', 'woocommerce-paypal-payments' ),
 				'type'         => 'select',
 				'description'  => sprintf(
@@ -1935,26 +1967,26 @@ return array(
 			unset( $fields['vault_enabled'] );
 		}
 
-		if ( State::STATE_ONBOARDED === $state->production_state() ) {
-			unset( $fields['ppcp_onboarding_production'] );
-		} else {
-			unset( $fields['ppcp_disconnect_production'] );
+		if ( State::STATE_ONBOARDED === $state->production_state() || State::STATE_ONBOARDED === $state->sandbox_state() ) {
+			unset( $fields['ppcp_onboarading_options'] );
+			unset( $fields['ppcp_onboarding_sandbox_ppcp'] );
+			unset( $fields['ppcp_onboarding_sandbox_express'] );
+			unset( $fields['ppcp_onboarding_production_ppcp'] );
+			unset( $fields['ppcp_onboarding_production_express'] );
 		}
-		if ( State::STATE_ONBOARDED === $state->sandbox_state() ) {
-			unset( $fields['ppcp_onboarding_sandbox'] );
+		if ( State::STATE_ONBOARDED === $state->production_state() ) {
+			unset( $fields['ppcp_disconnect_sandbox'] );
+		} elseif ( State::STATE_ONBOARDED === $state->sandbox_state() ) {
+			unset( $fields['ppcp_disconnect_production'] );
 		} else {
 			unset( $fields['ppcp_disconnect_sandbox'] );
+			unset( $fields['ppcp_disconnect_production'] );
 		}
 
 		/**
 		 * Depending on your store location, some credit cards can't be used.
 		 * Here, we filter them out.
-		 *
-		 * The DCC Applies object.
-		 *
-		 * @var DccApplies $dcc_applies
 		 */
-		$dcc_applies = $container->get( 'api.helpers.dccapplies' );
 		$card_options = $fields['disable_cards']['options'];
 		foreach ( $card_options as $card => $label ) {
 			if ( $dcc_applies->can_process_card( $card ) ) {
diff --git a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
index c9f40bc4a..04870b615 100644
--- a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
+++ b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
@@ -475,7 +475,14 @@ $data_rows_html
 	 * @param array $config The configuration array.
 	 */
 	private function render_text( array $config ) {
-		echo wp_kses_post( $config['text'] );
+		$raw = $config['raw'] ?? false;
+		if ( $raw ) {
+			// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
+			echo $config['text'];
+		} else {
+			echo wp_kses_post( $config['text'] );
+		}
+
 		if ( isset( $config['hidden'] ) ) {
 			$value = $this->settings->has( $config['hidden'] ) ?
 				(string) $this->settings->get( $config['hidden'] )

From c0e8beb0acfafa9b0ddc5354604e4883319c8094 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 18 Jan 2022 10:52:03 +0200
Subject: [PATCH 06/21] Add onboarding header

---
 .gitignore                                    |   3 +-
 .../ppcp-onboarding/assets/css/onboarding.css |  25 +++++++++++++
 .../assets/images/paylater-button.png         | Bin 0 -> 2412 bytes
 .../assets/images/paypal-button.png           | Bin 0 -> 1877 bytes
 .../ppcp-wc-gateway/assets/images/paypal.png  | Bin 0 -> 3739 bytes
 .../assets/images/venmo-button.png            | Bin 0 -> 1281 bytes
 modules/ppcp-wc-gateway/services.php          |  35 ++++++++++++++++++
 7 files changed, 62 insertions(+), 1 deletion(-)
 create mode 100644 modules/ppcp-wc-gateway/assets/images/paylater-button.png
 create mode 100644 modules/ppcp-wc-gateway/assets/images/paypal-button.png
 create mode 100644 modules/ppcp-wc-gateway/assets/images/paypal.png
 create mode 100644 modules/ppcp-wc-gateway/assets/images/venmo-button.png

diff --git a/.gitignore b/.gitignore
index 9b188c6da..ae438ab55 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,7 +5,8 @@ node_modules
 .phpunit.result.cache
 yarn-error.log
 modules/ppcp-button/assets/*
-modules/ppcp-wc-gateway/assets/*
+modules/ppcp-wc-gateway/assets/js
+modules/ppcp-wc-gateway/assets/css
 *.zip
 .env
 auth.json
diff --git a/modules/ppcp-onboarding/assets/css/onboarding.css b/modules/ppcp-onboarding/assets/css/onboarding.css
index 47428ca52..cfafb6e35 100644
--- a/modules/ppcp-onboarding/assets/css/onboarding.css
+++ b/modules/ppcp-onboarding/assets/css/onboarding.css
@@ -102,3 +102,28 @@ ul.ppcp-onboarding-options-sublist {
 .ppcp-muted-text {
 	opacity: 0.6;
 }
+
+.ppcp-onboarding-header {
+	display: flex;
+	width: 1000px;
+}
+
+.ppcp-onboarding-header-left, .ppcp-onboarding-header-right {
+	flex: 50%;
+}
+
+.ppcp-onboarding-header h2 {
+	margin-top: 0;
+}
+
+.ppcp-onboarding-header-cards img, .ppcp-onboarding-header-paypal-logos img {
+	margin: 5px;
+}
+
+.ppcp-onboarding-header-cards img {
+	height: 40px;
+}
+
+.ppcp-onboarding-header-paypal-logos img {
+	height: 45px;
+}
diff --git a/modules/ppcp-wc-gateway/assets/images/paylater-button.png b/modules/ppcp-wc-gateway/assets/images/paylater-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..f7aaa4c44488ccc86f423dcba712f64e088715cd
GIT binary patch
literal 2412
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
Br&9m`

literal 0
HcmV?d00001

diff --git a/modules/ppcp-wc-gateway/assets/images/paypal-button.png b/modules/ppcp-wc-gateway/assets/images/paypal-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..277d5119ecc93abb63ae5c64ab696dc34cab028e
GIT binary patch
literal 1877
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

literal 0
HcmV?d00001

diff --git a/modules/ppcp-wc-gateway/assets/images/paypal.png b/modules/ppcp-wc-gateway/assets/images/paypal.png
new file mode 100644
index 0000000000000000000000000000000000000000..c96468364303570f8ef741688752367d509aac2b
GIT binary patch
literal 3739
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
FV1gTwD7gRt

literal 0
HcmV?d00001

diff --git a/modules/ppcp-wc-gateway/assets/images/venmo-button.png b/modules/ppcp-wc-gateway/assets/images/venmo-button.png
new file mode 100644
index 0000000000000000000000000000000000000000..029e51a6878c08cafe87af152d8af66441e15f95
GIT binary patch
literal 1281
zcmb7E`#Tc~09{tHp>7MeC<`q%-@WPzlgCn1#%*k-^<eq5NX%!(Oytp%$(Hb?*-&{D
zce6ZZqM5E&if;0lK5UZQ(uOUQyzYLu|3K&a&N<)t@%(U3Rsi<6G1wdo004|JK4`qo
z3w3lf(AR0y&Nd^RZKNH+5DaukF(7B^q8NkrA~3j0PAhHuag(mr9&!M}3LHG~)SZej
zMV7^xpA8zd!tdRk>FIbN4<!}9*?M6gFCzU<#N)qMeHB^u7S*LRD`UcAg$lvygcrLs
zH#Rof?ilKa$=?{+ER8G2$CX6+BAsoX>gfiw%J@zm0`6I-*zJdyfNyWSp=aauK<X3l
zQ_+*R0Pu9KHaz^zYzIumsM`|UijYqxN?*<_&ZMorztuo-N-w{elBTUfI%An#szdTY
zxjPP&vEX*bq}tH>?t6zrk_FRP4Q;mtOsb9%u}=cOHvmV^ytIVEq|dK}&Jv(*-${lb
zKq^Xqyrp2~;7n(dL&jO)9^a{1k_AHu8t9v}t;tB<92Y(E3p!tqXWKulH5Wd;I5wMG
zU)S_bUlh}Qg@b-lKjQkj@xD_7Vx=S{`NalB5A<>vl+yFJ%jxk!>_1V!)`Z#*!X>qX
z(kB9S0wv-dRjkR?t82s7g^`*4pSysWKC`0iH=94+5;ma5795zq1EB%}d5swYFHbmK
zvKadgbw52*cvG#3b~bA`&nNLDAtMQ|B|ms^)D2R$OZ$`QEMJ4yu+mx(UZqtOeVv~`
zkMcEplY>D+SQIm&ri{;qb$w*zeK3b(VP=&}r!<aBqo+(JWJ>y$vB}S=6VOTTKu|`3
zYoT%%6+wAspVSt=h!$$+aokzryb>T|e8r-wc-6{Sy?S~%-;exi`so_gvqIH09V<{B
z?yrq<=ij6cB$YzEC4Qk5*Z60>)op%DUj<~S)^0<LAk#jcAJ&>?#BEdFmIRI2<<bQM
zWY)5}JUW_t@m>N+6D+1vT)F=)({LZ9bq^tW*}LFqk8YA1%8O0vuKca#<k2rX^N^;t
z0bxR7d^)RXpMM9THzEw|I9*s=$Xpf>+m~aSuUA0yfO|V+_85SevihPcYdmhwwB<|7
z8jfBYf_*gCRODyW6WKG`D;OhCf<9FU82QXceTD_wWOjYv=v9t5M~S@jO4<?oaI9yF
znJ$k^QGJ5sK0B7%47ZX|vOB}iyB$>cm(=N6dMX6hM8maCL&&$E-*(__90cJZ!{;x+
zU(z{L3@4Bha%8TYT;h`-<urr$=d{B&Y1_n>To2d8lJIrWz4_ilb1NbPTC%ZheG5Z#
z&FnbN7ZGP3_{}>~Ae4*U!vz7RiSO034;JWv*qUPzC(7|<?6yeK_2kMQrg;ws@9a+8
zK6TNva(?hs)j48`H|0u05i<v}ttx42@3WRB;ZAH>G1mn#87kplMQ*z6uj!zy8zA8$
zyEd&P<U>R?od`dgsQW}BO}SPSnZzNYs0ft@MM=*k91A@>&tfDhQpGrMyk&Ot(vKA)
zx|pwjE+?p-6DXs;%Nb-nx5m~{l)rv)PLtf}9i66$JRUr5f2Cr3)%|XLI^+(Bg<roE
zXNjv0chVwmucz7U|HA@NV2xQQ{n_>Ze-%^EnW?h72YR_?x=#aOys>D(k<hFE0kNcL
AKL7v#

literal 0
HcmV?d00001

diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index c69382725..eaff72430 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -266,7 +266,41 @@ return array(
 		$onboarding_options_renderer = $container->get( 'onboarding.render-options' );
 		assert( $onboarding_options_renderer instanceof OnboardingOptionsRenderer );
 
+		$module_url = $container->get( 'wcgateway.url' );
+
 		$fields              = array(
+			'ppcp_onboarading_header'            => array(
+				'type'         => 'ppcp-text',
+				'text'         => '
+<div class="ppcp-onboarding-header">
+	<div class="ppcp-onboarding-header-left">
+		<img alt="paypal" src="' . esc_url( $module_url ) . 'assets/images/paypal.png"/>
+		<h2>The all-in-one checkout solution</h2>
+	</div>
+	<div class="ppcp-onboarding-header-right">
+		<div class="ppcp-onboarding-header-paypal-logos">
+			<img alt="venmo" src="' . esc_url( $module_url ) . 'assets/images/paypal-button.png"/>
+			<img alt="venmo" src="' . esc_url( $module_url ) . 'assets/images/venmo-button.png"/>
+			<img alt="venmo" src="' . esc_url( $module_url ) . 'assets/images/paylater-button.png"/>
+		</div>
+		<div class="ppcp-onboarding-header-cards">
+			<img alt="visa" src="' . esc_url( $module_url ) . 'assets/images/visa.svg"/>
+			<img alt="mastercard" src="' . esc_url( $module_url ) . 'assets/images/mastercard.svg"/>
+			<img alt="amex" src="' . esc_url( $module_url ) . 'assets/images/amex.svg"/>
+			<img alt="discover" src="' . esc_url( $module_url ) . 'assets/images/discover.svg"/>
+			<img alt="ideal" src="' . esc_url( $module_url ) . 'assets/images/ideal.svg"/>
+			<img alt="sofort" src="' . esc_url( $module_url ) . 'assets/images/sofort.svg"/>
+		</div>
+	</div>
+</div>',
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_PROGRESSIVE,
+				),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+			),
+
 			'credentials_production_heading'     => array(
 				'heading'      => __( 'API Credentials', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
@@ -1968,6 +2002,7 @@ return array(
 		}
 
 		if ( State::STATE_ONBOARDED === $state->production_state() || State::STATE_ONBOARDED === $state->sandbox_state() ) {
+			unset( $fields['ppcp_onboarading_header'] );
 			unset( $fields['ppcp_onboarading_options'] );
 			unset( $fields['ppcp_onboarding_sandbox_ppcp'] );
 			unset( $fields['ppcp_onboarding_sandbox_express'] );

From 6b9a8340649698dd7839a981968d09e0e0354ab9 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 18 Jan 2022 10:53:43 +0200
Subject: [PATCH 07/21] Prevent unsaved data dialog for onboarding checkboxes

---
 .../ppcp-onboarding/assets/js/onboarding.js   | 27 +++++++++++++------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index 9613196ae..03c45ceda 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -243,6 +243,19 @@ const disconnect = (event) => {
 	document.querySelector('.woocommerce-save-button').click();
 };
 
+// Prevent the message about unsaved checkbox/radiobutton when reloading the page.
+// (WC listens for changes on all inputs and sets dirty flag until form submission)
+const preventDirtyCheckboxPropagation = event => {
+    event.preventDefault();
+    event.stopPropagation();
+
+    const value = event.target.checked;
+    setTimeout( () => {
+            event.target.checked = value;
+        }, 1
+    );
+};
+
 (() => {
 	const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
 	if (sandboxSwitchElement) {
@@ -266,20 +279,18 @@ const disconnect = (event) => {
 
 				toggleSandboxProduction( ! value );
 
-                // Prevent a possibly dirty form arising from this particular checkbox.
-				event.preventDefault();
-				event.stopPropagation();
-				setTimeout( () => {
-					event.target.checked = value;
-					}, 1
-				);
+                preventDirtyCheckboxPropagation(event);
 			}
 		);
 	}
 
     document.querySelectorAll('.ppcp-onboarding-options input').forEach(
         (element) => {
-            element.addEventListener('click', updateOptionsState);
+            element.addEventListener('click', event => {
+                updateOptionsState();
+
+                preventDirtyCheckboxPropagation(event);
+            });
         }
     );
 

From baa4672e1b57c9891c280eb6ec9769f568f51aa5 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 18 Jan 2022 13:38:22 +0200
Subject: [PATCH 08/21] Update manual credentials toggle

---
 .../ppcp-onboarding/assets/css/onboarding.css |  21 +-
 .../ppcp-onboarding/assets/js/onboarding.js   | 182 ++++++------------
 modules/ppcp-wc-gateway/services.php          |  28 +--
 3 files changed, 68 insertions(+), 163 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/css/onboarding.css b/modules/ppcp-onboarding/assets/css/onboarding.css
index cfafb6e35..212ac2033 100644
--- a/modules/ppcp-onboarding/assets/css/onboarding.css
+++ b/modules/ppcp-onboarding/assets/css/onboarding.css
@@ -3,8 +3,6 @@
 }
 
 #field-merchant_email_production,
-#field-ppcp_disconnect_sandbox,
-#field-ppcp_disconnect_production,
 #field-merchant_id_production,
 #field-client_id_production,
 #field-client_secret_production,
@@ -14,9 +12,8 @@
 #field-client_secret_sandbox{
 	display: none;
 }
+
 #field-merchant_email_production.show,
-#field-ppcp_disconnect_sandbox.show,
-#field-ppcp_disconnect_production.show,
 #field-merchant_id_production.show,
 #field-client_id_production.show,
 #field-client_secret_production.show,
@@ -27,14 +24,6 @@
 	display: table-row;
 }
 
-#field-toggle_manual_input span.hide,
-#field-toggle_manual_input.show span.show{
-	display: none;
-}
-#field-toggle_manual_input.show span.hide {
-	display: unset;
-}
-
 #field-toggle_manual_input button {
 	color: #0073aa;
 	transition-property: border, background, color;
@@ -48,13 +37,10 @@
 	padding: 0;
 }
 
-#field-toggle_manual_input.onboarded {
+#field-sandbox_on.onboarded {
 	display: none;
 }
 
-
-#field-ppcp_disconnect_sandbox.onboarded,
-#field-ppcp_disconnect_production.onboarded,
 #field-merchant_email_sandbox.onboarded,
 #field-merchant_id_sandbox.onboarded,
 #field-client_id_sandbox.onboarded,
@@ -65,8 +51,7 @@
 #field-client_secret_production.onboarded {
 	display:table-row;
 }
-#field-ppcp_disconnect_sandbox.onboarded.hide,
-#field-ppcp_disconnect_production.onboarded.hide,
+
 #field-merchant_email_sandbox.onboarded.hide,
 #field-merchant_id_sandbox.onboarded.hide,
 #field-client_id_sandbox.onboarded.hide,
diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index 03c45ceda..43582ac4d 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -101,100 +101,11 @@ function ppcp_onboarding_productionCallback(...args) {
 	return ppcp_onboarding.loginSeller('production', ...args);
 }
 
-/**
- * Toggles the credential input fields.
- *
- * @param forProduction
- */
-const credentialToggle = (forProduction) => {
-
-	const sandboxClassSelectors = [
-		'#field-ppcp_disconnect_sandbox',
-		'#field-merchant_email_sandbox',
-		'#field-merchant_id_sandbox',
-		'#field-client_id_sandbox',
-		'#field-client_secret_sandbox',
-	];
-	const productionClassSelectors = [
-		'#field-ppcp_disconnect_production',
-		'#field-merchant_email_production',
-		'#field-merchant_id_production',
-		'#field-client_id_production',
-		'#field-client_secret_production',
-	];
-
-	const selectors = forProduction ? productionClassSelectors : sandboxClassSelectors;
-	document.querySelectorAll(selectors.join()).forEach(
-		(element) => {element.classList.toggle('show')}
-	)
-};
-
-/**
- * Toggles the visibility of the sandbox/production input fields.
- *
- * @param showProduction
- */
-const toggleSandboxProduction = (showProduction) => {
-	const productionDisplaySelectors = [
-		'#field-credentials_production_heading',
-	];
-	const productionClassSelectors = [
-
-		'#field-ppcp_disconnect_production',
-		'#field-merchant_email_production',
-		'#field-merchant_id_production',
-		'#field-client_id_production',
-		'#field-client_secret_production',
-	];
-	const sandboxDisplaySelectors = [
-		'#field-credentials_sandbox_heading',
-	];
-	const sandboxClassSelectors = [
-		'#field-ppcp_disconnect_sandbox',
-		'#field-merchant_email_sandbox',
-		'#field-merchant_id_sandbox',
-		'#field-client_id_sandbox',
-		'#field-client_secret_sandbox',
-	];
-
-	if (showProduction) {
-		document.querySelectorAll(productionDisplaySelectors.join()).forEach(
-			(element) => {element.style.display = ''}
-		);
-		document.querySelectorAll(sandboxDisplaySelectors.join()).forEach(
-			(element) => {element.style.display = 'none'}
-		);
-		document.querySelectorAll(productionClassSelectors.join()).forEach(
-			(element) => {element.classList.remove('hide')}
-		);
-		document.querySelectorAll(sandboxClassSelectors.join()).forEach(
-			(element) => {
-				element.classList.remove('show');
-				element.classList.add('hide');
-			}
-		);
-		return;
-	}
-	document.querySelectorAll(productionDisplaySelectors.join()).forEach(
-		(element) => {element.style.display = 'none'}
-	);
-	document.querySelectorAll(sandboxDisplaySelectors.join()).forEach(
-		(element) => {element.style.display = ''}
-	);
-
-	document.querySelectorAll(sandboxClassSelectors.join()).forEach(
-		(element) => {element.classList.remove('hide')}
-	);
-	document.querySelectorAll(productionClassSelectors.join()).forEach(
-		(element) => {
-			element.classList.remove('show');
-			element.classList.add('hide');
-		}
-	)
-};
-
 const updateOptionsState = () => {
     const cardsChk = document.querySelector('#ppcp-onboarding-accept-cards');
+    if (!cardsChk) {
+        return;
+    }
 
     document.querySelectorAll('#ppcp-onboarding-dcc-options input').forEach(input => {
         input.disabled = !cardsChk.checked;
@@ -221,6 +132,41 @@ const updateOptionsState = () => {
     );
 };
 
+const updateManualInputControls = (shown, isSandbox) => {
+    const productionElementsSelectors = [
+        '#field-merchant_email_production',
+        '#field-merchant_id_production',
+        '#field-client_id_production',
+        '#field-client_secret_production',
+    ];
+    const sandboxElementsSelectors = [
+        '#field-merchant_email_sandbox',
+        '#field-merchant_id_sandbox',
+        '#field-client_id_sandbox',
+        '#field-client_secret_sandbox',
+    ];
+    const otherElementsSelectors = [
+        '#field-sandbox_on',
+        '.woocommerce-save-button',
+    ];
+
+    document.querySelectorAll(productionElementsSelectors.join()).forEach(
+        element => {
+            element.classList.remove('hide', 'show');
+            element.classList.add((shown && !isSandbox) ? 'show' : 'hide');
+        }
+    );
+    document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
+        element => {
+            element.classList.remove('hide', 'show');
+            element.classList.add((shown && isSandbox) ? 'show' : 'hide');
+        }
+    );
+    document.querySelectorAll(otherElementsSelectors.join()).forEach(
+        element => element.style.display = shown ? '' : 'none'
+    );
+};
+
 const disconnect = (event) => {
 	event.preventDefault();
 	const fields = event.target.classList.contains('production') ? [
@@ -257,11 +203,6 @@ const preventDirtyCheckboxPropagation = event => {
 };
 
 (() => {
-	const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
-	if (sandboxSwitchElement) {
-		toggleSandboxProduction(! sandboxSwitchElement.checked);
-	}
-
 	document.querySelectorAll('.ppcp-disconnect').forEach(
 		(button) => {
 			button.addEventListener(
@@ -271,19 +212,6 @@ const preventDirtyCheckboxPropagation = event => {
 		}
 	);
 
-	if (sandboxSwitchElement) {
-		sandboxSwitchElement.addEventListener(
-			'click',
-			(event) => {
-				const value = event.target.checked;
-
-				toggleSandboxProduction( ! value );
-
-                preventDirtyCheckboxPropagation(event);
-			}
-		);
-	}
-
     document.querySelectorAll('.ppcp-onboarding-options input').forEach(
         (element) => {
             element.addEventListener('click', event => {
@@ -296,21 +224,33 @@ const preventDirtyCheckboxPropagation = event => {
 
     updateOptionsState();
 
-    document.querySelectorAll('#field-toggle_manual_input button').forEach(
-        (button) => {
-            button.addEventListener(
-                'click',
-                (event) => {
-                    event.preventDefault();
+    const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
 
-                    const isProduction = ! sandboxSwitchElement.checked;
-                    toggleSandboxProduction(isProduction);
-                    credentialToggle(isProduction);
-                }
-            )
+    const manualInputToggleButton = document.querySelector('#field-toggle_manual_input button');
+    let isManualInputShown = manualInputToggleButton === null; // toggle is removed after onboarding and the fields are always shown
+
+    manualInputToggleButton?.addEventListener(
+            'click',
+            (event) => {
+                event.preventDefault();
+
+                isManualInputShown = !isManualInputShown;
+
+                updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked);
+            }
+        );
+
+    sandboxSwitchElement.addEventListener(
+        'click',
+        (event) => {
+            updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked);
+
+            preventDirtyCheckboxPropagation(event);
         }
     );
 
+    updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked);
+
 	// Onboarding buttons.
 	ppcp_onboarding.init();
 })();
diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index eaff72430..43f96a576 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -320,7 +320,7 @@ return array(
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
-				'description'  => __( 'Your account setting is set to sandbox, no real charging takes place. To accept live payments, switch your environment to live and connect your PayPal account.', 'woocommerce-paypal-payments' ),
+				'description'  => __( 'Your account is connected to sandbox, no real charging takes place. To accept live payments, disconnect and connect your live PayPal account.', 'woocommerce-paypal-payments' ),
 			),
 
 			'ppcp_onboarading_options'           => array(
@@ -343,7 +343,6 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
 				),
 				'env'          => 'production',
 				'products'     => array( 'PPCP' ),
@@ -355,7 +354,6 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
 				),
 				'env'          => 'production',
 				'products'     => array( 'EXPRESS_CHECKOUT' ),
@@ -367,7 +365,6 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
 				),
 				'env'          => 'sandbox',
 				'products'     => array( 'PPCP' ),
@@ -380,7 +377,6 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
 				),
 				'env'          => 'sandbox',
 				'products'     => array( 'EXPRESS_CHECKOUT' ),
@@ -392,11 +388,8 @@ return array(
 			'ppcp_disconnect_production'         => array(
 				'title'        => __( 'Disconnect from PayPal', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-text',
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
 				'text'         => '<button type="button" class="button ppcp-disconnect production">' . esc_html__( 'Disconnect', 'woocommerce-paypal-payments' ) . '</button>',
 				'screens'      => array(
-					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'env'          => 'production',
@@ -407,11 +400,8 @@ return array(
 			'ppcp_disconnect_sandbox'            => array(
 				'title'        => __( 'Disconnect from PayPal Sandbox', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-text',
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
 				'text'         => '<button type="button" class="button ppcp-disconnect sandbox">' . esc_html__( 'Disconnect', 'woocommerce-paypal-payments' ) . '</button>',
 				'screens'      => array(
-					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'env'          => 'production',
@@ -421,18 +411,17 @@ return array(
 			),
 			'toggle_manual_input'                => array(
 				'type'         => 'ppcp-text',
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
 				'text'         => '<button type="button" id="ppcp[toggle_manual_input]">' . __( 'Toggle to manual credential input', 'woocommerce-paypal-payments' ) . '</button>',
 				'screens'      => array(
 					State::STATE_START,
 					State::STATE_PROGRESSIVE,
-					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
 			'sandbox_on'                         => array(
 				'title'        => __( 'Sandbox', 'woocommerce-paypal-payments' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() || State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'To test your WooCommerce installation, you can use the sandbox mode.', 'woocommerce-paypal-payments' ),
 				'default'      => 0,
@@ -2001,21 +1990,12 @@ return array(
 			unset( $fields['vault_enabled'] );
 		}
 
-		if ( State::STATE_ONBOARDED === $state->production_state() || State::STATE_ONBOARDED === $state->sandbox_state() ) {
-			unset( $fields['ppcp_onboarading_header'] );
-			unset( $fields['ppcp_onboarading_options'] );
-			unset( $fields['ppcp_onboarding_sandbox_ppcp'] );
-			unset( $fields['ppcp_onboarding_sandbox_express'] );
-			unset( $fields['ppcp_onboarding_production_ppcp'] );
-			unset( $fields['ppcp_onboarding_production_express'] );
-		}
 		if ( State::STATE_ONBOARDED === $state->production_state() ) {
 			unset( $fields['ppcp_disconnect_sandbox'] );
+			unset( $fields['credentials_sandbox_heading'] );
 		} elseif ( State::STATE_ONBOARDED === $state->sandbox_state() ) {
 			unset( $fields['ppcp_disconnect_production'] );
-		} else {
-			unset( $fields['ppcp_disconnect_sandbox'] );
-			unset( $fields['ppcp_disconnect_production'] );
+			unset( $fields['credentials_production_heading'] );
 		}
 
 		/**

From 15ce18ba90a35bb79af0444a26d96e3e5beb5b05 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Fri, 21 Jan 2022 08:05:10 +0200
Subject: [PATCH 09/21] Fix img alt

---
 modules/ppcp-wc-gateway/services.php | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index 43f96a576..24e7b753a 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -274,22 +274,22 @@ return array(
 				'text'         => '
 <div class="ppcp-onboarding-header">
 	<div class="ppcp-onboarding-header-left">
-		<img alt="paypal" src="' . esc_url( $module_url ) . 'assets/images/paypal.png"/>
+		<img alt="PayPal" src="' . esc_url( $module_url ) . 'assets/images/paypal.png"/>
 		<h2>The all-in-one checkout solution</h2>
 	</div>
 	<div class="ppcp-onboarding-header-right">
 		<div class="ppcp-onboarding-header-paypal-logos">
-			<img alt="venmo" src="' . esc_url( $module_url ) . 'assets/images/paypal-button.png"/>
-			<img alt="venmo" src="' . esc_url( $module_url ) . 'assets/images/venmo-button.png"/>
-			<img alt="venmo" src="' . esc_url( $module_url ) . 'assets/images/paylater-button.png"/>
+			<img alt="PayPal" src="' . esc_url( $module_url ) . 'assets/images/paypal-button.png"/>
+			<img alt="Venmo" src="' . esc_url( $module_url ) . 'assets/images/venmo-button.png"/>
+			<img alt="Pay Later" src="' . esc_url( $module_url ) . 'assets/images/paylater-button.png"/>
 		</div>
 		<div class="ppcp-onboarding-header-cards">
-			<img alt="visa" src="' . esc_url( $module_url ) . 'assets/images/visa.svg"/>
-			<img alt="mastercard" src="' . esc_url( $module_url ) . 'assets/images/mastercard.svg"/>
-			<img alt="amex" src="' . esc_url( $module_url ) . 'assets/images/amex.svg"/>
-			<img alt="discover" src="' . esc_url( $module_url ) . 'assets/images/discover.svg"/>
-			<img alt="ideal" src="' . esc_url( $module_url ) . 'assets/images/ideal.svg"/>
-			<img alt="sofort" src="' . esc_url( $module_url ) . 'assets/images/sofort.svg"/>
+			<img alt="Visa" src="' . esc_url( $module_url ) . 'assets/images/visa.svg"/>
+			<img alt="Mastercard" src="' . esc_url( $module_url ) . 'assets/images/mastercard.svg"/>
+			<img alt="American Express" src="' . esc_url( $module_url ) . 'assets/images/amex.svg"/>
+			<img alt="Discover" src="' . esc_url( $module_url ) . 'assets/images/discover.svg"/>
+			<img alt="iDEAL" src="' . esc_url( $module_url ) . 'assets/images/ideal.svg"/>
+			<img alt="Sofort" src="' . esc_url( $module_url ) . 'assets/images/sofort.svg"/>
 		</div>
 	</div>
 </div>',

From 2e50e59940de0c0e4d6c6be1bf93d883f5106c1b Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Mon, 31 Jan 2022 18:16:25 +0200
Subject: [PATCH 10/21] Remove progressive onboarding state

---
 modules/ppcp-button/services.php              |  2 +-
 .../src/OnboardingRESTController.php          |  3 -
 modules/ppcp-onboarding/src/State.php         | 37 ++-------
 modules/ppcp-wc-gateway/services.php          | 80 -------------------
 .../src/Notice/ConnectAdminNotice.php         |  2 +-
 modules/ppcp-webhooks/extensions.php          |  3 -
 .../WcGateway/Gateway/WcGatewayTest.php       |  1 -
 7 files changed, 7 insertions(+), 121 deletions(-)

diff --git a/modules/ppcp-button/services.php b/modules/ppcp-button/services.php
index fba90a1c8..f068cf5bb 100644
--- a/modules/ppcp-button/services.php
+++ b/modules/ppcp-button/services.php
@@ -52,7 +52,7 @@ return array(
 		 *
 		 * @var State $state
 		 */
-		if ( $state->current_state() <= State::STATE_PROGRESSIVE ) {
+		if ( $state->current_state() !== State::STATE_ONBOARDED ) {
 			return new DisabledSmartButton();
 		}
 		$settings           = $container->get( 'wcgateway.settings' );
diff --git a/modules/ppcp-onboarding/src/OnboardingRESTController.php b/modules/ppcp-onboarding/src/OnboardingRESTController.php
index 9a5fae43a..8e9a60290 100644
--- a/modules/ppcp-onboarding/src/OnboardingRESTController.php
+++ b/modules/ppcp-onboarding/src/OnboardingRESTController.php
@@ -279,9 +279,6 @@ class OnboardingRESTController {
 			case State::STATE_START:
 				$name = 'start';
 				break;
-			case State::STATE_PROGRESSIVE:
-				$name = 'progressive';
-				break;
 			case State::STATE_ONBOARDED:
 				$name = 'onboarded';
 				break;
diff --git a/modules/ppcp-onboarding/src/State.php b/modules/ppcp-onboarding/src/State.php
index c02367daa..02bb23954 100644
--- a/modules/ppcp-onboarding/src/State.php
+++ b/modules/ppcp-onboarding/src/State.php
@@ -16,9 +16,8 @@ use Psr\Container\ContainerInterface;
  */
 class State {
 
-	const STATE_START       = 0;
-	const STATE_PROGRESSIVE = 4;
-	const STATE_ONBOARDED   = 8;
+	const STATE_START     = 0;
+	const STATE_ONBOARDED = 8;
 
 	/**
 	 * The Environment.
@@ -57,9 +56,6 @@ class State {
 	public function current_state(): int {
 
 		return $this->state_by_keys(
-			array(
-				'merchant_email',
-			),
 			array(
 				'merchant_email',
 				'merchant_id',
@@ -77,9 +73,6 @@ class State {
 	public function sandbox_state() : int {
 
 		return $this->state_by_keys(
-			array(
-				'merchant_email_sandbox',
-			),
 			array(
 				'merchant_email_sandbox',
 				'merchant_id_sandbox',
@@ -97,9 +90,6 @@ class State {
 	public function production_state() : int {
 
 		return $this->state_by_keys(
-			array(
-				'merchant_email_production',
-			),
 			array(
 				'merchant_email_production',
 				'merchant_id_production',
@@ -112,34 +102,17 @@ class State {
 	/**
 	 * Returns the state based on progressive and onboarded values being looked up in the settings.
 	 *
-	 * @param array $progressive_keys The keys which need to be present to be at least in progressive state.
 	 * @param array $onboarded_keys The keys which need to be present to be in onboarded state.
 	 *
 	 * @return int
 	 */
-	private function state_by_keys( array $progressive_keys, array $onboarded_keys ) : int {
-		$state          = self::STATE_START;
-		$is_progressive = true;
-		foreach ( $progressive_keys as $key ) {
-			if ( ! $this->settings->has( $key ) || ! $this->settings->get( $key ) ) {
-				$is_progressive = false;
-			}
-		}
-		if ( $is_progressive ) {
-			$state = self::STATE_PROGRESSIVE;
-		}
-
-		$is_onboarded = true;
+	private function state_by_keys( array $onboarded_keys ) : int {
 		foreach ( $onboarded_keys as $key ) {
 			if ( ! $this->settings->has( $key ) || ! $this->settings->get( $key ) ) {
-				$is_onboarded = false;
+				return self::STATE_START;
 			}
 		}
 
-		if ( $is_onboarded ) {
-			$state = self::STATE_ONBOARDED;
-		}
-
-		return $state;
+		return self::STATE_ONBOARDED;
 	}
 }
diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index ed33337c9..52e41da94 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -294,7 +294,6 @@ return array(
 </div>',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -304,7 +303,6 @@ return array(
 				'heading'      => __( 'API Credentials', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -314,7 +312,6 @@ return array(
 				'heading'      => __( 'Sandbox API Credentials', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -328,7 +325,6 @@ return array(
 				'raw'          => true,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -341,7 +337,6 @@ return array(
 				'type'         => 'ppcp_onboarding',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'env'          => 'production',
 				'products'     => array( 'PPCP' ),
@@ -352,7 +347,6 @@ return array(
 				'type'         => 'ppcp_onboarding',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'env'          => 'production',
 				'products'     => array( 'EXPRESS_CHECKOUT' ),
@@ -363,7 +357,6 @@ return array(
 				'type'         => 'ppcp_onboarding',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'env'          => 'sandbox',
 				'products'     => array( 'PPCP' ),
@@ -375,7 +368,6 @@ return array(
 				'type'         => 'ppcp_onboarding',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'env'          => 'sandbox',
 				'products'     => array( 'EXPRESS_CHECKOUT' ),
@@ -413,7 +405,6 @@ return array(
 				'text'         => '<button type="button" id="ppcp[toggle_manual_input]">' . __( 'Toggle to manual credential input', 'woocommerce-paypal-payments' ) . '</button>',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -426,7 +417,6 @@ return array(
 				'default'      => 0,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -442,7 +432,6 @@ return array(
 				'default'      => '',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -457,7 +446,6 @@ return array(
 				'default'      => false,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -472,7 +460,6 @@ return array(
 				'default'      => false,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -487,7 +474,6 @@ return array(
 				'default'      => false,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -504,7 +490,6 @@ return array(
 				'default'      => '',
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -519,7 +504,6 @@ return array(
 				'default'      => false,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -534,7 +518,6 @@ return array(
 				'default'      => false,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -549,7 +532,6 @@ return array(
 				'default'      => false,
 				'screens'      => array(
 					State::STATE_START,
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -560,7 +542,6 @@ return array(
 				'heading'      => __( 'PayPal Checkout Settings', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -576,7 +557,6 @@ return array(
 				'default'      => __( 'PayPal', 'woocommerce-paypal-payments' ),
 				'desc_tip'     => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -627,7 +607,6 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -681,7 +660,6 @@ return array(
 				),
 				'label'        => __( 'Require Instant Payment', 'woocommerce-paypal-payments' ),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -697,7 +675,6 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -719,7 +696,6 @@ return array(
 					ApplicationContext::LANDING_PAGE_BILLING => __( 'Billing (Non-PayPal account)', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -752,7 +728,6 @@ return array(
 					'venmo'       => _x( 'Venmo', 'Name of payment method', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -788,7 +763,6 @@ return array(
 				'description'  => __( 'Enable logging of unexpected behavior. This can also log private data and should only be enabled in a development or stage environment.', 'woocommerce-paypal-payments' ),
 				'default'      => false,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -810,7 +784,6 @@ return array(
 					return substr( $letters, 0, 6 ) . '-';
 				} )(),
 				'screens'           => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements'      => array(),
@@ -822,7 +795,6 @@ return array(
 				'heading'      => __( 'Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -835,7 +807,6 @@ return array(
 				'label'        => __( 'Enable on Checkout', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -857,7 +828,6 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -874,7 +844,6 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -898,7 +867,6 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -922,7 +890,6 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -944,7 +911,6 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -954,7 +920,6 @@ return array(
 				'heading'      => __( 'Pay Later on Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -968,7 +933,6 @@ return array(
 				'label'        => __( 'Enable on Checkout', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -990,7 +954,6 @@ return array(
 					'flex' => __( 'Flex', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1014,7 +977,6 @@ return array(
 					'none'        => __( 'None', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1037,7 +999,6 @@ return array(
 					'top'   => __( 'Top', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1061,7 +1022,6 @@ return array(
 					'grayscale'  => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1088,7 +1048,6 @@ return array(
 					'grayscale'       => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1112,7 +1071,6 @@ return array(
 					'20x1' => __( '20x1', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1124,7 +1082,6 @@ return array(
 				'heading'      => __( 'Single Product Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1137,7 +1094,6 @@ return array(
 				'label'        => __( 'Enable on Single Product', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1159,7 +1115,6 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1176,7 +1131,6 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1200,7 +1154,6 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1224,7 +1177,6 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1246,7 +1198,6 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1257,7 +1208,6 @@ return array(
 				'heading'      => __( 'Pay Later on Single Product Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1271,7 +1221,6 @@ return array(
 				'label'        => __( 'Enable on Single Product', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1293,7 +1242,6 @@ return array(
 					'flex' => __( 'Flex', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1317,7 +1265,6 @@ return array(
 					'none'        => __( 'None', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1340,7 +1287,6 @@ return array(
 					'top'   => __( 'Top', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1364,7 +1310,6 @@ return array(
 					'grayscale'  => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1391,7 +1336,6 @@ return array(
 					'grayscale'       => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1415,7 +1359,6 @@ return array(
 					'20x1' => __( '20x1', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1427,7 +1370,6 @@ return array(
 				'heading'      => __( 'Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1440,7 +1382,6 @@ return array(
 				'label'        => __( 'Enable on Cart', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1462,7 +1403,6 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1479,7 +1419,6 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1503,7 +1442,6 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1527,7 +1465,6 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1549,7 +1486,6 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1560,7 +1496,6 @@ return array(
 				'heading'      => __( 'Pay Later on Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1574,7 +1509,6 @@ return array(
 				'label'        => __( 'Enable on Cart', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1596,7 +1530,6 @@ return array(
 					'flex' => __( 'Flex', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1620,7 +1553,6 @@ return array(
 					'none'        => __( 'None', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1643,7 +1575,6 @@ return array(
 					'top'   => __( 'Top', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1667,7 +1598,6 @@ return array(
 					'grayscale'  => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1694,7 +1624,6 @@ return array(
 					'grayscale'       => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1718,7 +1647,6 @@ return array(
 					'20x1' => __( '20x1', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1730,7 +1658,6 @@ return array(
 				'heading'      => __( 'Mini Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1743,7 +1670,6 @@ return array(
 				'label'        => __( 'Enable on Mini Cart', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1765,7 +1691,6 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1782,7 +1707,6 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1806,7 +1730,6 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1830,7 +1753,6 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1852,7 +1774,6 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1865,7 +1786,6 @@ return array(
 				'desc_tip'     => true,
 				'description'  => __( 'Add a value from 25 to 55.', 'woocommerce-paypal-payments' ),
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
diff --git a/modules/ppcp-wc-gateway/src/Notice/ConnectAdminNotice.php b/modules/ppcp-wc-gateway/src/Notice/ConnectAdminNotice.php
index 0f0ee59eb..ce5e9ee96 100644
--- a/modules/ppcp-wc-gateway/src/Notice/ConnectAdminNotice.php
+++ b/modules/ppcp-wc-gateway/src/Notice/ConnectAdminNotice.php
@@ -71,6 +71,6 @@ class ConnectAdminNotice {
 	 * @return bool
 	 */
 	protected function should_display(): bool {
-		return $this->state->current_state() < State::STATE_PROGRESSIVE;
+		return $this->state->current_state() !== State::STATE_ONBOARDED;
 	}
 }
diff --git a/modules/ppcp-webhooks/extensions.php b/modules/ppcp-webhooks/extensions.php
index 1f9fdcfdc..425c960f8 100644
--- a/modules/ppcp-webhooks/extensions.php
+++ b/modules/ppcp-webhooks/extensions.php
@@ -19,7 +19,6 @@ return array(
 				'title'        => __( 'Subscribed webhooks', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-table',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -34,7 +33,6 @@ return array(
 				'type'         => 'ppcp-text',
 				'text'         => '<button type="button" class="button ppcp-webhooks-resubscribe">' . esc_html__( 'Resubscribe', 'woocommerce-paypal-payments' ) . '</button>',
 				'screens'      => array(
-					State::STATE_PROGRESSIVE,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -53,7 +51,6 @@ return array(
 						'type'         => 'ppcp-text',
 						'text'         => '<button type="button" class="button ppcp-webhooks-simulate">' . esc_html__( 'Simulate', 'woocommerce-paypal-payments' ) . '</button>',
 						'screens'      => array(
-							State::STATE_PROGRESSIVE,
 							State::STATE_ONBOARDED,
 						),
 						'requirements' => array(),
diff --git a/tests/PHPUnit/WcGateway/Gateway/WcGatewayTest.php b/tests/PHPUnit/WcGateway/Gateway/WcGatewayTest.php
index 0df1b0e99..da4bec87e 100644
--- a/tests/PHPUnit/WcGateway/Gateway/WcGatewayTest.php
+++ b/tests/PHPUnit/WcGateway/Gateway/WcGatewayTest.php
@@ -269,7 +269,6 @@ class WcGatewayTest extends TestCase
     {
     	return [
     		[State::STATE_START, true],
-		    [State::STATE_PROGRESSIVE, true],
 		    [State::STATE_ONBOARDED, false]
 	    ];
     }

From 72c9bd1bef0d55373dc1b4f26396e44ad545e47c Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Thu, 3 Feb 2022 13:42:46 +0200
Subject: [PATCH 11/21] Change onboarding buttons text

---
 modules/ppcp-onboarding/src/Render/OnboardingRenderer.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
index ed1fb08bc..2b3021cc1 100644
--- a/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
+++ b/modules/ppcp-onboarding/src/Render/OnboardingRenderer.php
@@ -102,7 +102,7 @@ class OnboardingRenderer {
 			$this->render_button(
 				$this->get_signup_link( $is_production, $products ),
 				$id,
-				$is_production ? __( 'Connect PayPal', 'woocommerce-paypal-payments' ) : __( 'Test Payments', 'woocommerce-paypal-payments' ),
+				$is_production ? __( 'Connect with PayPal', 'woocommerce-paypal-payments' ) : __( 'Test payments with PayPal sandbox', 'woocommerce-paypal-payments' ),
 				$is_production ? 'primary' : 'secondary',
 				$is_production ? 'production' : 'sandbox'
 			);

From 70ef7dd367ecfd991939d17a2b93c2f4fda09cbb Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Thu, 3 Feb 2022 14:28:51 +0200
Subject: [PATCH 12/21] Refactor settings element state requirements checking

---
 modules/ppcp-onboarding/src/State.php         | 16 +++++++++++
 modules/ppcp-wc-gateway/services.php          | 28 +++++++++----------
 .../src/Settings/SettingsRenderer.php         |  3 +-
 3 files changed, 32 insertions(+), 15 deletions(-)

diff --git a/modules/ppcp-onboarding/src/State.php b/modules/ppcp-onboarding/src/State.php
index 02bb23954..370fe95b4 100644
--- a/modules/ppcp-onboarding/src/State.php
+++ b/modules/ppcp-onboarding/src/State.php
@@ -48,6 +48,22 @@ class State {
 		$this->settings    = $settings;
 	}
 
+	/**
+	 * Returns the state of the specified environment (or the active environment if null).
+	 *
+	 * @param string|null $environment 'sandbox', 'production'.
+	 * @return int
+	 */
+	public function environment_state( ?string $environment = null ): int {
+		switch ( $environment ) {
+			case Environment::PRODUCTION:
+				return $this->production_state();
+			case Environment::SANDBOX:
+				return $this->sandbox_state();
+		}
+		return $this->current_state();
+	}
+
 	/**
 	 * Returns the current active onboarding state.
 	 *
diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index 52e41da94..e4319ac8a 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -255,6 +255,8 @@ return array(
 	'wcgateway.settings.fields'                    => static function ( ContainerInterface $container ): array {
 
 		$state = $container->get( 'onboarding.state' );
+		assert( $state instanceof State );
+
 		$messages_disclaimers = $container->get( 'button.helper.messages-disclaimers' );
 
 		$dcc_applies = $container->get( 'api.helpers.dccapplies' );
@@ -338,7 +340,8 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 				),
-				'env'          => 'production',
+				'state_from'   => Environment::PRODUCTION,
+				'env'          => Environment::PRODUCTION,
 				'products'     => array( 'PPCP' ),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -348,7 +351,8 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 				),
-				'env'          => 'production',
+				'state_from'   => Environment::PRODUCTION,
+				'env'          => Environment::PRODUCTION,
 				'products'     => array( 'EXPRESS_CHECKOUT' ),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -358,7 +362,8 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 				),
-				'env'          => 'sandbox',
+				'state_from'   => Environment::SANDBOX,
+				'env'          => Environment::SANDBOX,
 				'products'     => array( 'PPCP' ),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -369,7 +374,8 @@ return array(
 				'screens'      => array(
 					State::STATE_START,
 				),
-				'env'          => 'sandbox',
+				'state_from'   => Environment::SANDBOX,
+				'env'          => Environment::SANDBOX,
 				'products'     => array( 'EXPRESS_CHECKOUT' ),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -383,7 +389,8 @@ return array(
 				'screens'      => array(
 					State::STATE_ONBOARDED,
 				),
-				'env'          => 'production',
+				'state_from'   => Environment::PRODUCTION,
+				'env'          => Environment::PRODUCTION,
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 				'description'  => __( 'Click to reset current credentials and use another account.', 'woocommerce-paypal-payments' ),
@@ -395,7 +402,8 @@ return array(
 				'screens'      => array(
 					State::STATE_ONBOARDED,
 				),
-				'env'          => 'production',
+				'state_from'   => Environment::SANDBOX,
+				'env'          => Environment::SANDBOX,
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 				'description'  => __( 'Click to reset current credentials and use another account.', 'woocommerce-paypal-payments' ),
@@ -1909,14 +1917,6 @@ return array(
 			unset( $fields['vault_enabled'] );
 		}
 
-		if ( State::STATE_ONBOARDED === $state->production_state() ) {
-			unset( $fields['ppcp_disconnect_sandbox'] );
-			unset( $fields['credentials_sandbox_heading'] );
-		} elseif ( State::STATE_ONBOARDED === $state->sandbox_state() ) {
-			unset( $fields['ppcp_disconnect_production'] );
-			unset( $fields['credentials_production_heading'] );
-		}
-
 		/**
 		 * Depending on your store location, some credit cards can't be used.
 		 * Here, we filter them out.
diff --git a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
index 04870b615..d5d68be4b 100644
--- a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
+++ b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
@@ -12,6 +12,7 @@ namespace WooCommerce\PayPalCommerce\WcGateway\Settings;
 use WooCommerce\PayPalCommerce\AdminNotices\Entity\Message;
 use WooCommerce\PayPalCommerce\ApiClient\Helper\DccApplies;
 use WooCommerce\PayPalCommerce\Button\Helper\MessagesApply;
+use WooCommerce\PayPalCommerce\Onboarding\Environment;
 use WooCommerce\PayPalCommerce\Onboarding\State;
 use WooCommerce\PayPalCommerce\WcGateway\Gateway\CreditCardGateway;
 use Psr\Container\ContainerInterface;
@@ -388,7 +389,7 @@ $data_rows_html
 		<?php
 
 		foreach ( $this->fields as $field => $config ) :
-			if ( ! in_array( $this->state->current_state(), $config['screens'], true ) ) {
+			if ( ! in_array( $this->state->environment_state( $config['state_from'] ?? null ), $config['screens'], true ) ) {
 				continue;
 			}
 			if ( ! $this->field_matches_page( $config, $this->page_id ) ) {

From 38135bc94e12df483394f0c8d23833e7d84a5a1b Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Fri, 4 Feb 2022 10:50:54 +0200
Subject: [PATCH 13/21] Allow to switch between live and sandbox

---
 .../ppcp-onboarding/assets/css/onboarding.css | 52 +++------------
 .../ppcp-onboarding/assets/js/onboarding.js   | 63 ++++++++++++++++---
 modules/ppcp-onboarding/assets/js/settings.js |  6 +-
 .../src/Assets/OnboardingAssets.php           |  9 ++-
 .../src/OnboardingRESTController.php          | 32 +---------
 modules/ppcp-onboarding/src/State.php         | 17 +++++
 modules/ppcp-wc-gateway/services.php          | 30 ++++++---
 .../src/Settings/SettingsRenderer.php         |  1 +
 8 files changed, 117 insertions(+), 93 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/css/onboarding.css b/modules/ppcp-onboarding/assets/css/onboarding.css
index 212ac2033..a09a150d9 100644
--- a/modules/ppcp-onboarding/assets/css/onboarding.css
+++ b/modules/ppcp-onboarding/assets/css/onboarding.css
@@ -2,25 +2,19 @@
 	display: none;
 }
 
-#field-merchant_email_production,
-#field-merchant_id_production,
-#field-client_id_production,
-#field-client_secret_production,
-#field-merchant_email_sandbox,
-#field-merchant_id_sandbox,
-#field-client_id_sandbox,
-#field-client_secret_sandbox{
+.ppcp-onboarded .ppcp-onboarding-element:not(.ppcp-always-shown-element) {
 	display: none;
 }
 
-#field-merchant_email_production.show,
-#field-merchant_id_production.show,
-#field-client_id_production.show,
-#field-client_secret_production.show,
-#field-merchant_email_sandbox.show,
-#field-merchant_id_sandbox.show,
-#field-client_id_sandbox.show,
-#field-client_secret_sandbox.show {
+.ppcp-onboarding .ppcp-settings-field:not(.ppcp-onboarding-element):not(.ppcp-always-shown-element) {
+	display: none;
+}
+
+.ppcp-settings-field.hide {
+	display: none;
+}
+
+.ppcp-settings-field.show {
 	display: table-row;
 }
 
@@ -37,32 +31,6 @@
 	padding: 0;
 }
 
-#field-sandbox_on.onboarded {
-	display: none;
-}
-
-#field-merchant_email_sandbox.onboarded,
-#field-merchant_id_sandbox.onboarded,
-#field-client_id_sandbox.onboarded,
-#field-client_secret_sandbox.onboarded,
-#field-merchant_email_production.onboarded,
-#field-merchant_id_production.onboarded,
-#field-client_id_production.onboarded,
-#field-client_secret_production.onboarded {
-	display:table-row;
-}
-
-#field-merchant_email_sandbox.onboarded.hide,
-#field-merchant_id_sandbox.onboarded.hide,
-#field-client_id_sandbox.onboarded.hide,
-#field-client_secret_sandbox.onboarded.hide,
-#field-merchant_email_production.onboarded.hide,
-#field-merchant_id_production.onboarded.hide,
-#field-client_id_production.onboarded.hide,
-#field-client_secret_production.onboarded.hide {
-	display:none;
-}
-
 /* Probably not the best location for this but will do until there's a general purpose settings CSS file. */
 .ppcp-settings-field-heading td, .ppcp-settings-field-heading th, .ppcp-settings-no-title-col td {
 	padding-left: 0;
diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index 43582ac4d..950c50483 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -4,6 +4,9 @@ const ppcp_onboarding = {
 	PAYPAL_JS_ID: 'ppcp-onboarding-paypal-js',
 	_timeout: false,
 
+    STATE_START: 'start',
+    STATE_ONBOARDED: 'onboarded',
+
 	init: function() {
 		document.addEventListener('DOMContentLoaded', this.reload);
 	},
@@ -132,7 +135,7 @@ const updateOptionsState = () => {
     );
 };
 
-const updateManualInputControls = (shown, isSandbox) => {
+const updateManualInputControls = (shown, isSandbox, isAnyEnvOnboarded) => {
     const productionElementsSelectors = [
         '#field-merchant_email_production',
         '#field-merchant_id_production',
@@ -146,9 +149,11 @@ const updateManualInputControls = (shown, isSandbox) => {
         '#field-client_secret_sandbox',
     ];
     const otherElementsSelectors = [
-        '#field-sandbox_on',
         '.woocommerce-save-button',
     ];
+    if (!isAnyEnvOnboarded) {
+        otherElementsSelectors.push('#field-sandbox_on');
+    }
 
     document.querySelectorAll(productionElementsSelectors.join()).forEach(
         element => {
@@ -167,6 +172,24 @@ const updateManualInputControls = (shown, isSandbox) => {
     );
 };
 
+const updateEnvironmentControls = (isSandbox) => {
+    const productionElementsSelectors = [
+        '#field-ppcp_disconnect_production',
+        '#field-credentials_production_heading',
+    ];
+    const sandboxElementsSelectors = [
+        '#field-ppcp_disconnect_sandbox',
+        '#field-credentials_sandbox_heading',
+    ];
+
+    document.querySelectorAll(productionElementsSelectors.join()).forEach(
+        element => element.style.display = !isSandbox ? '' : 'none'
+    );
+    document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
+        element => element.style.display = isSandbox ? '' : 'none'
+    );
+};
+
 const disconnect = (event) => {
 	event.preventDefault();
 	const fields = event.target.classList.contains('production') ? [
@@ -203,6 +226,9 @@ const preventDirtyCheckboxPropagation = event => {
 };
 
 (() => {
+    const isAnyEnvOnboarded = PayPalCommerceGatewayOnboarding.sandbox_state === ppcp_onboarding.STATE_ONBOARDED ||
+        PayPalCommerceGatewayOnboarding.production_state === ppcp_onboarding.STATE_ONBOARDED;
+
 	document.querySelectorAll('.ppcp-disconnect').forEach(
 		(button) => {
 			button.addEventListener(
@@ -224,32 +250,55 @@ const preventDirtyCheckboxPropagation = event => {
 
     updateOptionsState();
 
+    const settingsContainer = document.querySelector('#mainform .form-table');
+
+    const markCurrentOnboardingState = (isOnboarded) => {
+        settingsContainer.classList.remove('ppcp-onboarded', 'ppcp-onboarding');
+        settingsContainer.classList.add(isOnboarded ? 'ppcp-onboarded' : 'ppcp-onboarding');
+    }
+
+    markCurrentOnboardingState(PayPalCommerceGatewayOnboarding.current_state === ppcp_onboarding.STATE_ONBOARDED);
+
     const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
 
     const manualInputToggleButton = document.querySelector('#field-toggle_manual_input button');
-    let isManualInputShown = manualInputToggleButton === null; // toggle is removed after onboarding and the fields are always shown
+    let isManualInputShown = isAnyEnvOnboarded;
 
-    manualInputToggleButton?.addEventListener(
+    manualInputToggleButton.addEventListener(
             'click',
             (event) => {
                 event.preventDefault();
 
                 isManualInputShown = !isManualInputShown;
 
-                updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked);
+                updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked, isAnyEnvOnboarded);
             }
         );
 
     sandboxSwitchElement.addEventListener(
         'click',
         (event) => {
-            updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked);
+            const isSandbox = sandboxSwitchElement.checked;
+
+            if (isAnyEnvOnboarded) {
+                const onboardingState = isSandbox ? PayPalCommerceGatewayOnboarding.sandbox_state : PayPalCommerceGatewayOnboarding.production_state;
+                const isOnboarded = onboardingState === ppcp_onboarding.STATE_ONBOARDED;
+
+                markCurrentOnboardingState(isOnboarded);
+                isManualInputShown = isOnboarded;
+            }
+
+            updateManualInputControls(isManualInputShown, isSandbox, isAnyEnvOnboarded);
+
+            updateEnvironmentControls(isSandbox);
 
             preventDirtyCheckboxPropagation(event);
         }
     );
 
-    updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked);
+    updateManualInputControls(isManualInputShown, sandboxSwitchElement.checked, isAnyEnvOnboarded);
+
+    updateEnvironmentControls(sandboxSwitchElement.checked);
 
 	// Onboarding buttons.
 	ppcp_onboarding.init();
diff --git a/modules/ppcp-onboarding/assets/js/settings.js b/modules/ppcp-onboarding/assets/js/settings.js
index e30b45856..9af409f07 100644
--- a/modules/ppcp-onboarding/assets/js/settings.js
+++ b/modules/ppcp-onboarding/assets/js/settings.js
@@ -23,7 +23,7 @@ document.addEventListener(
                     }
 
                     group.forEach( (elementToShow) => {
-                        document.querySelector(elementToShow).style.display = 'table-row';
+                        document.querySelector(elementToShow).style.display = '';
                     })
 
                     if('ppcp-message_enabled' === event.target.getAttribute('id')){
@@ -56,7 +56,7 @@ document.addEventListener(
                     return;
                 }
                 if (value === elementToToggle.value && domElement.style.display !== 'none') {
-                    domElement.style.display = 'table-row';
+                    domElement.style.display = '';
                     return;
                 }
                 domElement.style.display = 'none';
@@ -69,7 +69,7 @@ document.addEventListener(
                     const value = event.target.value;
                     group.forEach( (elementToToggle) => {
                         if (value === elementToToggle.value) {
-                            document.querySelector(elementToToggle.selector).style.display = 'table-row';
+                            document.querySelector(elementToToggle.selector).style.display = '';
                             return;
                         }
                         document.querySelector(elementToToggle.selector).style.display = 'none';
diff --git a/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php b/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
index 57a632860..9c883e960 100644
--- a/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
+++ b/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
@@ -103,9 +103,12 @@ class OnboardingAssets {
 	 */
 	public function get_script_data() {
 		return array(
-			'endpoint'      => home_url( \WC_AJAX::get_endpoint( LoginSellerEndpoint::ENDPOINT ) ),
-			'nonce'         => wp_create_nonce( $this->login_seller_endpoint::nonce() ),
-			'paypal_js_url' => 'https://www.paypal.com/webapps/merchantboarding/js/lib/lightbox/partner.js',
+			'endpoint'         => home_url( \WC_AJAX::get_endpoint( LoginSellerEndpoint::ENDPOINT ) ),
+			'nonce'            => wp_create_nonce( $this->login_seller_endpoint::nonce() ),
+			'paypal_js_url'    => 'https://www.paypal.com/webapps/merchantboarding/js/lib/lightbox/partner.js',
+			'sandbox_state'    => State::get_state_name( $this->state->sandbox_state() ),
+			'production_state' => State::get_state_name( $this->state->production_state() ),
+			'current_state'    => State::get_state_name( $this->state->current_state() ),
 		);
 	}
 
diff --git a/modules/ppcp-onboarding/src/OnboardingRESTController.php b/modules/ppcp-onboarding/src/OnboardingRESTController.php
index 8e9a60290..209534564 100644
--- a/modules/ppcp-onboarding/src/OnboardingRESTController.php
+++ b/modules/ppcp-onboarding/src/OnboardingRESTController.php
@@ -10,7 +10,6 @@ declare(strict_types=1);
 namespace WooCommerce\PayPalCommerce\Onboarding;
 
 use Psr\Container\ContainerInterface;
-use WooCommerce\PayPalCommerce\Onboarding\State;
 use WooCommerce\PayPalCommerce\WcGateway\Gateway\PayPalGateway;
 
 /**
@@ -138,13 +137,13 @@ class OnboardingRESTController {
 		return array(
 			'environment' => $environment->current_environment(),
 			'onboarded'   => ( $state->current_state() >= State::STATE_ONBOARDED ),
-			'state'       => $this->get_onboarding_state_name( $state->current_state() ),
+			'state'       => State::get_state_name( $state->current_state() ),
 			'sandbox'     => array(
-				'state'     => $this->get_onboarding_state_name( $state->sandbox_state() ),
+				'state'     => State::get_state_name( $state->sandbox_state() ),
 				'onboarded' => ( $state->sandbox_state() >= State::STATE_ONBOARDED ),
 			),
 			'production'  => array(
-				'state'     => $this->get_onboarding_state_name( $state->production_state() ),
+				'state'     => State::get_state_name( $state->production_state() ),
 				'onboarded' => ( $state->production_state() >= State::STATE_ONBOARDED ),
 			),
 		);
@@ -265,31 +264,6 @@ class OnboardingRESTController {
 		return add_query_arg( $this->return_url_args, $url );
 	}
 
-	/**
-	 * Translates an onboarding state to a string.
-	 *
-	 * @param int $state An onboarding state to translate as returned by {@link State} methods.
-	 * @return string A string representing the state: "start", "progressive" or "onboarded".
-	 * @see State::current_state(), State::sandbox_state(), State::production_state().
-	 */
-	public function get_onboarding_state_name( $state ) {
-		$name = 'unknown';
-
-		switch ( absint( $state ) ) {
-			case State::STATE_START:
-				$name = 'start';
-				break;
-			case State::STATE_ONBOARDED:
-				$name = 'onboarded';
-				break;
-			default:
-				break;
-
-		}
-
-		return $name;
-	}
-
 	/**
 	 * Generates a signup link for onboarding for a given environment and optionally adding certain URL arguments
 	 * to the URL users are redirected after completing the onboarding flow.
diff --git a/modules/ppcp-onboarding/src/State.php b/modules/ppcp-onboarding/src/State.php
index 370fe95b4..9967ac406 100644
--- a/modules/ppcp-onboarding/src/State.php
+++ b/modules/ppcp-onboarding/src/State.php
@@ -115,6 +115,23 @@ class State {
 		);
 	}
 
+	/**
+	 * Translates an onboarding state to a string.
+	 *
+	 * @param int $state An onboarding state to translate.
+	 * @return string A string representing the state: "start" or "onboarded".
+	 */
+	public static function get_state_name( int $state ) : string {
+		switch ( $state ) {
+			case self::STATE_START:
+				return 'start';
+			case self::STATE_ONBOARDED:
+				return 'onboarded';
+			default:
+				return 'unknown';
+		}
+	}
+
 	/**
 	 * Returns the state based on progressive and onboarded values being looked up in the settings.
 	 *
diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index e4319ac8a..bb879bdd4 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -272,6 +272,7 @@ return array(
 		$fields              = array(
 			'ppcp_onboarading_header'            => array(
 				'type'         => 'ppcp-text',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'text'         => '
 <div class="ppcp-onboarding-header">
 	<div class="ppcp-onboarding-header-left">
@@ -296,6 +297,7 @@ return array(
 </div>',
 				'screens'      => array(
 					State::STATE_START,
+					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -307,6 +309,7 @@ return array(
 				'screens'      => array(
 					State::STATE_ONBOARDED,
 				),
+				'state_from'   => Environment::PRODUCTION,
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
@@ -316,6 +319,7 @@ return array(
 				'screens'      => array(
 					State::STATE_ONBOARDED,
 				),
+				'state_from'   => Environment::SANDBOX,
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 				'description'  => __( 'Your account is connected to sandbox, no real charging takes place. To accept live payments, disconnect and connect your live PayPal account.', 'woocommerce-paypal-payments' ),
@@ -323,10 +327,12 @@ return array(
 
 			'ppcp_onboarading_options'           => array(
 				'type'         => 'ppcp-text',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'text'         => $onboarding_options_renderer->render( $is_shop_supports_dcc ),
 				'raw'          => true,
 				'screens'      => array(
 					State::STATE_START,
+					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
@@ -337,6 +343,7 @@ return array(
 			// is to have the buttons before loading the script.
 			'ppcp_onboarding_production_ppcp'    => array(
 				'type'         => 'ppcp_onboarding',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'screens'      => array(
 					State::STATE_START,
 				),
@@ -348,6 +355,7 @@ return array(
 			),
 			'ppcp_onboarding_production_express' => array(
 				'type'         => 'ppcp_onboarding',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'screens'      => array(
 					State::STATE_START,
 				),
@@ -359,6 +367,7 @@ return array(
 			),
 			'ppcp_onboarding_sandbox_ppcp'       => array(
 				'type'         => 'ppcp_onboarding',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'screens'      => array(
 					State::STATE_START,
 				),
@@ -371,6 +380,7 @@ return array(
 			),
 			'ppcp_onboarding_sandbox_express'    => array(
 				'type'         => 'ppcp_onboarding',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'screens'      => array(
 					State::STATE_START,
 				),
@@ -411,15 +421,17 @@ return array(
 			'toggle_manual_input'                => array(
 				'type'         => 'ppcp-text',
 				'text'         => '<button type="button" id="ppcp[toggle_manual_input]">' . __( 'Toggle to manual credential input', 'woocommerce-paypal-payments' ) . '</button>',
+				'classes'      => array( 'ppcp-onboarding-element' ),
 				'screens'      => array(
 					State::STATE_START,
+					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
 			'sandbox_on'                         => array(
 				'title'        => __( 'Sandbox', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() || State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
+				'classes'      => array( 'ppcp-onboarding-element', 'ppcp-always-shown-element' ),
 				'type'         => 'checkbox',
 				'label'        => __( 'To test your WooCommerce installation, you can use the sandbox mode.', 'woocommerce-paypal-payments' ),
 				'default'      => 0,
@@ -432,7 +444,7 @@ return array(
 			),
 			'merchant_email_production'          => array(
 				'title'        => __( 'Live Email address', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'text',
 				'required'     => true,
 				'desc_tip'     => true,
@@ -447,7 +459,7 @@ return array(
 			),
 			'merchant_id_production'             => array(
 				'title'        => __( 'Live Merchant Id', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'ppcp-text-input',
 				'desc_tip'     => true,
 				'description'  => __( 'The merchant id of your account ', 'woocommerce-paypal-payments' ),
@@ -461,7 +473,7 @@ return array(
 			),
 			'client_id_production'               => array(
 				'title'        => __( 'Live Client Id', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'ppcp-text-input',
 				'desc_tip'     => true,
 				'description'  => __( 'The client id of your api ', 'woocommerce-paypal-payments' ),
@@ -475,7 +487,7 @@ return array(
 			),
 			'client_secret_production'           => array(
 				'title'        => __( 'Live Secret Key', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->production_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'ppcp-password',
 				'desc_tip'     => true,
 				'description'  => __( 'The secret key of your api', 'woocommerce-paypal-payments' ),
@@ -490,7 +502,7 @@ return array(
 
 			'merchant_email_sandbox'             => array(
 				'title'        => __( 'Sandbox Email address', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'text',
 				'required'     => true,
 				'desc_tip'     => true,
@@ -505,7 +517,7 @@ return array(
 			),
 			'merchant_id_sandbox'                => array(
 				'title'        => __( 'Sandbox Merchant Id', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'ppcp-text-input',
 				'desc_tip'     => true,
 				'description'  => __( 'The merchant id of your account ', 'woocommerce-paypal-payments' ),
@@ -519,7 +531,7 @@ return array(
 			),
 			'client_id_sandbox'                  => array(
 				'title'        => __( 'Sandbox Client Id', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'ppcp-text-input',
 				'desc_tip'     => true,
 				'description'  => __( 'The client id of your api ', 'woocommerce-paypal-payments' ),
@@ -533,7 +545,7 @@ return array(
 			),
 			'client_secret_sandbox'              => array(
 				'title'        => __( 'Sandbox Secret Key', 'woocommerce-paypal-payments' ),
-				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '' ),
+				'classes'      => array( State::STATE_ONBOARDED === $state->sandbox_state() ? 'onboarded' : '', 'ppcp-always-shown-element' ),
 				'type'         => 'ppcp-password',
 				'desc_tip'     => true,
 				'description'  => __( 'The secret key of your api', 'woocommerce-paypal-payments' ),
diff --git a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
index d5d68be4b..61e3f8313 100644
--- a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
+++ b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
@@ -419,6 +419,7 @@ $data_rows_html
 			$config['id'] = $id;
 			$colspan      = ( 'ppcp-heading' !== $config['type'] && isset( $config['title'] ) ) ? 1 : 2;
 			$classes      = isset( $config['classes'] ) ? $config['classes'] : array();
+			$classes[]    = 'ppcp-settings-field';
 			$classes[]    = sprintf( 'ppcp-settings-field-%s', str_replace( 'ppcp-', '', $config['type'] ) );
 			if ( 1 !== $colspan ) {
 				$classes[] = 'ppcp-settings-no-title-col';

From 888bb63e8d00e7ceb8cac41e60942a5da6be3e20 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Fri, 4 Feb 2022 15:38:43 +0200
Subject: [PATCH 14/21] Fix missing fields when switching from disconnected to
 onboarded env

---
 modules/ppcp-wc-gateway/services.php | 64 ++++++++++++++++++++++++++++
 1 file changed, 64 insertions(+)

diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index bb879bdd4..c006f8b0c 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -562,6 +562,7 @@ return array(
 				'heading'      => __( 'PayPal Checkout Settings', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -577,6 +578,7 @@ return array(
 				'default'      => __( 'PayPal', 'woocommerce-paypal-payments' ),
 				'desc_tip'     => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -627,6 +629,7 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -648,6 +651,7 @@ return array(
 					'authorize' => __( 'Authorize', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -664,6 +668,7 @@ return array(
 				),
 				'label'        => __( 'Capture Virtual-Only Orders', 'woocommerce-paypal-payments' ),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -680,6 +685,7 @@ return array(
 				),
 				'label'        => __( 'Require Instant Payment', 'woocommerce-paypal-payments' ),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -695,6 +701,7 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -716,6 +723,7 @@ return array(
 					ApplicationContext::LANDING_PAGE_BILLING => __( 'Billing (Non-PayPal account)', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -748,6 +756,7 @@ return array(
 					'venmo'       => _x( 'Venmo', 'Name of payment method', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -783,6 +792,7 @@ return array(
 				'description'  => __( 'Enable logging of unexpected behavior. This can also log private data and should only be enabled in a development or stage environment.', 'woocommerce-paypal-payments' ),
 				'default'      => false,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -804,6 +814,7 @@ return array(
 					return substr( $letters, 0, 6 ) . '-';
 				} )(),
 				'screens'           => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements'      => array(),
@@ -815,6 +826,7 @@ return array(
 				'heading'      => __( 'Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -827,6 +839,7 @@ return array(
 				'label'        => __( 'Enable on Checkout', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -848,6 +861,7 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -864,6 +878,7 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -887,6 +902,7 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -910,6 +926,7 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -931,6 +948,7 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -940,6 +958,7 @@ return array(
 				'heading'      => __( 'Pay Later on Checkout', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -953,6 +972,7 @@ return array(
 				'label'        => __( 'Enable on Checkout', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -974,6 +994,7 @@ return array(
 					'flex' => __( 'Flex', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -997,6 +1018,7 @@ return array(
 					'none'        => __( 'None', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1019,6 +1041,7 @@ return array(
 					'top'   => __( 'Top', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1042,6 +1065,7 @@ return array(
 					'grayscale'  => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1068,6 +1092,7 @@ return array(
 					'grayscale'       => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1091,6 +1116,7 @@ return array(
 					'20x1' => __( '20x1', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1102,6 +1128,7 @@ return array(
 				'heading'      => __( 'Single Product Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1114,6 +1141,7 @@ return array(
 				'label'        => __( 'Enable on Single Product', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1135,6 +1163,7 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1151,6 +1180,7 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1174,6 +1204,7 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1197,6 +1228,7 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1218,6 +1250,7 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1228,6 +1261,7 @@ return array(
 				'heading'      => __( 'Pay Later on Single Product Page', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1241,6 +1275,7 @@ return array(
 				'label'        => __( 'Enable on Single Product', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1262,6 +1297,7 @@ return array(
 					'flex' => __( 'Flex', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1285,6 +1321,7 @@ return array(
 					'none'        => __( 'None', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1307,6 +1344,7 @@ return array(
 					'top'   => __( 'Top', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1330,6 +1368,7 @@ return array(
 					'grayscale'  => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1356,6 +1395,7 @@ return array(
 					'grayscale'       => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1379,6 +1419,7 @@ return array(
 					'20x1' => __( '20x1', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1390,6 +1431,7 @@ return array(
 				'heading'      => __( 'Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1402,6 +1444,7 @@ return array(
 				'label'        => __( 'Enable on Cart', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1423,6 +1466,7 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1439,6 +1483,7 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1462,6 +1507,7 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1485,6 +1531,7 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1506,6 +1553,7 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1516,6 +1564,7 @@ return array(
 				'heading'      => __( 'Pay Later on Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1529,6 +1578,7 @@ return array(
 				'label'        => __( 'Enable on Cart', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1550,6 +1600,7 @@ return array(
 					'flex' => __( 'Flex', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1573,6 +1624,7 @@ return array(
 					'none'        => __( 'None', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1595,6 +1647,7 @@ return array(
 					'top'   => __( 'Top', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1618,6 +1671,7 @@ return array(
 					'grayscale'  => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1644,6 +1698,7 @@ return array(
 					'grayscale'       => __( 'Grayscale', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1667,6 +1722,7 @@ return array(
 					'20x1' => __( '20x1', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array( 'messages' ),
@@ -1678,6 +1734,7 @@ return array(
 				'heading'      => __( 'Mini Cart', 'woocommerce-paypal-payments' ),
 				'type'         => 'ppcp-heading',
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1690,6 +1747,7 @@ return array(
 				'label'        => __( 'Enable on Mini Cart', 'woocommerce-paypal-payments' ),
 				'default'      => true,
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1711,6 +1769,7 @@ return array(
 					'horizontal' => __( 'Horizontal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1727,6 +1786,7 @@ return array(
 					'woocommerce-paypal-payments'
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1750,6 +1810,7 @@ return array(
 					'pay'      => __( 'Pay with PayPal', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1773,6 +1834,7 @@ return array(
 					'black'  => __( 'Black', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1794,6 +1856,7 @@ return array(
 					'rect' => __( 'Rectangle', 'woocommerce-paypal-payments' ),
 				),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),
@@ -1806,6 +1869,7 @@ return array(
 				'desc_tip'     => true,
 				'description'  => __( 'Add a value from 25 to 55.', 'woocommerce-paypal-payments' ),
 				'screens'      => array(
+					State::STATE_START,
 					State::STATE_ONBOARDED,
 				),
 				'requirements' => array(),

From 625004e2c6ea169ec233ebad194d39415bdec4b7 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Mon, 7 Feb 2022 09:05:12 +0200
Subject: [PATCH 15/21] Validate manual input

---
 .../ppcp-onboarding/assets/css/onboarding.css |  5 ++
 .../ppcp-onboarding/assets/js/onboarding.js   | 81 +++++++++++++------
 .../src/Assets/OnboardingAssets.php           |  3 +
 modules/ppcp-wc-gateway/services.php          | 11 +++
 4 files changed, 74 insertions(+), 26 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/css/onboarding.css b/modules/ppcp-onboarding/assets/css/onboarding.css
index a09a150d9..98cc7608f 100644
--- a/modules/ppcp-onboarding/assets/css/onboarding.css
+++ b/modules/ppcp-onboarding/assets/css/onboarding.css
@@ -18,6 +18,11 @@
 	display: table-row;
 }
 
+label.error {
+	color: red;
+	font-weight: bold;
+}
+
 #field-toggle_manual_input button {
 	color: #0073aa;
 	transition-property: border, background, color;
diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index 950c50483..eb76bba82 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -104,6 +104,19 @@ function ppcp_onboarding_productionCallback(...args) {
 	return ppcp_onboarding.loginSeller('production', ...args);
 }
 
+const productionCredentialElementsSelectors = [
+    '#field-merchant_email_production',
+    '#field-merchant_id_production',
+    '#field-client_id_production',
+    '#field-client_secret_production',
+];
+const sandboxCredentialElementsSelectors = [
+    '#field-merchant_email_sandbox',
+    '#field-merchant_id_sandbox',
+    '#field-client_id_sandbox',
+    '#field-client_secret_sandbox',
+];
+
 const updateOptionsState = () => {
     const cardsChk = document.querySelector('#ppcp-onboarding-accept-cards');
     if (!cardsChk) {
@@ -136,18 +149,8 @@ const updateOptionsState = () => {
 };
 
 const updateManualInputControls = (shown, isSandbox, isAnyEnvOnboarded) => {
-    const productionElementsSelectors = [
-        '#field-merchant_email_production',
-        '#field-merchant_id_production',
-        '#field-client_id_production',
-        '#field-client_secret_production',
-    ];
-    const sandboxElementsSelectors = [
-        '#field-merchant_email_sandbox',
-        '#field-merchant_id_sandbox',
-        '#field-client_id_sandbox',
-        '#field-client_secret_sandbox',
-    ];
+    const productionElementsSelectors = productionCredentialElementsSelectors;
+    const sandboxElementsSelectors = sandboxCredentialElementsSelectors;
     const otherElementsSelectors = [
         '.woocommerce-save-button',
     ];
@@ -190,25 +193,20 @@ const updateEnvironmentControls = (isSandbox) => {
     );
 };
 
+let isDisconnecting = false;
+
 const disconnect = (event) => {
 	event.preventDefault();
-	const fields = event.target.classList.contains('production') ? [
-		'#field-merchant_email_production input',
-		'#field-merchant_id_production input',
-		'#field-client_id_production input',
-		'#field-client_secret_production input',
-	] : [
-		'#field-merchant_email_sandbox input',
-		'#field-merchant_id_sandbox input',
-		'#field-client_id_sandbox input',
-		'#field-client_secret_sandbox input',
-	];
+	const fields = event.target.classList.contains('production') ? productionCredentialElementsSelectors : sandboxCredentialElementsSelectors;
 
-	document.querySelectorAll(fields.join()).forEach(
+	document.querySelectorAll(fields.map(f => f + ' input').join()).forEach(
 		(element) => {
 			element.value = '';
 		}
 	);
+
+    isDisconnecting = true;
+
 	document.querySelector('.woocommerce-save-button').click();
 };
 
@@ -226,6 +224,20 @@ const preventDirtyCheckboxPropagation = event => {
 };
 
 (() => {
+    const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
+
+    const validate = () => {
+        const selectors = sandboxSwitchElement.checked ? sandboxCredentialElementsSelectors : productionCredentialElementsSelectors;
+        const values = selectors.map(s => document.querySelector(s + ' input')).map(el => el.value);
+
+        const errors = [];
+        if (values.some(v => !v)) {
+            errors.push(PayPalCommerceGatewayOnboarding.error_messages.no_credentials);
+        }
+
+        return errors;
+    };
+
     const isAnyEnvOnboarded = PayPalCommerceGatewayOnboarding.sandbox_state === ppcp_onboarding.STATE_ONBOARDED ||
         PayPalCommerceGatewayOnboarding.production_state === ppcp_onboarding.STATE_ONBOARDED;
 
@@ -259,8 +271,6 @@ const preventDirtyCheckboxPropagation = event => {
 
     markCurrentOnboardingState(PayPalCommerceGatewayOnboarding.current_state === ppcp_onboarding.STATE_ONBOARDED);
 
-    const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
-
     const manualInputToggleButton = document.querySelector('#field-toggle_manual_input button');
     let isManualInputShown = isAnyEnvOnboarded;
 
@@ -300,6 +310,25 @@ const preventDirtyCheckboxPropagation = event => {
 
     updateEnvironmentControls(sandboxSwitchElement.checked);
 
+    document.querySelector('#mainform').addEventListener('submit', e => {
+        if (isDisconnecting) {
+            return;
+        }
+
+        const errors = validate();
+        if (errors.length) {
+            e.preventDefault();
+
+            const errorLabel = document.querySelector('#ppcp-form-errors-label');
+            errorLabel.parentElement.parentElement.classList.remove('hide');
+
+            errorLabel.innerHTML = errors.join('<br/>');
+
+            errorLabel.scrollIntoView();
+            window.scrollBy(0, -120); // WP + WC floating header
+        }
+    });
+
 	// Onboarding buttons.
 	ppcp_onboarding.init();
 })();
diff --git a/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php b/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
index 9c883e960..fbacf3cc1 100644
--- a/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
+++ b/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
@@ -109,6 +109,9 @@ class OnboardingAssets {
 			'sandbox_state'    => State::get_state_name( $this->state->sandbox_state() ),
 			'production_state' => State::get_state_name( $this->state->production_state() ),
 			'current_state'    => State::get_state_name( $this->state->current_state() ),
+			'error_messages'   => array(
+				'no_credentials' => __( 'Enter the credentials.', 'woocommerce-paypal-payments' ),
+			),
 		);
 	}
 
diff --git a/modules/ppcp-wc-gateway/services.php b/modules/ppcp-wc-gateway/services.php
index c006f8b0c..395f98bca 100644
--- a/modules/ppcp-wc-gateway/services.php
+++ b/modules/ppcp-wc-gateway/services.php
@@ -429,6 +429,17 @@ return array(
 				'requirements' => array(),
 				'gateway'      => 'paypal',
 			),
+			'error_label'                        => array(
+				'type'         => 'ppcp-text',
+				'text'         => '<label class="error" id="ppcp-form-errors-label"></label>',
+				'classes'      => array( 'hide', 'ppcp-always-shown-element' ),
+				'screens'      => array(
+					State::STATE_START,
+					State::STATE_ONBOARDED,
+				),
+				'requirements' => array(),
+				'gateway'      => 'paypal',
+			),
 			'sandbox_on'                         => array(
 				'title'        => __( 'Sandbox', 'woocommerce-paypal-payments' ),
 				'classes'      => array( 'ppcp-onboarding-element', 'ppcp-always-shown-element' ),

From 8c465b20a9f953e0dd6ec4139416876183f50d1c Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Mon, 7 Feb 2022 09:06:32 +0200
Subject: [PATCH 16/21] Fix ui

---
 modules/ppcp-onboarding/assets/js/onboarding.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index eb76bba82..31cb7ab84 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -272,7 +272,7 @@ const preventDirtyCheckboxPropagation = event => {
     markCurrentOnboardingState(PayPalCommerceGatewayOnboarding.current_state === ppcp_onboarding.STATE_ONBOARDED);
 
     const manualInputToggleButton = document.querySelector('#field-toggle_manual_input button');
-    let isManualInputShown = isAnyEnvOnboarded;
+    let isManualInputShown = PayPalCommerceGatewayOnboarding.current_state === ppcp_onboarding.STATE_ONBOARDED;
 
     manualInputToggleButton.addEventListener(
             'click',

From 8bb84ee3808ab47815f641a5143d1f2c2744a593 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Mon, 7 Feb 2022 09:13:32 +0200
Subject: [PATCH 17/21] Move JS from global scope

---
 .../ppcp-onboarding/assets/js/onboarding.js   | 241 +++++++++---------
 1 file changed, 119 insertions(+), 122 deletions(-)

diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index 31cb7ab84..9a1894c0a 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -1,4 +1,3 @@
-// Onboarding.
 const ppcp_onboarding = {
 	BUTTON_SELECTOR: '[data-paypal-onboard-button]',
 	PAYPAL_JS_ID: 'ppcp-onboarding-paypal-js',
@@ -92,8 +91,6 @@ const ppcp_onboarding = {
 			}
 		);
 	},
-
-
 };
 
 function ppcp_onboarding_sandboxCallback(...args) {
@@ -104,126 +101,126 @@ function ppcp_onboarding_productionCallback(...args) {
 	return ppcp_onboarding.loginSeller('production', ...args);
 }
 
-const productionCredentialElementsSelectors = [
-    '#field-merchant_email_production',
-    '#field-merchant_id_production',
-    '#field-client_id_production',
-    '#field-client_secret_production',
-];
-const sandboxCredentialElementsSelectors = [
-    '#field-merchant_email_sandbox',
-    '#field-merchant_id_sandbox',
-    '#field-client_id_sandbox',
-    '#field-client_secret_sandbox',
-];
-
-const updateOptionsState = () => {
-    const cardsChk = document.querySelector('#ppcp-onboarding-accept-cards');
-    if (!cardsChk) {
-        return;
-    }
-
-    document.querySelectorAll('#ppcp-onboarding-dcc-options input').forEach(input => {
-        input.disabled = !cardsChk.checked;
-    });
-
-    const basicRb = document.querySelector('#ppcp-onboarding-dcc-basic');
-
-    const isExpress = !cardsChk.checked || basicRb.checked;
-
-    const expressButtonSelectors = [
-        '#field-ppcp_onboarding_production_express',
-        '#field-ppcp_onboarding_sandbox_express',
-    ];
-    const ppcpButtonSelectors = [
-        '#field-ppcp_onboarding_production_ppcp',
-        '#field-ppcp_onboarding_sandbox_ppcp',
-    ];
-
-    document.querySelectorAll(expressButtonSelectors.join()).forEach(
-        element => element.style.display = isExpress ? '' : 'none'
-    );
-    document.querySelectorAll(ppcpButtonSelectors.join()).forEach(
-        element => element.style.display = !isExpress ? '' : 'none'
-    );
-};
-
-const updateManualInputControls = (shown, isSandbox, isAnyEnvOnboarded) => {
-    const productionElementsSelectors = productionCredentialElementsSelectors;
-    const sandboxElementsSelectors = sandboxCredentialElementsSelectors;
-    const otherElementsSelectors = [
-        '.woocommerce-save-button',
-    ];
-    if (!isAnyEnvOnboarded) {
-        otherElementsSelectors.push('#field-sandbox_on');
-    }
-
-    document.querySelectorAll(productionElementsSelectors.join()).forEach(
-        element => {
-            element.classList.remove('hide', 'show');
-            element.classList.add((shown && !isSandbox) ? 'show' : 'hide');
-        }
-    );
-    document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
-        element => {
-            element.classList.remove('hide', 'show');
-            element.classList.add((shown && isSandbox) ? 'show' : 'hide');
-        }
-    );
-    document.querySelectorAll(otherElementsSelectors.join()).forEach(
-        element => element.style.display = shown ? '' : 'none'
-    );
-};
-
-const updateEnvironmentControls = (isSandbox) => {
-    const productionElementsSelectors = [
-        '#field-ppcp_disconnect_production',
-        '#field-credentials_production_heading',
-    ];
-    const sandboxElementsSelectors = [
-        '#field-ppcp_disconnect_sandbox',
-        '#field-credentials_sandbox_heading',
-    ];
-
-    document.querySelectorAll(productionElementsSelectors.join()).forEach(
-        element => element.style.display = !isSandbox ? '' : 'none'
-    );
-    document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
-        element => element.style.display = isSandbox ? '' : 'none'
-    );
-};
-
-let isDisconnecting = false;
-
-const disconnect = (event) => {
-	event.preventDefault();
-	const fields = event.target.classList.contains('production') ? productionCredentialElementsSelectors : sandboxCredentialElementsSelectors;
-
-	document.querySelectorAll(fields.map(f => f + ' input').join()).forEach(
-		(element) => {
-			element.value = '';
-		}
-	);
-
-    isDisconnecting = true;
-
-	document.querySelector('.woocommerce-save-button').click();
-};
-
-// Prevent the message about unsaved checkbox/radiobutton when reloading the page.
-// (WC listens for changes on all inputs and sets dirty flag until form submission)
-const preventDirtyCheckboxPropagation = event => {
-    event.preventDefault();
-    event.stopPropagation();
-
-    const value = event.target.checked;
-    setTimeout( () => {
-            event.target.checked = value;
-        }, 1
-    );
-};
-
 (() => {
+    const productionCredentialElementsSelectors = [
+        '#field-merchant_email_production',
+        '#field-merchant_id_production',
+        '#field-client_id_production',
+        '#field-client_secret_production',
+    ];
+    const sandboxCredentialElementsSelectors = [
+        '#field-merchant_email_sandbox',
+        '#field-merchant_id_sandbox',
+        '#field-client_id_sandbox',
+        '#field-client_secret_sandbox',
+    ];
+
+    const updateOptionsState = () => {
+        const cardsChk = document.querySelector('#ppcp-onboarding-accept-cards');
+        if (!cardsChk) {
+            return;
+        }
+
+        document.querySelectorAll('#ppcp-onboarding-dcc-options input').forEach(input => {
+            input.disabled = !cardsChk.checked;
+        });
+
+        const basicRb = document.querySelector('#ppcp-onboarding-dcc-basic');
+
+        const isExpress = !cardsChk.checked || basicRb.checked;
+
+        const expressButtonSelectors = [
+            '#field-ppcp_onboarding_production_express',
+            '#field-ppcp_onboarding_sandbox_express',
+        ];
+        const ppcpButtonSelectors = [
+            '#field-ppcp_onboarding_production_ppcp',
+            '#field-ppcp_onboarding_sandbox_ppcp',
+        ];
+
+        document.querySelectorAll(expressButtonSelectors.join()).forEach(
+            element => element.style.display = isExpress ? '' : 'none'
+        );
+        document.querySelectorAll(ppcpButtonSelectors.join()).forEach(
+            element => element.style.display = !isExpress ? '' : 'none'
+        );
+    };
+
+    const updateManualInputControls = (shown, isSandbox, isAnyEnvOnboarded) => {
+        const productionElementsSelectors = productionCredentialElementsSelectors;
+        const sandboxElementsSelectors = sandboxCredentialElementsSelectors;
+        const otherElementsSelectors = [
+            '.woocommerce-save-button',
+        ];
+        if (!isAnyEnvOnboarded) {
+            otherElementsSelectors.push('#field-sandbox_on');
+        }
+
+        document.querySelectorAll(productionElementsSelectors.join()).forEach(
+            element => {
+                element.classList.remove('hide', 'show');
+                element.classList.add((shown && !isSandbox) ? 'show' : 'hide');
+            }
+        );
+        document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
+            element => {
+                element.classList.remove('hide', 'show');
+                element.classList.add((shown && isSandbox) ? 'show' : 'hide');
+            }
+        );
+        document.querySelectorAll(otherElementsSelectors.join()).forEach(
+            element => element.style.display = shown ? '' : 'none'
+        );
+    };
+
+    const updateEnvironmentControls = (isSandbox) => {
+        const productionElementsSelectors = [
+            '#field-ppcp_disconnect_production',
+            '#field-credentials_production_heading',
+        ];
+        const sandboxElementsSelectors = [
+            '#field-ppcp_disconnect_sandbox',
+            '#field-credentials_sandbox_heading',
+        ];
+
+        document.querySelectorAll(productionElementsSelectors.join()).forEach(
+            element => element.style.display = !isSandbox ? '' : 'none'
+        );
+        document.querySelectorAll(sandboxElementsSelectors.join()).forEach(
+            element => element.style.display = isSandbox ? '' : 'none'
+        );
+    };
+
+    let isDisconnecting = false;
+
+    const disconnect = (event) => {
+        event.preventDefault();
+        const fields = event.target.classList.contains('production') ? productionCredentialElementsSelectors : sandboxCredentialElementsSelectors;
+
+        document.querySelectorAll(fields.map(f => f + ' input').join()).forEach(
+            (element) => {
+                element.value = '';
+            }
+        );
+
+        isDisconnecting = true;
+
+        document.querySelector('.woocommerce-save-button').click();
+    };
+
+    // Prevent the message about unsaved checkbox/radiobutton when reloading the page.
+    // (WC listens for changes on all inputs and sets dirty flag until form submission)
+    const preventDirtyCheckboxPropagation = event => {
+        event.preventDefault();
+        event.stopPropagation();
+
+        const value = event.target.checked;
+        setTimeout( () => {
+                event.target.checked = value;
+            }, 1
+        );
+    };
+
     const sandboxSwitchElement = document.querySelector('#ppcp-sandbox_on');
 
     const validate = () => {

From cb2adfd044619689b1f04fa8731e7fc1cffcc55a Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 8 Feb 2022 10:12:38 +0200
Subject: [PATCH 18/21] Remove unused

---
 modules/ppcp-onboarding/services.php  |  3 +--
 modules/ppcp-onboarding/src/State.php | 12 +-----------
 2 files changed, 2 insertions(+), 13 deletions(-)

diff --git a/modules/ppcp-onboarding/services.php b/modules/ppcp-onboarding/services.php
index cfafbd55f..e12cbb0cf 100644
--- a/modules/ppcp-onboarding/services.php
+++ b/modules/ppcp-onboarding/services.php
@@ -118,9 +118,8 @@ return array(
 		);
 	},
 	'onboarding.state'                          => function( ContainerInterface $container ) : State {
-		$environment = $container->get( 'onboarding.environment' );
 		$settings    = $container->get( 'wcgateway.settings' );
-		return new State( $environment, $settings );
+		return new State( $settings );
 	},
 	'onboarding.environment'                    => function( ContainerInterface $container ) : Environment {
 		$settings = $container->get( 'wcgateway.settings' );
diff --git a/modules/ppcp-onboarding/src/State.php b/modules/ppcp-onboarding/src/State.php
index 9967ac406..59b41647b 100644
--- a/modules/ppcp-onboarding/src/State.php
+++ b/modules/ppcp-onboarding/src/State.php
@@ -19,13 +19,6 @@ class State {
 	const STATE_START     = 0;
 	const STATE_ONBOARDED = 8;
 
-	/**
-	 * The Environment.
-	 *
-	 * @var Environment
-	 */
-	private $environment;
-
 	/**
 	 * The Settings.
 	 *
@@ -36,16 +29,13 @@ class State {
 	/**
 	 * State constructor.
 	 *
-	 * @param Environment        $environment The Environment.
 	 * @param ContainerInterface $settings The Settings.
 	 */
 	public function __construct(
-		Environment $environment,
 		ContainerInterface $settings
 	) {
 
-		$this->environment = $environment;
-		$this->settings    = $settings;
+		$this->settings = $settings;
 	}
 
 	/**

From 44cb17107ca310d29fe421aa3735c45a8fa8c913 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 8 Feb 2022 10:25:01 +0200
Subject: [PATCH 19/21] Fix sandbox checkbox

Sometimes the state of UI may get restored after page reload and will not match the server settings
---
 modules/ppcp-onboarding/assets/js/onboarding.js      |  5 +++++
 modules/ppcp-onboarding/services.php                 |  1 +
 .../ppcp-onboarding/src/Assets/OnboardingAssets.php  | 12 ++++++++++++
 3 files changed, 18 insertions(+)

diff --git a/modules/ppcp-onboarding/assets/js/onboarding.js b/modules/ppcp-onboarding/assets/js/onboarding.js
index 9a1894c0a..4db2ad4ec 100644
--- a/modules/ppcp-onboarding/assets/js/onboarding.js
+++ b/modules/ppcp-onboarding/assets/js/onboarding.js
@@ -257,6 +257,11 @@ function ppcp_onboarding_productionCallback(...args) {
         }
     );
 
+    const isSandboxInBackend = PayPalCommerceGatewayOnboarding.current_env === 'sandbox';
+    if (sandboxSwitchElement.checked !== isSandboxInBackend) {
+        sandboxSwitchElement.checked = isSandboxInBackend;
+    }
+
     updateOptionsState();
 
     const settingsContainer = document.querySelector('#mainform .form-table');
diff --git a/modules/ppcp-onboarding/services.php b/modules/ppcp-onboarding/services.php
index e12cbb0cf..81e25ad31 100644
--- a/modules/ppcp-onboarding/services.php
+++ b/modules/ppcp-onboarding/services.php
@@ -132,6 +132,7 @@ return array(
 		return new OnboardingAssets(
 			$container->get( 'onboarding.url' ),
 			$state,
+			$container->get( 'onboarding.environment' ),
 			$login_seller_endpoint
 		);
 	},
diff --git a/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php b/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
index fbacf3cc1..b05bd3023 100644
--- a/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
+++ b/modules/ppcp-onboarding/src/Assets/OnboardingAssets.php
@@ -10,6 +10,7 @@ declare(strict_types=1);
 namespace WooCommerce\PayPalCommerce\Onboarding\Assets;
 
 use WooCommerce\PayPalCommerce\Onboarding\Endpoint\LoginSellerEndpoint;
+use WooCommerce\PayPalCommerce\Onboarding\Environment;
 use WooCommerce\PayPalCommerce\Onboarding\State;
 
 /**
@@ -31,6 +32,13 @@ class OnboardingAssets {
 	 */
 	private $state;
 
+	/**
+	 * The Environment.
+	 *
+	 * @var Environment
+	 */
+	private $environment;
+
 	/**
 	 * The LoginSeller Endpoint.
 	 *
@@ -43,16 +51,19 @@ class OnboardingAssets {
 	 *
 	 * @param string              $module_url                         The URL to the module.
 	 * @param State               $state                               The State object.
+	 * @param Environment         $environment  The Environment.
 	 * @param LoginSellerEndpoint $login_seller_endpoint The LoginSeller endpoint.
 	 */
 	public function __construct(
 		string $module_url,
 		State $state,
+		Environment $environment,
 		LoginSellerEndpoint $login_seller_endpoint
 	) {
 
 		$this->module_url            = untrailingslashit( $module_url );
 		$this->state                 = $state;
+		$this->environment           = $environment;
 		$this->login_seller_endpoint = $login_seller_endpoint;
 	}
 
@@ -109,6 +120,7 @@ class OnboardingAssets {
 			'sandbox_state'    => State::get_state_name( $this->state->sandbox_state() ),
 			'production_state' => State::get_state_name( $this->state->production_state() ),
 			'current_state'    => State::get_state_name( $this->state->current_state() ),
+			'current_env'      => $this->environment->current_environment(),
 			'error_messages'   => array(
 				'no_credentials' => __( 'Enter the credentials.', 'woocommerce-paypal-payments' ),
 			),

From d2a1eff9a8b70a621cf4a0b474780930515f7956 Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 8 Feb 2022 10:30:15 +0200
Subject: [PATCH 20/21] Update phpdoc

---
 modules/ppcp-onboarding/src/State.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/ppcp-onboarding/src/State.php b/modules/ppcp-onboarding/src/State.php
index 59b41647b..0a07e7dd6 100644
--- a/modules/ppcp-onboarding/src/State.php
+++ b/modules/ppcp-onboarding/src/State.php
@@ -123,7 +123,7 @@ class State {
 	}
 
 	/**
-	 * Returns the state based on progressive and onboarded values being looked up in the settings.
+	 * Returns the state based on onboarding settings values.
 	 *
 	 * @param array $onboarded_keys The keys which need to be present to be in onboarded state.
 	 *

From 7de028276b5fdfbe476f8741469b8b32f269cc5b Mon Sep 17 00:00:00 2001
From: Alex P <alex.pantec@gmail.com>
Date: Tue, 8 Feb 2022 10:31:24 +0200
Subject: [PATCH 21/21] Remove unused import

---
 modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php | 1 -
 1 file changed, 1 deletion(-)

diff --git a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
index 61e3f8313..3deef7f48 100644
--- a/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
+++ b/modules/ppcp-wc-gateway/src/Settings/SettingsRenderer.php
@@ -12,7 +12,6 @@ namespace WooCommerce\PayPalCommerce\WcGateway\Settings;
 use WooCommerce\PayPalCommerce\AdminNotices\Entity\Message;
 use WooCommerce\PayPalCommerce\ApiClient\Helper\DccApplies;
 use WooCommerce\PayPalCommerce\Button\Helper\MessagesApply;
-use WooCommerce\PayPalCommerce\Onboarding\Environment;
 use WooCommerce\PayPalCommerce\Onboarding\State;
 use WooCommerce\PayPalCommerce\WcGateway\Gateway\CreditCardGateway;
 use Psr\Container\ContainerInterface;