Removing expandable menu for payment methods when UPE is disabled (#2869

) * Removing expandable menu for payment methods when UPE is disabled * Including specific unit tests for the expandable menu (UPE) * Readme and changelog updates --------- Co-authored-by: Wesley Rosa <[email protected]> Co-authored-by: James Allan <[email protected]>
woocommerce · Feb 1, 2024 · 72a40ed · 72a40ed
1 parent be061a2
commit 72a40ed
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 26 deletions.
diff --git a/changelog.txt b/changelog.txt
@@ -1,6 +1,7 @@
 *** Changelog ***
 
 = 8.0.0 - 2024-xx-xx =
+* Fix - Hiding the expandable menu for UPE entirely when the feature is disabled.
 * Fix - Critical error when deactivating the extension after deactivating WooCommerce.
 * Fix - Add missing fee and payout information to the order details page in admin.
 * Fix - Hiding "Early Access" label and "Refresh payment methods" button when UPE is disabled.

diff --git a/client/settings/general-settings-section/__tests__/general-settings-section.test.js b/client/settings/general-settings-section/__tests__/general-settings-section.test.js
@@ -606,15 +606,15 @@ describe( 'GeneralSettingsSection', () => {
 		).not.toBeInTheDocument();
 	} );
 
-	it( 'menu should not contain "refresh payment method options" if UPE is disabled', () => {
+	it( 'should not render the expandable menu if UPE is disabled', () => {
 		render(
 			<UpeToggleContext.Provider value={ { isUpeEnabled: false } }>
 				<GeneralSettingsSection />
 			</UpeToggleContext.Provider>
 		);
 
 		expect(
-			screen.queryByText( /Refresh payment methods/ )
+			screen.queryByTestId( 'upe-expandable-menu' )
 		).not.toBeInTheDocument();
 	} );
 } );
diff --git a/client/settings/general-settings-section/section-heading.js b/client/settings/general-settings-section/section-heading.js
@@ -79,22 +79,6 @@ const SectionHeading = ( { isChangingDisplayOrder, onChangeDisplayOrder } ) => {
 		onChangeDisplayOrder( false, orderedPaymentMethodIds );
 	};
 
-	const menuControls = [
-		{
-			title: __( 'Disable', 'woocommerce-gateway-stripe' ),
-			onClick: toggleConfirmationModal,
-		},
-	];
-	if ( isUpeEnabled ) {
-		menuControls.unshift( {
-			title: __(
-				'Refresh payment methods',
-				'woocommerce-gateway-stripe'
-			),
-			onClick: refreshAccount,
-		} );
-	}
-
 	return (
 		<StyledHeader>
 			<Title>
@@ -126,14 +110,32 @@ const SectionHeading = ( { isChangingDisplayOrder, onChangeDisplayOrder } ) => {
 								) }
 							</Button>
 						) }
-						<DropdownMenu
-							icon={ moreVertical }
-							label={ __(
-								'Payment methods menu',
-								'woocommerce-gateway-stripe'
-							) }
-							controls={ menuControls }
-						/>
+						{ isUpeEnabled && (
+							<DropdownMenu
+								data-testid="upe-expandable-menu"
+								icon={ moreVertical }
+								label={ __(
+									'Payment methods menu',
+									'woocommerce-gateway-stripe'
+								) }
+								controls={ [
+									{
+										title: __(
+											'Disable',
+											'woocommerce-gateway-stripe'
+										),
+										onClick: toggleConfirmationModal,
+									},
+									{
+										title: __(
+											'Refresh payment methods',
+											'woocommerce-gateway-stripe'
+										),
+										onClick: refreshAccount,
+									},
+								] }
+							/>
+						) }
 					</>
 				) : (
 					<>

diff --git a/readme.txt b/readme.txt
@@ -129,6 +129,7 @@ If you get stuck, you can ask for help in the Plugin Forum.
 == Changelog ==
 
 = 8.0.0 - 2024-xx-xx =
+* Fix - Hiding the expandable menu for UPE entirely when the feature is disabled.
 * Fix - Critical error when deactivating the extension after deactivating WooCommerce.
 * Fix - Add missing fee and payout information to the order details page in admin.
 * Fix - Hiding "Early Access" label and "Refresh payment methods" button when UPE is disabled.