CYS - Add tracking for patterns (#49556)

* Add tracking for patterns

* Fix type

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix lint error

* Add missing import

---------

Co-authored-by: github-actions <github-actions@github.com>

plugins/woocommerce-admin/client/customize-store/assembler-hub/sidebar/pattern-screen/sidebar-pattern-screen.tsx

@@ -52,6 +52,7 @@ import {
 	sortPatternsByCategory,
 	addIsAddedClassToPatternPreview,
 } from './utils';
+import { trackEvent } from '~/customize-store/tracking';
 
 export const SidebarPatternScreen = ( { category }: { category: string } ) => {
 	const { patterns, isLoading } = usePatternsByCategory( category );
@@ -212,6 +213,11 @@ export const SidebarPatternScreen = ( { category }: { category: string } ) => {
 			insertBlocks( cloneBlocks, insertableIndex, undefined, false );
 
 			blockToScroll.current = cloneBlocks[ 0 ].clientId;
+
+			trackEvent(
+				'customize_your_store_assembler_pattern_sidebar_click',
+				{ pattern: pattern.name }
+			);
 		},
 		[ insertBlocks, insertableIndex ]
 	);
@@ -245,8 +251,10 @@ export const SidebarPatternScreen = ( { category }: { category: string } ) => {
 							`/customize-store/assembler-hub/homepage`,
 							{}
 						);
-
 						navigateTo( { url: homepageUrl } );
+						trackEvent(
+							'customize_your_store_assembler_pattern_sidebar_close'
+						);
 					} }
 					iconSize={ 18 }
 					icon={ close }

plugins/woocommerce-admin/client/customize-store/assembler-hub/sidebar/sidebar-navigation-screen-homepage-ptk/sidebar-navigation-screen-homepage-ptk.tsx

@@ -33,7 +33,6 @@ import SidebarNavigationItem from '@wordpress/edit-site/build-module/components/
  */
 import { ADMIN_URL } from '~/utils/admin-settings';
 import { SidebarNavigationScreen } from '../sidebar-navigation-screen';
-
 import { trackEvent } from '~/customize-store/tracking';
 import { CustomizeStoreContext } from '../..';
 import { Link } from '@woocommerce/components';
@@ -201,6 +200,10 @@ export const SidebarNavigationScreenHomepagePTK = ( {
 											navigateTo( {
 												url: categoryUrl,
 											} );
+											trackEvent(
+												'customize_your_store_assembler_pattern_category_click',
+												{ category: categoryKey }
+											);
 										} }
 										as={ SidebarNavigationItem }
 										withChevron

plugins/woocommerce-admin/client/customize-store/assembler-hub/toolbar/delete.tsx

@@ -10,11 +10,18 @@ import {
 	// @ts-expect-error missing type
 } from '@wordpress/block-editor';
 
+/**
+ * Internal dependencies
+ */
+import { trackEvent } from '~/customize-store/tracking';
+
 export default function Delete( {
 	clientId,
+	currentBlockName,
 	nextBlockClientId,
 }: {
 	clientId: string;
+	currentBlockName: string | undefined;
 	nextBlockClientId: string | undefined;
 } ) {
 	// @ts-expect-error missing type
@@ -31,6 +38,10 @@ export default function Delete( {
 					if ( nextBlockClientId ) {
 						selectBlock( nextBlockClientId );
 					}
+					trackEvent(
+						'customize_your_store_assembler_pattern_delete_click',
+						{ pattern: currentBlockName }
+					);
 				} }
 			/>
 		</ToolbarGroup>

plugins/woocommerce-admin/client/customize-store/assembler-hub/toolbar/shuffle.tsx

@@ -16,6 +16,7 @@ import {
 import { PatternWithBlocks } from '~/customize-store/types/pattern';
 import { PATTERN_CATEGORIES } from '../sidebar/pattern-screen/categories';
 import { usePatternsByCategory } from '../hooks/use-patterns';
+import { trackEvent } from '~/customize-store/tracking';
 
 // This is the icon that is used in the Shuffle button. Currently we are using an outdated version of @wordpress/icons.
 // import { shuffle } from '@wordpress/icons';
@@ -128,6 +129,10 @@ export default function Shuffle( { clientId }: { clientId: string } ) {
 						},
 					};
 					replaceBlocks( clientId, nextPattern.blocks );
+					trackEvent(
+						'customize_your_store_assembler_pattern_shuffle_click',
+						{ category, pattern: nextPattern.name }
+					);
 				} }
 			>
 				{ categoryLabel && (

plugins/woocommerce-admin/client/customize-store/assembler-hub/toolbar/toolbar.tsx

@@ -214,6 +214,7 @@ export const Toolbar = () => {
 						<Shuffle clientId={ selectedBlockClientId } />
 						<Delete
 							clientId={ selectedBlockClientId }
+							currentBlockName={ currentBlock?.name }
 							nextBlockClientId={ nextBlock?.clientId }
 						/>
 					</>

plugins/woocommerce/changelog/49556-48950-patterns-tracking-events

@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+CYS - Add tracking events to pattern features.