Merge branch 'develop' into add/prb-load-tracks

changelog/add-5605-cancel-authorizations-if-order-is-cancelled

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Confirmation when cancelling order with pending authorization. Automatic order changes submission if confirmed.

changelog/dev-fix-e2e-tests-on-wc-7-7

@@ -0,0 +1,5 @@
+Significance: patch
+Type: dev
+Comment: Fix e2e tests on WC 7.7.
+
+

changelog/e2e-7382-spec-merchant-multi-currency-setup

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+E2E test - Merchant facing: Multi-currency setup

changelog/fix-6782-support-phone-dev-mode

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Allow test phone number as Support Phone in Dev mode

changelog/fix-6806-authorizations-level-3-data-error-while-trying-to-capture-partial-amount

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fixed a Level 3 error occurring during the capture of an authorization for amounts lower than the initial authorization amount.

changelog/fix-7588-woopay-subscription-variation

@@ -0,0 +1,5 @@
+Significance: patch
+Type: fix
+Comment: Edge case adding subscription_variation to WooPay button supported types
+
+

changelog/fix-7920-correct-account-overview-account-type-nullable

@@ -0,0 +1,5 @@
+Significance: patch
+Type: dev
+Comment: No changelog entry required – minor TS interface fix with no user-facing changes
+
+

changelog/fix-apple-pay-including-tax

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Fixed Apple Pay Double Tax Calculation Issue

changelog/fix-jstest-regression-pr-7851

@@ -0,0 +1,5 @@
+Significance: patch
+Type: dev
+Comment: Fix JS regression test in PR 7851
+
+

client/components/account-balances/index.tsx

@@ -115,7 +115,7 @@ const AccountBalances: React.FC = () => {
 			currencyCode: overview.currency,
 			availableFunds: overview.available?.amount ?? 0,
 			pendingFunds: overview.pending?.amount ?? 0,
-			delayDays: account.deposits_schedule.delay_days,
+			delayDays: account?.deposits_schedule.delay_days ?? 0,
 			instantBalance: overview.instant,
 		} )
 	);

client/order/cancel-authorization-confirm-modal/index.tsx

@@ -0,0 +1,134 @@
+/** @format */
+/**
+ * External dependencies
+ */
+import * as React from 'react';
+import { __ } from '@wordpress/i18n';
+import { Button } from '@wordpress/components';
+import interpolateComponents from '@automattic/interpolate-components';
+import { useState } from '@wordpress/element';
+/**
+ * Internal dependencies
+ */
+import ConfirmationModal from 'wcpay/components/confirmation-modal';
+
+interface CancelAuthorizationConfirmationModalProps {
+	originalOrderStatus: string;
+}
+
+const CancelAuthorizationConfirmationModal: React.FunctionComponent< CancelAuthorizationConfirmationModalProps > = ( {
+	originalOrderStatus,
+} ) => {
+	const [
+		isCancelAuthorizationConfirmationModalOpen,
+		setIsCancelAuthorizationConfirmationModalOpen,
+	] = useState( true );
+
+	const closeModal = (): void => {
+		setIsCancelAuthorizationConfirmationModalOpen( false );
+	};
+
+	const handleCancelOrder = (): void => {
+		const orderEditForm: HTMLFormElement | null =
+			document.querySelector( '#order_status' )?.closest( 'form' ) ||
+			null;
+		if ( null !== orderEditForm ) {
+			orderEditForm.submit();
+		}
+	};
+
+	const doNotCancel = (): void => {
+		const orderStatusElement: HTMLInputElement | null = document.querySelector(
+			'#order_status'
+		);
+		if ( null !== orderStatusElement ) {
+			orderStatusElement.value = originalOrderStatus;
+			orderStatusElement.dispatchEvent( new Event( 'change' ) );
+		}
+		closeModal();
+	};
+
+	const cancelOrder = (): void => {
+		handleCancelOrder();
+		closeModal();
+	};
+
+	const buttonContent = (
+		<>
+			<Button isSecondary onClick={ doNotCancel }>
+				{ __( 'Do Nothing', 'woocommerce-payments' ) }
+			</Button>
+			<Button isPrimary onClick={ cancelOrder }>
+				{ __(
+					'Cancel order and authorization',
+					'woocommerce-payments'
+				) }
+			</Button>
+		</>
+	);
+
+	const confirmationMessage = interpolateComponents( {
+		mixedString: __(
+			'This order has been {{authorizedNotCaptured/}} yet. Changing the status to ' +
+				'Cancelled will also {{cancelAuthorization/}}. Do you want to continue?',
+			'woocommerce-payments'
+		),
+		components: {
+			authorizedNotCaptured: (
+				<a
+					target="_blank"
+					href="https://woo.com/document/woopayments/settings-guide/authorize-and-capture/#authorize-vs-capture"
+					rel="noopener noreferrer"
+				>
+					{ __(
+						'authorized but not captured',
+						'woocommerce-payments'
+					) }
+				</a>
+			),
+			cancelAuthorization: (
+				<a
+					target="_blank"
+					href="https://woo.com/document/woopayments/settings-guide/authorize-and-capture/#cancelling-authorizations"
+					rel="noopener noreferrer"
+				>
+					{ __( 'cancel the authorization', 'woocommerce-payments' ) }
+				</a>
+			),
+			doNothingBold: (
+				<b>{ __( 'Do Nothing', 'woocommerce-payments' ) }</b>
+			),
+			cancelOrderBold: (
+				<b>
+					{ __(
+						'Cancel order and authorization',
+						'woocommerce-payments'
+					) }
+				</b>
+			),
+		},
+	} );
+
+	return (
+		<>
+			{ isCancelAuthorizationConfirmationModalOpen && (
+				<ConfirmationModal
+					title={ __(
+						'Cancel authorization',
+						'woocommerce-payments'
+					) }
+					isDismissible={ false }
+					className="cancel-authorization-confirmation-modal"
+					actions={ buttonContent }
+					onRequestClose={ () => {
+						return false;
+					} }
+				>
+					<p>{ confirmationMessage }</p>
+				</ConfirmationModal>
+			) }
+		</>
+	);
+};
+
+export default CancelAuthorizationConfirmationModal;

client/order/index.js

@@ -12,6 +12,7 @@ import { getConfig } from 'utils/order';
 import { isAwaitingResponse, isUnderReview } from 'wcpay/disputes/utils';
 import RefundConfirmationModal from './refund-confirm-modal';
 import CancelConfirmationModal from './cancel-confirm-modal';
+import CancelAuthorizationConfirmationModal from './cancel-authorization-confirm-modal';
 import DisputedOrderNoticeHandler from 'wcpay/components/disputed-order-notice';
 
 function disableWooOrderRefundButton( disputeStatus ) {
@@ -95,6 +96,7 @@ jQuery( function ( $ ) {
 
 		const canRefund = getConfig( 'canRefund' );
 		const refundAmount = getConfig( 'refundAmount' );
+		const hasOpenAuthorization = getConfig( 'hasOpenAuthorization' );
 		if (
 			this.value === 'wc-refunded' &&
 			originalStatus !== 'wc-refunded'
@@ -108,14 +110,27 @@ jQuery( function ( $ ) {
 			this.value === 'wc-cancelled' &&
 			originalStatus !== 'wc-cancelled'
 		) {
-			if ( ! canRefund || refundAmount <= 0 ) {
+			// If order has an uncaptured authorization, confirm
+			// that merchant indeed wants to cancel both the order
+			// and the authorization.
+			if ( hasOpenAuthorization ) {
+				renderModal(
+					<CancelAuthorizationConfirmationModal
+						originalOrderStatus={ originalStatus }
+					/>
+				);
 				return;
 			}
-			renderModal(
-				<CancelConfirmationModal
-					originalOrderStatus={ originalStatus }
-				/>
-			);
+			// If it is possible to refund an order, double check that
+			// merchants indeed wants to cancel, or if they just want to
+			// refund.
+			if ( canRefund && refundAmount > 0 ) {
+				renderModal(
+					<CancelConfirmationModal
+						originalOrderStatus={ originalStatus }
+					/>
+				);
+			}
 		}
 	} );
 

client/overview/hooks.ts

@@ -46,7 +46,7 @@ export const useSelectedCurrency = (): UseSelectedCurrencyResult => {
 };
 
 type SelectedCurrencyOverview = {
-	account?: AccountOverview.Account;
+	account?: AccountOverview.Account | null;
 	overview?: AccountOverview.Overview;
 	isLoading: boolean;
 };

client/payment-methods-map.tsx

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import React from 'react';
 import { __ } from '@wordpress/i18n';
 
 /**

client/payment-methods/capability-request/index.tsx

@@ -2,7 +2,6 @@
  * External dependencies
  */
 import React from 'react';
-import { __ } from '@wordpress/i18n';
 
 import CapabilityRequestList from './capability-request-map';
 import CapabilityNotice from './capability-request-notice';

client/settings/support-phone-input/index.js

@@ -8,7 +8,11 @@ import { useState, useEffect, useRef } from 'react';
 /**
  * Internal dependencies
  */
-import { useAccountBusinessSupportPhone, useGetSavingError } from 'wcpay/data';
+import {
+	useAccountBusinessSupportPhone,
+	useGetSavingError,
+	useDevMode,
+} from 'wcpay/data';
 import PhoneNumberInput from 'wcpay/settings/phone-input';
 
 const SupportPhoneInput = ( { setInputVallid } ) => {
@@ -19,9 +23,14 @@ const SupportPhoneInput = ( { setInputVallid } ) => {
 
 	const currentPhone = useRef( supportPhone ).current;
 	const isEmptyPhoneValid = supportPhone === '' && currentPhone === '';
+	const isDevModeEnabled = useDevMode();
+	const isTestPhoneValid =
+		isDevModeEnabled &&
+		( supportPhone === '+1000-000-0000' ||
+			supportPhone === '+10000000000' );
 
 	const [ isPhoneValid, setPhoneValidity ] = useState( true );
-	if ( ! isPhoneValid && ! isEmptyPhoneValid ) {
+	if ( ! isTestPhoneValid && ! isPhoneValid && ! isEmptyPhoneValid ) {
 		supportPhoneError = __(
 			'Please enter a valid phone number.',
 			'woocommerce-payments'
@@ -41,6 +50,13 @@ const SupportPhoneInput = ( { setInputVallid } ) => {
 		}
 	}, [ supportPhoneError, setInputVallid ] );
 
+	let labelText = __( 'Support phone number', 'woocommerce-payments' );
+	if ( isDevModeEnabled ) {
+		labelText += __(
+			' (+1 000-000-0000 can be used in dev mode)',
+			'woocommerce-payments'
+		);
+	}
 	return (
 		<>
 			{ supportPhoneError && (
@@ -54,18 +70,15 @@ const SupportPhoneInput = ( { setInputVallid } ) => {
 					'This may be visible on receipts, invoices, and automated emails from your store.',
 					'woocommerce-payments'
 				) }
-				label={ __( 'Support phone number', 'woocommerce-payments' ) }
+				label={ labelText }
 				id="account-business-support-phone-input"
 			>
 				<PhoneNumberInput
 					onValueChange={ setSupportPhone }
 					value={ supportPhone }
 					onValidationChange={ setPhoneValidity }
 					inputProps={ {
-						ariaLabel: __(
-							'Support phone number',
-							'woocommerce-payments'
-						),
+						ariaLabel: labelText,
 					} }
 				/>
 			</BaseControl>

client/settings/support-phone-input/test/support-phone-input.test.js

@@ -7,11 +7,16 @@ import { fireEvent, render, screen } from '@testing-library/react';
  * Internal dependencies
  */
 import SupportPhoneInput from '..';
-import { useGetSavingError, useAccountBusinessSupportPhone } from 'wcpay/data';
+import {
+	useGetSavingError,
+	useAccountBusinessSupportPhone,
+	useDevMode,
+} from 'wcpay/data';
 
 jest.mock( 'wcpay/data', () => ( {
 	useAccountBusinessSupportPhone: jest.fn(),
 	useGetSavingError: jest.fn(),
+	useDevMode: jest.fn(),
 } ) );
 
 describe( 'SupportPhoneInput', () => {
@@ -92,4 +97,17 @@ describe( 'SupportPhoneInput', () => {
 			container.querySelector( '.components-notice.is-error' ).textContent
 		).toEqual( 'Please enter a valid phone number.' );
 	} );
+
+	it( 'in dev mode, allow all 0s number', async () => {
+		useAccountBusinessSupportPhone.mockReturnValue( [
+			'+10000000000', // test phone number.
+			jest.fn(),
+		] );
+		useDevMode.mockReturnValue( true );
+
+		const { container } = render( <SupportPhoneInput /> );
+		expect(
+			container.querySelector( '.components-notice.is-error' )
+		).toBeNull();
+	} );
 } );

client/settings/transactions/test/index.test.js

@@ -40,6 +40,7 @@ jest.mock( 'wcpay/data', () => ( {
 	useManualCapture: jest.fn(),
 	useGetSavingError: jest.fn(),
 	useSavedCards: jest.fn(),
+	useDevMode: jest.fn(),
 	useCardPresentEligible: jest.fn(),
 } ) );
 

client/transactions/list/index.tsx

@@ -658,9 +658,7 @@ export const TransactionsList = (
 				window.confirm( confirmMessage )
 			) {
 				try {
-					const {
-						exported_transactions: exportedTransactions,
-					} = await apiFetch( {
+					await apiFetch( {
 						path: getTransactionsCSV( {
 							userEmail,
 							dateAfter,

client/types/account-overview.d.ts

@@ -68,8 +68,8 @@ export interface Overview {
 
 export interface OverviewsResponse {
 	overviews: {
-		account: Account;
-		currencies: Array< Overview >;
+		account: Account | null;
+		currencies: Overview[];
 	};
 	isLoading: boolean;
 }