Refine "Temporarily Suspended" language, statuses and tooltip copy (#10853)

Co-authored-by: oaratovskyi <[email protected]>

Author: oaratovskyi

changelog/update-WOOPMNT-4764-make-under-review-status-more-clear

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Refine "Temporarily Suspended" language, statuses and tooltip copy

client/components/account-status/index.js

@@ -118,10 +118,6 @@ const AccountStatusDetails = ( props ) => {
 					status={ accountStatus.deposits?.status }
 					interval={ accountStatus.deposits?.interval }
 					accountStatus={ accountStatus.status }
-					poEnabled={ accountStatus.progressiveOnboarding.isEnabled }
-					poComplete={
-						accountStatus.progressiveOnboarding.isComplete
-					}
 					iconSize={ 24 }
 				/>
 			</AccountStatusItem>

client/components/account-status/status-chip.js

@@ -12,7 +12,7 @@ import Chip from 'components/chip';
 import './style.scss';
 
 const StatusChip = ( props ) => {
-	const { accountStatus, poEnabled, poComplete } = props;
+	const { accountStatus } = props;
 
 	let description = __( 'Unknown', 'woocommerce-payments' );
 	let type = 'light';
@@ -27,10 +27,7 @@ const StatusChip = ( props ) => {
 	} else if ( accountStatus === 'restricted_soon' ) {
 		description = __( 'Restricted soon', 'woocommerce-payments' );
 		type = 'warning';
-	} else if (
-		accountStatus === 'pending_verification' ||
-		( poEnabled && ! poComplete && accountStatus === 'restricted' )
-	) {
+	} else if ( accountStatus === 'pending_verification' ) {
 		description = __( 'Pending', 'woocommerce-payments' );
 		type = 'light';
 		tooltip = __(

client/components/deposits-status/index.tsx

@@ -67,7 +67,7 @@ const DepositsStatusSuspended: React.FC< DepositsStatusProps > = ( {
 } ) => {
 	const description =
 		/* translators: <a> - suspended accounts FAQ URL */
-		__( 'Temporarily suspended', 'woocommerce-payments' );
+		__( 'Under Review', 'woocommerce-payments' );
 
 	return (
 		<span className={ 'account-status__info__yellow' }>
@@ -85,7 +85,7 @@ const DepositsStatusSuspended: React.FC< DepositsStatusProps > = ( {
 						/* translators: 1: WooPayments */
 						__(
 							// eslint-disable-next-line max-len
-							'After the information review, your account was temporarily suspended. {{learnMoreLink}}Learn more{{/learnMoreLink}}',
+							'While the account is under review payouts may remain suspended. {{learnMoreLink}}Learn more{{/learnMoreLink}}',
 							'woocommerce-payments'
 						),
 						'WooPayments'
@@ -134,20 +134,16 @@ const DepositsStatus: React.FC< Props > = ( {
 	status,
 	interval,
 	accountStatus,
-	poEnabled,
-	poComplete,
 	iconSize,
 } ) => {
-	const isPoInProgress = poEnabled && ! poComplete;
-
 	if ( status === 'blocked' || accountStatus === 'under_review' ) {
 		return (
 			<DepositsStatusSuspended
 				iconSize={ iconSize }
 				interval={ interval }
 			/>
 		);
-	} else if ( accountStatus === 'pending_verification' || isPoInProgress ) {
+	} else if ( accountStatus === 'pending_verification' ) {
 		return (
 			<DepositsStatusPending
 				iconSize={ iconSize }

client/components/deposits-status/test/__snapshots__/index.js.snap

@@ -18,7 +18,7 @@ exports[`DepositsStatus renders blocked status 1`] = `
         />
       </g>
     </svg>
-    Temporarily suspended
+    Under Review
     <button
       class="wcpay-tooltip__content-wrapper wcpay-tooltip--click__content-wrapper"
       type="button"
@@ -69,7 +69,7 @@ exports[`DepositsStatus renders blocked status 2`] = `
         />
       </g>
     </svg>
-    Temporarily suspended
+    Under Review
     <button
       class="wcpay-tooltip__content-wrapper wcpay-tooltip--click__content-wrapper"
       type="button"
@@ -212,7 +212,7 @@ exports[`DepositsStatus renders pending verification status 1`] = `
         />
       </g>
     </svg>
-    Temporarily suspended
+    Under Review
     <button
       class="wcpay-tooltip__content-wrapper wcpay-tooltip--click__content-wrapper"
       type="button"

client/components/deposits-status/test/index.js

@@ -54,7 +54,7 @@ describe( 'DepositsStatus', () => {
 			}
 		);
 
-		expect( await findByText( /Temporarily suspended/i ) ).toBeVisible();
+		expect( await findByText( /Under Review/i ) ).toBeVisible();
 		expect( depositsStatus ).toMatchSnapshot();
 	} );
 
@@ -67,7 +67,7 @@ describe( 'DepositsStatus', () => {
 			}
 		);
 
-		expect( await findByText( /Temporarily suspended/i ) ).toBeVisible();
+		expect( await findByText( /Under Review/i ) ).toBeVisible();
 		expect( depositsStatus ).toMatchSnapshot();
 	} );