Merge pull request #32786 from woocommerce/fix/32720_progress-header-title

Fix progress header title

plugins/woocommerce-admin/client/task-lists/progress-header/progress-header.tsx

@@ -20,40 +20,33 @@ type ProgressHeaderProps = {
 export const ProgressHeader: React.FC< ProgressHeaderProps > = ( {
 	taskListId,
 } ) => {
-	const {
-		loading,
-		tasksCount,
-		completedCount,
-		hasVisitedTasks,
-		disabledCompletedCount,
-	} = useSelect( ( select ) => {
-		const taskList = select( ONBOARDING_STORE_NAME ).getTaskList(
-			taskListId
-		);
-		const finishedResolution = select(
-			ONBOARDING_STORE_NAME
-		).hasFinishedResolution( 'getTaskList', [ taskListId ] );
-		const visibleTasks = getVisibleTasks( taskList?.tasks || [] );
+	const { loading, tasksCount, completedCount, hasVisitedTasks } = useSelect(
+		( select ) => {
+			const taskList = select( ONBOARDING_STORE_NAME ).getTaskList(
+				taskListId
+			);
+			const finishedResolution = select(
+				ONBOARDING_STORE_NAME
+			).hasFinishedResolution( 'getTaskList', [ taskListId ] );
+			const visibleTasks = getVisibleTasks( taskList?.tasks || [] );
 
-		return {
-			loading: ! finishedResolution,
-			tasksCount: visibleTasks?.length,
-			completedCount: visibleTasks?.filter( ( task ) => task.isComplete )
-				.length,
-			disabledCompletedCount: visibleTasks?.filter(
-				( task ) => task.isComplete && task.isDisabled
-			).length,
-			hasVisitedTasks:
-				visibleTasks?.filter( ( task ) => task.isVisited ).length > 0,
-		};
-	} );
+			return {
+				loading: ! finishedResolution,
+				tasksCount: visibleTasks?.length,
+				completedCount: visibleTasks?.filter(
+					( task ) => task.isComplete
+				).length,
+				hasVisitedTasks:
+					visibleTasks?.filter(
+						( task ) =>
+							task.isVisited && task.id !== 'store_details'
+					).length > 0,
+			};
+		}
+	);
 
 	const progressTitle = useMemo( () => {
-		if (
-			( ! hasVisitedTasks &&
-				completedCount < 2 + disabledCompletedCount ) ||
-			completedCount === tasksCount
-		) {
+		if ( ! hasVisitedTasks || completedCount === tasksCount ) {
 			const siteTitle = getSetting( 'siteTitle' );
 			return siteTitle
 				? sprintf(
@@ -61,7 +54,7 @@ export const ProgressHeader: React.FC< ProgressHeaderProps > = ( {
 						__( 'Welcome to %s', 'woocommerce' ),
 						siteTitle
 				  )
-				: __( 'Welcome', 'woocommerce' );
+				: __( 'Welcome to your store', 'woocommerce' );
 		}
 		if ( completedCount > 0 && completedCount < 4 ) {
 			return __( "Let's get you started", 'woocommerce' ) + '   🚀';
@@ -70,7 +63,7 @@ export const ProgressHeader: React.FC< ProgressHeaderProps > = ( {
 			return __( 'You are on the right track', 'woocommerce' );
 		}
 		return __( 'You are almost there', 'woocommerce' );
-	}, [ completedCount, hasVisitedTasks ] );
+	}, [ completedCount, hasVisitedTasks, tasksCount ] );
 
 	if ( loading ) {
 		return null;

plugins/woocommerce-admin/client/two-column-tasks/task-list-item.tsx

@@ -7,7 +7,12 @@ import {
 	getNewPath,
 	updateQueryString,
 } from '@woocommerce/navigation';
-import { OPTIONS_STORE_NAME, TaskType } from '@woocommerce/data';
+import {
+	ONBOARDING_STORE_NAME,
+	OPTIONS_STORE_NAME,
+	TaskType,
+	useUserPreferences,
+} from '@woocommerce/data';
 import { recordEvent } from '@woocommerce/tracks';
 import { TaskItem, useSlot } from '@woocommerce/experimental';
 import { useCallback } from '@wordpress/element';
@@ -32,16 +37,46 @@ export const TaskListItem: React.FC< TaskListItemProps > = ( {
 		snoozeTask,
 		undoSnoozeTask,
 	} = useDispatch( OPTIONS_STORE_NAME );
+	const { visitedTask } = useDispatch( ONBOARDING_STORE_NAME );
 
 	const slot = useSlot(
 		`woocommerce_onboarding_task_list_item_${ task.id }`
 	);
 	const hasFills = Boolean( slot?.fills?.length );
 
+	const userPreferences = useUserPreferences();
+
+	const getTaskStartedCount = () => {
+		const trackedStartedTasks =
+			userPreferences.task_list_tracked_started_tasks;
+		if ( ! trackedStartedTasks || ! trackedStartedTasks[ task.id ] ) {
+			return 0;
+		}
+		return trackedStartedTasks[ task.id ];
+	};
+
+	const updateTrackStartedCount = () => {
+		const newCount = getTaskStartedCount() + 1;
+		const trackedStartedTasks =
+			userPreferences.task_list_tracked_started_tasks || {};
+
+		visitedTask( task.id );
+		userPreferences.updateUserPreferences( {
+			task_list_tracked_started_tasks: {
+				...( trackedStartedTasks || {} ),
+				[ task.id ]: newCount,
+			},
+		} );
+	};
+
 	const trackClick = () => {
 		recordEvent( `${ eventPrefix }click`, {
 			task_name: task.id,
 		} );
+
+		if ( ! task.isComplete ) {
+			updateTrackStartedCount();
+		}
 	};
 
 	const onTaskSelected = () => {

plugins/woocommerce/changelog/fix-32720_progress-header-title

@@ -0,0 +1,4 @@
+Significance: minor
+Type: fix
+
+Fix progress header title #32786