From 2e5734a8bae82923bb3fa25a86eb9d89cbca28f1 Mon Sep 17 00:00:00 2001
From: letiescanciano <45267095+letiescanciano@users.noreply.github.com>
Date: Mon, 3 Oct 2022 11:54:52 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=AA=9F=C2=A0=F0=9F=94=A7=C2=A0=20Add=20Se?=
 =?UTF-8?q?gment=20track=20event=20to=20suggested=20destinations=20experim?=
 =?UTF-8?q?ent=20(#17328)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Add segment track event to suggested destinations experiment

Closes #17257

* Fix spec
---
 .../components/DestinationForm.tsx                     |  6 +++++-
 .../src/views/Connector/ServiceForm/ServiceForm.tsx    |  5 ++++-
 .../FrequentlyUsedDestinations.test.tsx                |  5 ++++-
 .../FrequentlyUsedDestinations.tsx                     | 10 ++++++++--
 4 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/airbyte-webapp/src/pages/DestinationPage/pages/CreateDestinationPage/components/DestinationForm.tsx b/airbyte-webapp/src/pages/DestinationPage/pages/CreateDestinationPage/components/DestinationForm.tsx
index fce89f9ee2df..3ed793080431 100644
--- a/airbyte-webapp/src/pages/DestinationPage/pages/CreateDestinationPage/components/DestinationForm.tsx
+++ b/airbyte-webapp/src/pages/DestinationPage/pages/CreateDestinationPage/components/DestinationForm.tsx
@@ -52,7 +52,10 @@ export const DestinationForm: React.FC<DestinationFormProps> = ({
     isLoading,
   } = useGetDestinationDefinitionSpecificationAsync(destinationDefinitionId);
 
-  const onDropDownSelect = (destinationDefinitionId: string) => {
+  const onDropDownSelect = (
+    destinationDefinitionId: string,
+    trackParams?: { actionDescription: string; connector_destination_suggested: boolean }
+  ) => {
     setDestinationDefinitionId(destinationDefinitionId);
 
     const connector = destinationDefinitions.find((item) => item.destinationDefinitionId === destinationDefinitionId);
@@ -65,6 +68,7 @@ export const DestinationForm: React.FC<DestinationFormProps> = ({
       actionDescription: "Destination connector type selected",
       connector_destination: connector?.name,
       connector_destination_definition_id: destinationDefinitionId,
+      ...trackParams,
     });
   };
 
diff --git a/airbyte-webapp/src/views/Connector/ServiceForm/ServiceForm.tsx b/airbyte-webapp/src/views/Connector/ServiceForm/ServiceForm.tsx
index 9fcf4b519a74..ea16cc1cb406 100644
--- a/airbyte-webapp/src/views/Connector/ServiceForm/ServiceForm.tsx
+++ b/airbyte-webapp/src/views/Connector/ServiceForm/ServiceForm.tsx
@@ -121,7 +121,10 @@ export interface ServiceFormProps {
   formId?: string;
   availableServices: ConnectorDefinition[];
   selectedConnectorDefinitionSpecification?: ConnectorDefinitionSpecification;
-  onServiceSelect?: (id: string) => void;
+  onServiceSelect?: (
+    id: string,
+    trackParams?: { actionDescription: string; connector_destination_suggested: boolean }
+  ) => void;
   onSubmit: (values: ServiceFormValues) => void;
   isLoading?: boolean;
   isEditMode?: boolean;
diff --git a/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.test.tsx b/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.test.tsx
index 55395fc6a52e..49dcddeb19c3 100644
--- a/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.test.tsx
+++ b/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.test.tsx
@@ -38,7 +38,10 @@ describe("<FrequentlyUsedDestinations />", () => {
 
     await waitFor(() => {
       expect(handler).toHaveBeenCalledTimes(1);
-      expect(handler).toHaveBeenCalledWith("2");
+      expect(handler).toHaveBeenCalledWith("2", {
+        actionDescription: "Suggested destination connector type selected",
+        connector_destination_suggested: true,
+      });
     });
   });
 });
diff --git a/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.tsx b/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.tsx
index df35d639de82..07cf7b352ebf 100644
--- a/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.tsx
+++ b/airbyte-webapp/src/views/Connector/ServiceForm/components/FrequentlyUsedDestinations/FrequentlyUsedDestinations.tsx
@@ -12,7 +12,10 @@ import styles from "./FrequentlyUsedDestinations.module.scss";
 export interface FrequentlyUsedDestinationsProps {
   propertyPath: string;
   destinations: DestinationConnectorCard[];
-  onDestinationSelect?: (id: string) => void;
+  onDestinationSelect?: (
+    id: string,
+    trackParams?: { actionDescription: string; connector_destination_suggested: boolean }
+  ) => void;
   isLoading?: boolean;
 }
 
@@ -30,7 +33,10 @@ export const FrequentlyUsedDestinations: React.FC<FrequentlyUsedDestinationsProp
   }
   const onSlideClick = (id: string) => {
     setValue(id);
-    onDestinationSelect?.(id);
+    onDestinationSelect?.(id, {
+      actionDescription: "Suggested destination connector type selected",
+      connector_destination_suggested: true,
+    });
   };
   return (
     <div className={styles.container}>