Add duration per step

Author: AdityaHegde

web-common/src/features/add-data/form/ConnectorForm.svelte

@@ -61,8 +61,8 @@
         void errorEventHandler?.fireAddDataErrorEvent(
           config.space,
           config.screen,
-          step.schema,
           step.step,
+          step.schema,
           e.message,
         );
         setSubmitError(form, e);

web-common/src/features/add-data/manager/AddDataManager.svelte

@@ -46,7 +46,17 @@
   const stateManager = new AddDataStateManager();
   $effect(() => stateManager.setCallbacks(onDone, onClose, onStepChange));
   $effect(() => stateManager.setConfig(config));
-  $effect(() => void init(initConnector, initSchema));
+  let prevInitConnector: string | undefined;
+  let prevInitSchema: string | undefined;
+  $effect(() => {
+    // This effect seems to be called even if data doesnt change. So add a safeguard for init.
+    if (initConnector === prevInitConnector && initSchema === prevInitSchema) {
+      return;
+    }
+    prevInitConnector = initConnector;
+    prevInitSchema = initSchema;
+    void init(prevInitConnector, prevInitSchema);
+  });
 
   const runtimeClient = useRuntimeClient();
 

web-common/src/features/add-data/manager/AddDataStateManager.svelte.spec.ts

@@ -81,6 +81,7 @@ describe("AddDataStateManager", () => {
           },
           expectedStep: {
             step: AddDataStep.Import,
+            schema: ClickhouseSchema,
             importStep: ImportDataStep.Init,
             config: ClickhouseImportConfig,
           },
@@ -129,6 +130,7 @@ describe("AddDataStateManager", () => {
           },
           expectedStep: {
             step: AddDataStep.Import,
+            schema: ClickhouseSchema,
             importStep: ImportDataStep.Init,
             config: ClickhouseImportConfig,
           },
@@ -163,6 +165,7 @@ describe("AddDataStateManager", () => {
           },
           expectedStep: {
             step: AddDataStep.Import,
+            schema: ClickhouseSchema,
             importStep: ImportDataStep.Init,
             config: ClickhouseImportConfig,
           },

web-common/src/features/add-data/manager/AddDataStateManager.svelte.ts

@@ -59,6 +59,8 @@ export class AddDataStateManager {
   private onStepChange: ((step: AddDataStep) => void) | undefined = undefined;
   private config: AddDataConfig | undefined = undefined;
 
+  private lastTransitionTime: number = 0;
+
   public setCallbacks(
     onDone: (() => void) | undefined,
     onClose: (() => void) | undefined,
@@ -98,7 +100,7 @@ export class AddDataStateManager {
       case AddDataStep.SelectConnector: {
         if (event.type === TransitionEventType.Back) {
           this.popState();
-          return;
+          break;
         }
         if (event.type !== TransitionEventType.SchemaSelected) return;
         const newState = getStepForSchema(event.schema, event.driver);
@@ -115,7 +117,7 @@ export class AddDataStateManager {
             { step: AddDataStep.CreateConnector, schema: this.state.schema },
           );
           this.popState();
-          return;
+          break;
         }
         if (event.type !== TransitionEventType.ConnectorSelected) return;
         const newState = getStepForConnector(
@@ -144,7 +146,7 @@ export class AddDataStateManager {
               },
             );
             this.popState();
-            return;
+            break;
 
           // CreateModel/ExploreConnector =={ImportConfigured event}=> Import
           case TransitionEventType.ImportConfigured:
@@ -190,7 +192,7 @@ export class AddDataStateManager {
           });
           // Can be back to Init/CreateModel/ExploreConnector
           this.popState();
-          return;
+          break;
         }
         if (event.type !== TransitionEventType.Imported) return;
         this.pushState({
@@ -199,44 +201,51 @@ export class AddDataStateManager {
         break;
     }
 
-    switch (this.state.step) {
-      case AddDataStep.CreateConnector:
-        this.fireBehaviourEvent(
-          BehaviourEventAction.ConnectorConfigurationStarted,
-          {
-            step: AddDataStep.CreateConnector,
-            schema: this.state.schema,
-          },
-        );
-        break;
+    if (event.type !== TransitionEventType.Back) {
+      switch (this.state.step) {
+        case AddDataStep.CreateConnector:
+          this.fireBehaviourEvent(
+            BehaviourEventAction.ConnectorConfigurationStarted,
+            {
+              step: AddDataStep.CreateConnector,
+              schema: this.state.schema,
+            },
+          );
+          break;
 
-      case AddDataStep.CreateModel:
-        this.fireBehaviourEvent(
-          BehaviourEventAction.ModelConfigurationStarted,
-          {
-            step: AddDataStep.CreateModel,
-            schema: this.state.schema,
-            connector: this.state.connector,
-          },
-        );
-        break;
+        case AddDataStep.CreateModel:
+          this.fireBehaviourEvent(
+            BehaviourEventAction.ModelConfigurationStarted,
+            {
+              step: AddDataStep.CreateModel,
+              schema: this.state.schema,
+              connector: this.state.connector,
+            },
+          );
+          break;
 
-      case AddDataStep.ExploreConnector:
-        this.fireBehaviourEvent(BehaviourEventAction.ConnectorExploreStarted, {
-          step: AddDataStep.Import,
-          schema: this.state.schema,
-          connector: this.state.connector,
-        });
-        break;
+        case AddDataStep.ExploreConnector:
+          this.fireBehaviourEvent(
+            BehaviourEventAction.ConnectorExploreStarted,
+            {
+              step: AddDataStep.Import,
+              schema: this.state.schema,
+              connector: this.state.connector,
+            },
+          );
+          break;
 
-      case AddDataStep.Import:
-        this.fireBehaviourEvent(BehaviourEventAction.ImportStarted, {
-          step: AddDataStep.Import,
-          schema: this.state.schema,
-          connector: this.state.config.connector,
-        });
-        break;
+        case AddDataStep.Import:
+          this.fireBehaviourEvent(BehaviourEventAction.ImportStarted, {
+            step: AddDataStep.Import,
+            schema: this.state.schema,
+            connector: this.state.config.connector,
+          });
+          break;
+      }
     }
+
+    this.lastTransitionTime = Date.now();
   }
 
   private pushState(state: AddDataState) {
@@ -252,6 +261,8 @@ export class AddDataStateManager {
     this.state = this.stateStack.pop() ?? { step: AddDataStep.Init };
     if (this.stateStack.length === 0) this.onClose?.();
     this.onStepChange?.(this.state.step);
+
+    this.lastTransitionTime = Date.now();
   }
 
   // For lateral state change, going back is not supported.
@@ -265,12 +276,15 @@ export class AddDataStateManager {
     fields: AddDataBehaviourEventFields,
   ) {
     if (!this.config) return;
+    const duration = this.lastTransitionTime
+      ? Date.now() - this.lastTransitionTime
+      : 0;
     void behaviourEvent?.fireAddDataStepEvent(
       action,
       this.config.medium,
       this.config.space,
       this.config.screen,
-      fields,
+      { ...fields, duration },
     );
   }
 }

web-common/src/features/add-data/manager/GenerateDashboardStatus.svelte

@@ -83,8 +83,8 @@
       void errorEventHandler?.fireAddDataErrorEvent(
         config.space,
         config.screen,
-        importAddDataStep.config.connector,
         importStep,
+        importAddDataStep.config.connector,
         error!,
       );
     }

web-common/src/features/add-data/manager/steps/import.ts

@@ -64,6 +64,7 @@ export async function runImportSteps(
         break;
     }
   }
+  fireImportStepEvent(addDataConfig, addDataStep, ImportDataStep.Done);
   onProgress(ImportDataStep.Done, undefined);
 }
 

web-common/src/features/entity-management/add/AddAssetButton.svelte

@@ -15,11 +15,7 @@
   import { getScreenNameFromPage } from "@rilldata/web-common/features/file-explorer/telemetry.ts";
   import GenerateSampleData from "@rilldata/web-common/features/sample-data/GenerateSampleData.svelte";
   import CaretDownIcon from "../../../components/icons/CaretDownIcon.svelte";
-  import { behaviourEvent } from "../../../metrics/initMetrics.ts";
-  import {
-    BehaviourEventAction,
-    BehaviourEventMedium,
-  } from "../../../metrics/service/BehaviourEventTypes.ts";
+  import { BehaviourEventMedium } from "../../../metrics/service/BehaviourEventTypes.ts";
   import {
     MetricsEventScreenName,
     MetricsEventSpace,

web-common/src/metrics/ErrorEventHandler.ts

@@ -126,9 +126,9 @@ export class ErrorEventHandler {
       this.commonUserMetrics,
       space,
       screen_name,
-      code,
       step,
       schema,
+      code,
     ]);
   }
 

web-common/src/metrics/service/ErrorEventFactory.ts

@@ -86,22 +86,22 @@ export class ErrorEventFactory extends MetricsEventFactory {
     commonUserFields: CommonUserFields,
     space: MetricsEventSpace,
     screen_name: MetricsEventScreenName,
-    error_code: SourceErrorCodes,
     step: string,
     schema: string,
+    error_code: SourceErrorCodes,
   ) {
     const event = this.getBaseMetricsEvent(
       "error",
-      ErrorEventAction.SourceError,
+      ErrorEventAction.ConnectorError,
       commonFields,
       commonUserFields,
     ) as AddDataErrorEvent;
     event.action = ErrorEventAction.SourceError;
     event.space = space;
     event.screen_name = screen_name;
-    event.error_code = error_code;
     event.step = step;
     event.schema = schema;
+    event.error_code = error_code;
     return event;
   }
 

web-local/src/routes/(misc)/welcome/+page.svelte

@@ -14,8 +14,10 @@
     MetricsEventScreenName,
     MetricsEventSpace,
   } from "@rilldata/web-common/metrics/service/MetricsTypes.ts";
+  import { waitUntil } from "@rilldata/web-common/lib/waitUtils.ts";
 
-  onMount(() => {
+  onMount(async () => {
+    await waitUntil(() => !!behaviourEvent);
     void behaviourEvent?.fireAddDataStepEvent(
       BehaviourEventAction.WelcomePageViewed,
       BehaviourEventMedium.Card,