@@ -141,27 +148,45 @@ export const TaskList = ( {
( listTask ) => listTask.isComplete === false
);
+ // If nothing is selected, default to the last task since everything is completed.
if ( ! selectedHeaderCard ) {
- selectedHeaderCard = visibleTasks[ 0 ];
+ selectedHeaderCard = visibleTasks[ visibleTasks.length - 1 ];
}
- const onTaskSelected = ( task ) => {
- if ( task !== selectedHeaderCard ) {
- recordEvent( `${ eventName }_click`, {
- task_name: task.id,
- } );
+ const goToTask = ( task ) => {
+ trackClick( task );
+ updateQueryString( { task: task.id } );
+ };
- updateQueryString( { task: task.id } );
- }
+ const showTaskHeader = ( task ) => {
if ( taskHeaders[ task.id ] ) {
- setHeaderContent( taskHeaders[ task.id ]( task ) );
+ setHeaderData( {
+ task,
+ goToTask: () => goToTask( task ),
+ trackClick: () => trackClick( task ),
+ } );
setActiveTaskId( task.id );
}
};
+ const trackClick = ( task ) => {
+ recordEvent( `${ eventName }_click`, {
+ task_name: task.id,
+ } );
+ };
+
+ const onTaskSelected = ( task ) => {
+ if ( task.id === 'woocommerce-payments' ) {
+ // With WCPay, we have to show the header content for user to read t&c first.
+ showTaskHeader( task );
+ } else {
+ goToTask( task );
+ }
+ };
+
useEffect( () => {
if ( selectedHeaderCard ) {
- onTaskSelected( selectedHeaderCard );
+ showTaskHeader( selectedHeaderCard );
}
}, [ selectedHeaderCard ] );
@@ -199,12 +224,16 @@ export const TaskList = ( {
size="large"
className="woocommerce-task-card woocommerce-homescreen-card"
>
-
+
- { headerContent }
+ { headerData?.task &&
+ createElement(
+ taskHeaders[ headerData.task.id ],
+ headerData
+ ) }
{ renderMenu() }
-
+
{ visibleTasks.map( ( task, index ) => {
++index;
@@ -219,7 +248,10 @@ export const TaskList = ( {
{
@@ -232,7 +264,6 @@ export const TaskList = ( {
}
action={ task.action }
actionLabel={ task.actionLabel }
- additionalInfo={ task.additionalInfo }
showActionButton={ task.showActionButton }
/>
);
diff --git a/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/Payments.php b/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/Payments.php
index 5d1a6917907..035df1cf587 100644
--- a/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/Payments.php
+++ b/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/Payments.php
@@ -27,7 +27,8 @@ class Payments {
(
! WooCommercePayments::is_requested() ||
! WooCommercePayments::is_installed() ||
- ! WooCommercePayments::is_supported()
+ ! WooCommercePayments::is_supported() ||
+ WooCommercePayments::is_connected()
),
'time' => __( '2 minutes', 'woocommerce-admin' ),
);
diff --git a/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/WooCommercePayments.php b/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/WooCommercePayments.php
index 2e141a3020e..c75d3ff6419 100644
--- a/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/WooCommercePayments.php
+++ b/plugins/woocommerce-admin/src/Features/OnboardingTasks/Tasks/WooCommercePayments.php
@@ -27,7 +27,8 @@ class WooCommercePayments {
'is_complete' => self::is_connected(),
'can_view' => self::is_requested() &&
self::is_installed() &&
- self::is_supported(),
+ self::is_supported() &&
+ ! self::is_connected(),
'time' => __( '2 minutes', 'woocommerce-admin' ),
'additional_info' => __(
'By setting up, you are agreeing to the Terms of Service',