Merge branch 'trunk' into e2e/increase-timeouts

packages/js/components/changelog/fix-38210

@@ -0,0 +1,4 @@
+Significance: minor
+Type: fix
+
+Wrap selected items in experimental select control

packages/js/components/src/experimental-select-control/combo-box.scss

@@ -18,7 +18,6 @@
 .woocommerce-experimental-select-control__items-wrapper {
 	display: flex;
 	flex-grow: 1;
-	flex-wrap: wrap;
 	align-items: center;
 	padding: 2px $gap-smaller;
 

packages/js/components/src/experimental-select-control/selected-items.scss

@@ -1,7 +1,11 @@
-.woocommerce-experimental-select-control__selected-items.is-read-only {
-    font-size: 13px;
-    color: $gray-900;
-    font-family: var(--wp--preset--font-family--system-font);
+.woocommerce-experimental-select-control__selected-items {
+    flex-wrap: wrap;
+
+    &.is-read-only {
+        font-size: 13px;
+        color: $gray-900;
+        font-family: var(--wp--preset--font-family--system-font);
+    }
 }
 
 .woocommerce-experimental-select-control__selected-item {

plugins/woocommerce-admin/client/activity-panel/activity-panel.js

@@ -43,7 +43,7 @@ import { getUnapprovedReviews } from '../homescreen/activity-panel/reviews/utils
 import { ABBREVIATED_NOTIFICATION_SLOT_NAME } from './panels/inbox/abbreviated-notifications-panel';
 import { getAdminSetting } from '~/utils/admin-settings';
 import { getUrlParams } from '~/utils';
-import { useActiveSetupTasklist } from '~/tasks';
+import { useActiveSetupTasklist } from '~/task-lists';
 import { getSegmentsFromPath } from '~/utils/url-helpers';
 import { FeedbackIcon } from '~/products/images/feedback-icon';
 import { ProductFeedbackTour } from '~/guided-tours/add-product-feedback-tour';

plugins/woocommerce-admin/client/activity-panel/panels/setup-tasks/setup-tasks-panel.tsx

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import { Tasks } from '~/tasks';
+import { TaskLists } from '~/task-lists';
 
 type QueryTypeProps = {
 	query: {
@@ -12,7 +12,7 @@ type QueryTypeProps = {
 export const SetupTasksPanel = ( { query }: QueryTypeProps ) => {
 	return (
 		<div className="woocommerce-setup-panel">
-			<Tasks query={ query } />
+			<TaskLists query={ query } />
 		</div>
 	);
 };

plugins/woocommerce-admin/client/header/index.js

@@ -20,7 +20,7 @@ import { Text, useSlot } from '@woocommerce/experimental';
  */
 import './style.scss';
 import useIsScrolled from '../hooks/useIsScrolled';
-import { TasksReminderBar, useActiveSetupTasklist } from '../tasks';
+import { TasksReminderBar, useActiveSetupTasklist } from '../task-lists';
 
 export const PAGE_TITLE_FILTER = 'woocommerce_admin_header_page_title';
 

plugins/woocommerce-admin/client/homescreen/layout.js

@@ -30,7 +30,11 @@ import InboxPanel from '../inbox-panel';
 import { IntroModal as NavigationIntroModal } from '../navigation/components/intro-modal';
 import StatsOverview from './stats-overview';
 import { StoreManagementLinks } from '../store-management-links';
-import { TasksPlaceholder, useActiveSetupTasklist } from '../tasks';
+import {
+	TasksPlaceholder,
+	useActiveSetupTasklist,
+	ProgressTitle,
+} from '../task-lists';
 import {
 	WELCOME_MODAL_DISMISSED_OPTION_NAME,
 	WELCOME_FROM_CALYPSO_MODAL_DISMISSED_OPTION_NAME,
@@ -41,14 +45,15 @@ import { MobileAppModal } from './mobile-app-modal';
 import './style.scss';
 import '../dashboard/style.scss';
 import { getAdminSetting } from '~/utils/admin-settings';
-import { ProgressTitle } from '../task-lists';
 import { WooHomescreenHeaderBanner } from './header-banner-slot';
 import { WooHomescreenWCPayFeature } from './wcpay-feature-slot';
 
-const Tasks = lazy( () =>
-	import( /* webpackChunkName: "tasks" */ '../tasks' ).then( ( module ) => ( {
-		default: module.Tasks,
-	} ) )
+const TaskLists = lazy( () =>
+	import( /* webpackChunkName: "tasks" */ '../task-lists' ).then(
+		( module ) => ( {
+			default: module.TaskLists,
+		} )
+	)
 );
 
 export const Layout = ( {
@@ -127,7 +132,7 @@ export const Layout = ( {
 						<ProgressTitle taskListId={ activeSetupTaskList } />
 					</>
 				) }
-				<Tasks query={ query } />
+				<TaskLists query={ query } />
 			</Suspense>
 		);
 	};

plugins/woocommerce-admin/client/layout/index.js

@@ -55,7 +55,7 @@ const StoreAlerts = lazy( () =>
 
 const WCPayUsageModal = lazy( () =>
 	import(
-		/* webpackChunkName: "wcpay-usage-modal" */ '../tasks/fills/PaymentGatewaySuggestions/components/WCPay/UsageModal'
+		/* webpackChunkName: "wcpay-usage-modal" */ '../task-lists/fills/PaymentGatewaySuggestions/components/WCPay/UsageModal'
 	)
 );
 

plugins/woocommerce-admin/client/payments/test/payment-recommendations.test.tsx

@@ -9,7 +9,7 @@ import { recordEvent } from '@woocommerce/tracks';
  * Internal dependencies
  */
 import PaymentRecommendations from '../payment-recommendations';
-import { isWCPaySupported } from '../../tasks/fills/PaymentGatewaySuggestions/components/WCPay';
+import { isWCPaySupported } from '../../task-lists/fills/PaymentGatewaySuggestions/components/WCPay';
 import { createNoticesFromResponse } from '~/lib/notices';
 
 jest.mock( '@woocommerce/tracks', () => ( { recordEvent: jest.fn() } ) );
@@ -44,7 +44,7 @@ jest.mock( '@woocommerce/components', () => ( {
 	),
 } ) );
 jest.mock(
-	'../../tasks/fills/PaymentGatewaySuggestions/components/WCPay',
+	'../../task-lists/fills/PaymentGatewaySuggestions/components/WCPay',
 	() => ( {
 		isWCPaySupported: jest.fn(),
 	} )

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

@@ -9,7 +9,7 @@ import { getVisibleTasks, ONBOARDING_STORE_NAME } from '@woocommerce/data';
  * Internal dependencies
  */
 import './progress-header.scss';
-import { TaskListMenu } from '~/tasks/task-list-menu';
+import { TaskListMenu } from '~/task-lists/components/task-list-menu';
 
 export type DefaultProgressHeaderProps = {
 	taskListId: string;

plugins/woocommerce-admin/client/task-lists/components/task-list.tsx

@@ -21,14 +21,13 @@ import { useLayoutContext } from '@woocommerce/admin-layout';
 import { TaskListItem } from './task-list-item';
 import { TaskListMenu } from './task-list-menu';
 import './task-list.scss';
-import { ProgressHeader } from '~/task-lists/progress-header';
+import { ProgressHeader } from '~/task-lists/components/progress-header';
 
 export type TaskListProps = TaskListType & {
 	query: {
 		task?: string;
 	};
 	eventName?: string;
-	twoColumns?: boolean;
 	keepCompletedTaskList?: 'yes' | 'no';
 	cesHeader?: boolean;
 };

plugins/woocommerce-admin/client/task-lists/fills/Marketing/test/index.tsx

@@ -6,7 +6,7 @@ import { Extension } from '@woocommerce/data';
 /**
  * Internal dependencies
  */
-import { transformExtensionToPlugin, getMarketingExtensionLists } from '../';
+import { transformExtensionToPlugin, getMarketingExtensionLists } from '..';
 
 const basicPlugins: Extension[] = [
 	{

plugins/woocommerce-admin/client/task-lists/fills/PaymentGatewaySuggestions/components/Setup/test/setup.js

@@ -6,7 +6,7 @@ import { render } from '@testing-library/react';
 /**
  * Internal dependencies
  */
-import { Setup } from '../';
+import { Setup } from '..';
 import { enqueueScript } from '~/utils/enqueue-script';
 
 jest.mock( '@woocommerce/components', () => {

plugins/woocommerce-admin/client/task-lists/fills/experimental-shipping-recommendation/components/store-location.tsx

@@ -11,7 +11,7 @@ import { useSelect, useDispatch } from '@wordpress/data';
  */
 import { getCountryCode } from '~/dashboard/utils';
 import { hasCompleteAddress } from '../../tax/utils';
-import { default as StoreLocationForm } from '~/tasks/fills/steps/location';
+import { default as StoreLocationForm } from '~/task-lists/fills/steps/location';
 
 export const StoreLocation: React.FC< {
 	nextStep: () => void;

plugins/woocommerce-admin/client/task-lists/fills/index.ts

@@ -9,6 +9,7 @@ import './appearance';
 import './tax';
 import './woocommerce-payments';
 import './purchase';
+import './deprecated-tasks';
 
 const possiblyImportProductTask = async () => {
 	if ( isImportProduct() ) {