Merge pull request #32937 from woocommerce/update/convert-woo-tracks-to-ts

Convert `@woocommerce/tracks` to TS

packages/js/tracks/changelog/update-convert-woo-tracks-to-ts

@@ -0,0 +1,4 @@
+Significance: minor
+Type: dev
+
+Convert package to Typescript.

packages/js/tracks/package.json

@@ -19,6 +19,7 @@
 	},
 	"main": "build/index.js",
 	"module": "build-module/index.js",
+	"types": "build-types",
 	"react-native": "src/index",
 	"dependencies": {
 		"debug": "^4.3.3"
@@ -37,6 +38,7 @@
 	},
 	"devDependencies": {
 		"@babel/core": "^7.17.5",
+		"@types/debug": "^4.1.7",
 		"@wordpress/eslint-plugin": "^11.0.0",
 		"eslint": "^8.12.0",
 		"jest": "^27.5.1",

packages/js/tracks/src/index.ts

@@ -8,13 +8,26 @@ import debug from 'debug';
  */
 const tracksDebug = debug( 'wc-admin:tracks' );
 
+export type ExtraProperties = {
+	[ key: string ]: unknown;
+};
+
+const isRecordEventArgs = (
+	args: unknown[]
+): args is [ string, ExtraProperties | undefined ] => {
+	return args.length === 2 && typeof args[ 0 ] === 'string';
+};
+
 /**
  * Record an event to Tracks
  *
  * @param {string} eventName       The name of the event to record, don't include the wcadmin_ prefix
  * @param {Object} eventProperties event properties to include in the event
  */
-export function recordEvent( eventName, eventProperties ) {
+export function recordEvent(
+	eventName: string,
+	eventProperties?: ExtraProperties
+) {
 	tracksDebug( 'recordevent %s %o', 'wcadmin_' + eventName, eventProperties, {
 		_tqk: window._tkq,
 		shouldRecord:
@@ -53,21 +66,26 @@ const tracksQueue = {
 			return [];
 		}
 
-		let items = window.localStorage.getItem(
+		const items = window.localStorage.getItem(
 			tracksQueue.localStorageKey()
 		);
+		const parsedJSONItems = items ? JSON.parse( items ) : [];
+		const arrayItems = Array.isArray( parsedJSONItems )
+			? parsedJSONItems
+			: [];
 
-		items = items ? JSON.parse( items ) : [];
-		items = Array.isArray( items ) ? items : [];
-
-		return items;
+		return arrayItems;
 	},
 
-	add( ...args ) {
+	add( ...args: unknown[] ) {
 		if ( ! window.localStorage ) {
 			// If unable to queue, run it now.
 			tracksDebug( 'Unable to queue, running now', { args } );
-			recordEvent.apply( null, args || undefined );
+			if ( isRecordEventArgs( args ) ) {
+				recordEvent( ...args );
+			} else {
+				tracksDebug( 'Invalid args', args );
+			}
 			return;
 		}
 
@@ -97,7 +115,12 @@ const tracksQueue = {
 		items.forEach( ( item ) => {
 			if ( typeof item === 'object' ) {
 				tracksDebug( 'Processing item in queue.', item );
-				recordEvent.apply( null, item.args || undefined );
+				const args = item.args;
+				if ( isRecordEventArgs( args ) ) {
+					recordEvent( ...args );
+				} else {
+					tracksDebug( 'Invalid item args', item.args );
+				}
 			}
 		} );
 	},
@@ -115,7 +138,10 @@ const tracksQueue = {
  * @param {Object} eventProperties event properties to include in the event
  */
 
-export function queueRecordEvent( eventName, eventProperties ) {
+export function queueRecordEvent(
+	eventName: string,
+	eventProperties?: ExtraProperties
+) {
 	tracksQueue.add( eventName, eventProperties );
 }
 
@@ -126,7 +152,10 @@ export function queueRecordEvent( eventName, eventProperties ) {
  * @param {Object} extraProperties extra event properties to include in the event
  */
 
-export function recordPageView( path, extraProperties ) {
+export function recordPageView(
+	path: string,
+	extraProperties?: ExtraProperties
+) {
 	if ( ! path ) {
 		return;
 	}

packages/js/tracks/tsconfig.json

@@ -2,6 +2,9 @@
 	"extends": "../tsconfig",
 	"compilerOptions": {
 		"rootDir": "src",
-		"outDir": "build-module"
+		"outDir": "build-module",
+		"declaration": true,
+		"declarationMap": true,
+		"declarationDir": "./build-types"
 	}
-}
+}

packages/js/tracks/typings/global.d.ts

@@ -0,0 +1,17 @@
+declare global {
+	interface Window {
+		wcTracks: {
+			isEnabled: boolean;
+			recordEvent: (
+				name: string,
+				properties: unknown,
+			) => void;
+		};
+		_tkq: {
+			[key: string]: number;
+		}
+	}
+}
+
+/*~ If your module exports nothing, you'll need this line. Otherwise, delete it */
+export {};

plugins/woocommerce-admin/client/typings/index.d.ts

@@ -1,7 +1,6 @@
 declare module '@woocommerce/e2e-utils';
 declare module '@woocommerce/e2e-environment';
 declare module '@woocommerce/settings';
-declare module '@woocommerce/tracks';
 declare module '@wordpress/components/build/ui' {
 	// Typescript seems unable to resolve this correctly by default, so we need to re-export it in our type defs.
 	export * from '@wordpress/components/build-types/ui';

plugins/woocommerce/changelog/update-convert-woo-tracks-to-ts

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+Remove woo tracks type declaration from woo admin ./cleint.

pnpm-lock.yaml

@@ -1152,6 +1152,7 @@ importers:
   packages/js/tracks:
     specifiers:
       '@babel/core': ^7.17.5
+      '@types/debug': ^4.1.7
       '@wordpress/eslint-plugin': ^11.0.0
       debug: ^4.3.3
       eslint: ^8.12.0
@@ -1164,6 +1165,7 @@ importers:
       debug: 4.3.3
     devDependencies:
       '@babel/core': 7.17.8
+      '@types/debug': 4.1.7
       '@wordpress/eslint-plugin': 11.0.1_7c040a9b494a33cf8bf9079642892fb1
       eslint: 8.12.0
       jest: 27.5.1
@@ -13231,6 +13233,12 @@ packages:
       '@types/node': 16.10.3
     dev: true
 
+  /@types/debug/4.1.7:
+    resolution: {integrity: sha512-9AonUzyTjXXhEOa0DnqpzZi6VHlqKMswga9EXjpXnnqxwLtdvPPtlO8evrI5D9S6asFRCQ6v+wpiUKbw+vKqyg==}
+    dependencies:
+      '@types/ms': 0.7.31
+    dev: true
+
   /@types/dompurify/2.3.3:
     resolution: {integrity: sha512-nnVQSgRVuZ/843oAfhA25eRSNzUFcBPk/LOiw5gm8mD9/X7CNcbRkQu/OsjCewO8+VIYfPxUnXvPEVGenw14+w==}
     dependencies:
@@ -13405,6 +13413,10 @@ packages:
   /@types/mousetrap/1.6.9:
     resolution: {integrity: sha512-HUAiN65VsRXyFCTicolwb5+I7FM6f72zjMWr+ajGk+YTvzBgXqa2A5U7d+rtsouAkunJ5U4Sb5lNJjo9w+nmXg==}
 
+  /@types/ms/0.7.31:
+    resolution: {integrity: sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA==}
+    dev: true
+
   /@types/node-fetch/2.6.1:
     resolution: {integrity: sha512-oMqjURCaxoSIsHSr1E47QHzbmzNR5rK8McHuNb11BOM9cHcIK3Avy0s/b2JlXHoQGTYS3NsvWzV1M0iK7l0wbA==}
     dependencies: