Merge branch 'develop' into remove/woopay-express-button-on-pay-for-o…

…rder-page

changelog/fix-7241-update-live-dispute-docs-links-in-transaction-detail

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Comment: Behind a feature flag: Update documentation links (new/changed docs content) when notifying merchant that a dispute needs response.

client/payment-details/dispute-details/dispute-awaiting-response-details.tsx

@@ -26,11 +26,7 @@ import type { Dispute } from 'wcpay/types/disputes';
 import type { ChargeBillingDetails } from 'wcpay/types/charges';
 import wcpayTracks from 'tracks';
 import { useDisputeAccept } from 'wcpay/data';
-import {
-	getDisputeFeeFormatted,
-	isAwaitingResponse,
-	isInquiry,
-} from 'wcpay/disputes/utils';
+import { getDisputeFeeFormatted, isInquiry } from 'wcpay/disputes/utils';
 import { getAdminUrl } from 'wcpay/utils';
 import DisputeNotice from './dispute-notice';
 import IssuerEvidenceList from './evidence-list';
@@ -70,7 +66,7 @@ const DisputeAwaitingResponseDetails: React.FC< Props > = ( {
 				<CardBody className="transaction-details-dispute-details-body">
 					<DisputeNotice
 						dispute={ dispute }
-						urgent={ countdownDays <= 2 }
+						isUrgent={ countdownDays <= 2 }
 					/>
 					{ hasStagedEvidence && (
 						<InlineNotice icon={ edit } isDismissible={ false }>

client/payment-details/dispute-details/dispute-notice.tsx

@@ -5,6 +5,7 @@
  */
 import React from 'react';
 import { __, sprintf } from '@wordpress/i18n';
+import { ExternalLink } from '@wordpress/components';
 import { createInterpolateElement } from '@wordpress/element';
 
 /**
@@ -18,52 +19,55 @@ import { isInquiry } from 'wcpay/disputes/utils';
 
 interface DisputeNoticeProps {
 	dispute: Dispute;
-	urgent: boolean;
+	isUrgent: boolean;
 }
 
 const DisputeNotice: React.FC< DisputeNoticeProps > = ( {
 	dispute,
-	urgent,
+	isUrgent,
 } ) => {
-	const clientClaim =
+	const shopperDisputeReason =
 		reasons[ dispute.reason ]?.claim ??
 		__(
 			'The cardholder claims this is an unrecognized charge.',
 			'woocommerce-payments'
 		);
 
-	const noticeText = isInquiry( dispute )
-		? /* translators: <a> link to dispute documentation. %s is the clients claim for the dispute, eg "The cardholder claims this is an unrecognized charge." */
-		  __(
-				// eslint-disable-next-line max-len
-				'<strong>%s</strong> You can challenge their claim if you believe it’s invalid. Not responding will result in an automatic loss. <a>Learn more</a>',
-				'woocommerce-payments'
-		  )
-		: /* translators: <a> link to dispute documentation. %s is the clients claim for the dispute, eg "The cardholder claims this is an unrecognized charge." */
-		  __(
-				// eslint-disable-next-line max-len
-				'<strong>%s</strong> Challenge the dispute if you believe the claim is invalid, or accept to forfeit the funds and pay the dispute fee. Non-response will result in an automatic loss. <a>Learn more about responding to disputes</a>',
-				'woocommerce-payments'
-		  );
+	/* translators: <a> link to dispute documentation. %s is the clients claim for the dispute, eg "The cardholder claims this is an unrecognized charge." */
+	let noticeText = __(
+		'<strong>%s</strong> Challenge the dispute if you believe the claim is invalid, ' +
+			'or accept to forfeit the funds and pay the dispute fee. ' +
+			'Non-response will result in an automatic loss. <a>Learn more about responding to disputes</a>',
+		'woocommerce-payments'
+	);
+	let learnMoreDocsUrl =
+		'https://woocommerce.com/document/woopayments/fraud-and-disputes/managing-disputes/#responding';
+
+	if ( isInquiry( dispute ) ) {
+		/* translators: <a> link to dispute inquiry documentation. %s is the clients claim for the dispute, eg "The cardholder claims this is an unrecognized charge." */
+		noticeText = __(
+			'<strong>%s</strong> You can challenge their claim if you believe it’s invalid. ' +
+				'Not responding will result in an automatic loss. <a>Learn more about payment inquiries</a>',
+			'woocommerce-payments'
+		);
+		learnMoreDocsUrl =
+			'https://woocommerce.com/document/woopayments/fraud-and-disputes/managing-disputes/#inquiries';
+	}
 
 	return (
 		<InlineNotice
 			icon
-			status={ urgent ? 'error' : 'warning' }
+			status={ isUrgent ? 'error' : 'warning' }
 			className="dispute-notice"
 			isDismissible={ false }
 		>
-			{ createInterpolateElement( sprintf( noticeText, clientClaim ), {
-				a: (
-					// eslint-disable-next-line jsx-a11y/anchor-has-content
-					<a
-						target="_blank"
-						rel="noopener noreferrer"
-						href="https://woocommerce.com/document/woopayments/fraud-and-disputes/managing-disputes/#section-3"
-					/>
-				),
-				strong: <strong />,
-			} ) }
+			{ createInterpolateElement(
+				sprintf( noticeText, shopperDisputeReason ),
+				{
+					a: <ExternalLink href={ learnMoreDocsUrl } />,
+					strong: <strong />,
+				}
+			) }
 		</InlineNotice>
 	);
 };