chore: Analytics util refactor

app/client/package.json

@@ -88,6 +88,7 @@
     "@redux-saga/core": "1.1.3",
     "@redux-saga/types": "1.2.1",
     "@reduxjs/toolkit": "^2.4.0",
+    "@segment/analytics-next": "^1.76.0",
     "@sentry/react": "^6.2.4",
     "@shared/ast": "workspace:^",
     "@shared/dsl": "workspace:^",

app/client/public/index.html

@@ -39,7 +39,6 @@
           return result;
         };
         const CLOUD_HOSTING = parseConfig('{{env "APPSMITH_CLOUD_HOSTING"}}');
-        const ZIPY_KEY = parseConfig('{{env "APPSMITH_ZIPY_SDK_KEY"}}');
         const AIRGAPPED = parseConfig('{{env "APPSMITH_AIRGAP_ENABLED"}}');
         const REO_CLIENT_ID = parseConfig('{{env "APPSMITH_REO_CLIENT_ID"}}');
       </script>
@@ -64,21 +63,6 @@
         })()
           %>
     </script>
-    <script>
-      if (CLOUD_HOSTING && ZIPY_KEY) {
-        const script = document.createElement("script");
-        script.crossOrigin = "anonymous";
-        script.defer = true;
-        script.src = "https://cdn.zipy.ai/sdk/v1.0/zipy.min.umd.js";
-        script.onload = () => {
-          window.zipy && window.zipy.init(ZIPY_KEY);
-        };
-        const head = document.getElementsByTagName("head")[0];
-        head && head.appendChild(script);
-      }
-
-
-    </script>
 
     <!-- Start of Reo Javascript -->
     <script type="text/javascript">

app/client/src/api/interceptors/request/addAnonymousUserIdHeader.ts

@@ -1,8 +1,9 @@
 import type { InternalAxiosRequestConfig } from "axios";
+import type { ID } from "@segment/analytics-next";
 
 export const addAnonymousUserIdHeader = (
   config: InternalAxiosRequestConfig,
-  options: { anonymousId?: string; segmentEnabled?: boolean },
+  options: { anonymousId: ID; segmentEnabled?: boolean },
 ) => {
   const { anonymousId, segmentEnabled } = options;
 

app/client/src/ce/sagas/analyticsSaga.ts

@@ -1,4 +1,3 @@
-import { getCurrentUser } from "selectors/usersSelectors";
 import { getInstanceId } from "ee/selectors/tenantSelectors";
 import { call, select } from "redux-saga/effects";
 import type { APP_MODE } from "entities/App";
@@ -10,44 +9,37 @@ import AnalyticsUtil from "ee/utils/AnalyticsUtil";
 import { getAppMode } from "ee/selectors/entitiesSelector";
 import type { AppState } from "ee/reducers";
 import { getWidget } from "sagas/selectors";
-import { getUserSource } from "ee/utils/AnalyticsUtil";
 import { getCurrentApplication } from "ee/selectors/applicationSelectors";
 
-export interface UserAndAppDetails {
+export interface AppDetails {
   pageId: string;
   appId: string;
   appMode: APP_MODE | undefined;
   appName: string;
   isExampleApp: boolean;
-  userId: string;
-  email: string;
-  source: string;
   instanceId: string;
 }
 
-export function* getUserAndAppDetails() {
+export function* getAppDetails() {
   const appMode: ReturnType<typeof getAppMode> = yield select(getAppMode);
   const currentApp: ReturnType<typeof getCurrentApplication> = yield select(
     getCurrentApplication,
   );
-  const user: ReturnType<typeof getCurrentUser> = yield select(getCurrentUser);
   const instanceId: ReturnType<typeof getInstanceId> =
     yield select(getInstanceId);
   const pageId: ReturnType<typeof getCurrentPageId> =
     yield select(getCurrentPageId);
-  const userAndAppDetails: UserAndAppDetails = {
+
+  const appDetails: AppDetails = {
     pageId,
     appId: currentApp?.id || "",
     appMode,
     appName: currentApp?.name || "",
     isExampleApp: currentApp?.appIsExample || false,
-    userId: user?.username || "",
-    email: user?.email || "",
-    source: getUserSource(),
     instanceId: instanceId,
   };
 
-  return userAndAppDetails;
+  return appDetails;
 }
 export function* logDynamicTriggerExecution({
   dynamicTrigger,
@@ -65,13 +57,10 @@ export function* logDynamicTriggerExecution({
     appId,
     appMode,
     appName,
-    email,
     instanceId,
     isExampleApp,
     pageId,
-    source,
-    userId,
-  }: UserAndAppDetails = yield call(getUserAndAppDetails);
+  }: AppDetails = yield call(getAppDetails);
   const widget: ReturnType<typeof getWidget> | undefined = yield select(
     (state: AppState) => getWidget(state, triggerMeta.source?.id || ""),
   );
@@ -89,12 +78,6 @@ export function* logDynamicTriggerExecution({
     appMode,
     appName,
     isExampleApp,
-    userData: {
-      userId,
-      email,
-      appId,
-      source,
-    },
     widgetName: widget?.widgetName,
     widgetType: widget?.type,
     propertyName: triggerMeta.triggerPropertyName,
@@ -114,12 +97,6 @@ export function* logDynamicTriggerExecution({
       appMode,
       appName,
       isExampleApp,
-      userData: {
-        userId,
-        email,
-        appId,
-        source,
-      },
       widgetName: widget?.widgetName,
       widgetType: widget?.type,
       propertyName: triggerMeta.triggerPropertyName,

app/client/src/ce/sagas/userSagas.tsx

@@ -57,7 +57,6 @@ import {
   getFirstTimeUserOnboardingApplicationIds,
   getFirstTimeUserOnboardingIntroModalVisibility,
 } from "utils/storage";
-import { initializeAnalyticsAndTrackers } from "utils/AppsmithUtils";
 import { getAppsmithConfigs } from "ee/configs";
 import { getSegmentState } from "selectors/analyticsSelectors";
 import {
@@ -134,13 +133,11 @@ export function* getCurrentUserSaga(action?: {
 }
 
 function* initTrackers(currentUser: User) {
-  const initializeSentry = initializeAnalyticsAndTrackers(currentUser);
-
-  const sentryInitialized: boolean = yield initializeSentry;
-
-  if (sentryInitialized) {
+  try {
+    yield call(AnalyticsUtil.initialize, currentUser);
     yield put(segmentInitSuccess());
-  } else {
+  } catch (e) {
+    log.error(e);
     yield put(segmentInitUncertain());
   }
 }

app/client/src/ce/utils/Analytics/trackedUser.ts

@@ -0,0 +1,115 @@
+import { ANONYMOUS_USERNAME, type User } from "constants/userConstants";
+import { getAppsmithConfigs } from "ee/configs";
+import { sha256 } from "js-sha256";
+
+interface TrackedUserProperties {
+  userId: string;
+  source: string;
+  email?: string;
+  name?: string;
+  emailVerified?: boolean;
+}
+
+/**
+ * Function to get the application id from the URL
+ * @param location current location object based on URL
+ * @returns application id
+ */
+export function getApplicationId(location: Location) {
+  const pathSplit = location.pathname.split("/");
+  const applicationsIndex = pathSplit.findIndex(
+    (path) => path === "applications",
+  );
+
+  if (applicationsIndex === -1 || applicationsIndex + 1 >= pathSplit.length) {
+    return undefined;
+  }
+
+  return pathSplit[applicationsIndex + 1];
+}
+
+class TrackedUser {
+  private static instance: TrackedUser;
+  private readonly user: User;
+  private readonly userId: string;
+  public readonly selfHosted: boolean;
+
+  protected constructor(user: User) {
+    this.user = user;
+    const { cloudHosting, segment } = getAppsmithConfigs();
+
+    this.selfHosted = !(segment.apiKey || cloudHosting);
+
+    if (this.selfHosted) {
+      this.userId = sha256(user.username);
+    } else {
+      this.userId = user.username;
+    }
+  }
+
+  static init(user: User) {
+    if (!TrackedUser.instance) {
+      TrackedUser.instance = new TrackedUser(user);
+    }
+  }
+
+  static getInstance(): TrackedUser {
+    if (!TrackedUser.instance) {
+      throw new Error("TrackedUser is not initialized. Call init() first.");
+    }
+
+    return TrackedUser.instance;
+  }
+
+  protected getUserSource(): string {
+    return this.selfHosted ? "ce" : "cloud";
+  }
+
+  public getUser(): TrackedUserProperties {
+    if (this.selfHosted) {
+      return this.getAnonymousUserDetails();
+    } else {
+      return this.getAllUserDetails();
+    }
+  }
+
+  public getEventUserProperties() {
+    const { email, userId } = this.getUser();
+
+    if (this.userId === ANONYMOUS_USERNAME) {
+      return undefined;
+    }
+
+    const appId = getApplicationId(window.location);
+
+    return {
+      userId,
+      email,
+      appId: this.selfHosted ? undefined : appId,
+    };
+  }
+
+  private getAllUserDetails() {
+    const { email, emailVerified, name } = this.user;
+    const source = this.getUserSource();
+
+    return {
+      userId: this.userId,
+      source,
+      email,
+      name,
+      emailVerified,
+    };
+  }
+
+  private getAnonymousUserDetails() {
+    const source = this.getUserSource();
+
+    return {
+      userId: this.userId,
+      source,
+    };
+  }
+}
+
+export default TrackedUser;