[WEB-4405] chore: profile settings events (#7313)

* feat: event tracker helper * feat: track click events for `data-ph-element` * fix: handled click events * fix: handled name * chore: tracker element updates * chore: remove export * chore: tracker element type * chore: track element and event helper. * chore: minor improvements * chore: minor refactors * fix: workspace events * fix: added slug * fix: changes nomenclature * fix: nomenclature * chore: update event tracker helper types * fix: data id * refactor: cycle events (#7290) * chore: update event tracker helper types * refactor: cycle events * refactor: cycle events * refactor: cycle event tracker * chore: update tracker elements * chore: check for closest element with data-ph-element attribute --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local> * Refactor module events (#7291) * chore: update event tracker helper types * refactor: cycle events * refactor: cycle events * refactor: cycle event tracker * refactor: module tracker event and element * chore: update tracker element * chore: revert unnecessary changes --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local> * refactor: global views, product tour, notifications, onboarding, users and sidebar related events * chore: member tracker events (#7302) * chore: member-tracker-events * fix: constants * refactor: update event tracker constants * refactor: auth related event trackers (#7306) * Chore: state events (#7307) * chore: state events * fix: refactor * chore: project events (#7305) * chore: project-events * fix: refactor * fix: removed hardcoded values * fix: github redirection event * chore: project page tracker events (#7304) * added events for most page events * refactor: simplify lock button event handling in PageLockControl --------- Co-authored-by: Palanikannan M <akashmalinimurugu@gmail.com> Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com> * chore: minor cleanup and import fixes * refactor: added tracker elements for buttons (#7308) Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com> * fix: event type * refactor: posthog group event * chore: removed instances of event tracker (#7309) * refactor: remove event tracker stores and hooks * refactor: remove event tracker store * fix: build errors * clean up event tracker payloads * chore: profile settings events * fix: refactor --------- Co-authored-by: Prateek Shourya <prateekshourya@Prateeks-MacBook-Pro.local> Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com> Co-authored-by: Palanikannan M <akashmalinimurugu@gmail.com> Co-authored-by: M. Palanikannan <73993394+Palanikannan1437@users.noreply.github.com> Co-authored-by: Vamsi Krishna <46787868+vamsikrishnamathala@users.noreply.github.com> Co-authored-by: sriramveeraghanta <veeraghanta.sriram@gmail.com>
2025-07-10 17:02:06 +05:30 · 2025-07-10 17:02:06 +05:30 · eb4239417a
commit eb4239417a
parent c6fbbfd8cc
11 changed files with 356 additions and 14 deletions
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/api-tokens/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/api-tokens/page.tsx
@ -4,6 +4,7 @@ import React, { useState } from "react";
 import { observer } from "mobx-react";
 import useSWR from "swr";
 // plane imports
+import { PROFILE_SETTINGS_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // component
 import { APITokenService } from "@plane/services";
@ -14,6 +15,7 @@ import { SettingsHeading } from "@/components/settings";
 import { APITokenSettingsLoader } from "@/components/ui";
 import { API_TOKENS_LIST } from "@/constants/fetch-keys";
 // store hooks
+import { captureClick } from "@/helpers/event-tracker.helper";
 import { useWorkspace } from "@/hooks/store";
 import { useResolvedAssetPath } from "@/hooks/use-resolved-asset-path";
 // services
@ -53,7 +55,12 @@ const ApiTokensPage = observer(() => {
              description={t("account_settings.api_tokens.description")}
              button={{
                label: t("workspace_settings.settings.api_tokens.add_token"),
-                onClick: () => setIsCreateTokenModalOpen(true),
+                onClick: () => {
+                  captureClick({
+                    elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.HEADER_ADD_PAT_BUTTON,
+                  });
+                  setIsCreateTokenModalOpen(true);
+                },
              }}
            />
            <div>
@ -69,7 +76,12 @@ const ApiTokensPage = observer(() => {
              description={t("account_settings.api_tokens.description")}
              button={{
                label: t("workspace_settings.settings.api_tokens.add_token"),
-                onClick: () => setIsCreateTokenModalOpen(true),
+                onClick: () => {
+                  captureClick({
+                    elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.HEADER_ADD_PAT_BUTTON,
+                  });
+                  setIsCreateTokenModalOpen(true);
+                },
              }}
            />
            <div className="h-full w-full flex items-center justify-center">
@ -81,7 +93,12 @@ const ApiTokensPage = observer(() => {
                size="md"
                primaryButton={{
                  text: t("workspace_settings.settings.api_tokens.add_token"),
-                  onClick: () => setIsCreateTokenModalOpen(true),
+                  onClick: () => {
+                    captureClick({
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.EMPTY_STATE_ADD_PAT_BUTTON,
+                    });
+                    setIsCreateTokenModalOpen(true);
+                  },
                }}
              />
            </div>
--- a/apps/web/core/components/account/deactivate-account-modal.tsx
+++ b/apps/web/core/components/account/deactivate-account-modal.tsx
@ -3,10 +3,12 @@
 import React, { useState } from "react";
 import { Trash2 } from "lucide-react";
 import { Dialog, Transition } from "@headlessui/react";
+import { PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
 import { Button, TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
+import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useUser } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";

@ -35,6 +37,9 @@ export const DeactivateAccountModal: React.FC<Props> = (props) => {

    await deactivateAccount()
      .then(() => {
+        captureSuccess({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.deactivate_account,
+        });
        setToast({
          type: TOAST_TYPE.SUCCESS,
          title: "Success!",
@ -44,13 +49,16 @@ export const DeactivateAccountModal: React.FC<Props> = (props) => {
        router.push("/");
        handleClose();
      })
-      .catch((err: any) =>
+      .catch((err: any) => {
+        captureError({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.deactivate_account,
+        });
        setToast({
          type: TOAST_TYPE.ERROR,
          title: "Error!",
          message: err?.error,
+        });
      })
-      )
      .finally(() => setIsDeactivating(false));
  };

--- a/apps/web/core/components/api-token/delete-token-modal.tsx
+++ b/apps/web/core/components/api-token/delete-token-modal.tsx
@ -3,6 +3,7 @@
 import { useState, FC } from "react";
 import { mutate } from "swr";
 // types
+import { PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { APITokenService } from "@plane/services";
 import { IApiToken } from "@plane/types";
@ -10,6 +11,7 @@ import { IApiToken } from "@plane/types";
 import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
 // fetch-keys
 import { API_TOKENS_LIST } from "@/constants/fetch-keys";
+import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";

 type Props = {
  isOpen: boolean;
@ -48,6 +50,12 @@ export const DeleteApiTokenModal: FC<Props> = (props) => {
          (prevData) => (prevData ?? []).filter((token) => token.id !== tokenId),
          false
        );
+        captureSuccess({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.pat_deleted,
+          payload: {
+            token: tokenId,
+          },
+        });

        handleClose();
      })
@ -58,6 +66,15 @@ export const DeleteApiTokenModal: FC<Props> = (props) => {
          message: err?.message ?? t("workspace_settings.settings.api_tokens.delete.error.message"),
        })
      )
+      .catch((err) => {
+        captureError({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.pat_deleted,
+          payload: {
+            token: tokenId,
+          },
+          error: err as Error,
+        });
+      })
      .finally(() => setDeleteLoading(false));
  };

--- a/apps/web/core/components/api-token/modal/create-token-modal.tsx
+++ b/apps/web/core/components/api-token/modal/create-token-modal.tsx
@ -3,6 +3,7 @@
 import React, { useState } from "react";
 import { mutate } from "swr";
 // types
+import { PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { APITokenService } from "@plane/services";
 import { IApiToken } from "@plane/types";
 // ui
@ -12,6 +13,7 @@ import { renderFormattedDate, csvDownload } from "@plane/utils";
 import { CreateApiTokenForm, GeneratedTokenDetails } from "@/components/api-token";
 // fetch-keys
 import { API_TOKENS_LIST } from "@/constants/fetch-keys";
+import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 // helpers
 // services

@ -66,6 +68,12 @@ export const CreateApiTokenModal: React.FC<Props> = (props) => {
          },
          false
        );
+        captureSuccess({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.pat_created,
+          payload: {
+            token: res.id,
+          },
+        });
      })
      .catch((err) => {
        setToast({
@ -74,6 +82,10 @@ export const CreateApiTokenModal: React.FC<Props> = (props) => {
          message: err.message || err.detail,
        });

+        captureError({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.pat_created,
+        });
+
        throw err;
      });
  };
--- a/apps/web/core/components/api-token/token-list-item.tsx
+++ b/apps/web/core/components/api-token/token-list-item.tsx
@ -2,6 +2,7 @@

 import { useState } from "react";
 import { XCircle } from "lucide-react";
+import { PROFILE_SETTINGS_TRACKER_ELEMENTS } from "@plane/constants";
 import { IApiToken } from "@plane/types";
 // components
 import { Tooltip } from "@plane/ui";
@ -31,6 +32,7 @@ export const ApiTokenListItem: React.FC<Props> = (props) => {
          <button
            onClick={() => setDeleteModalOpen(true)}
            className="absolute right-4 hidden place-items-center group-hover:grid"
+            data-ph-element={PROFILE_SETTINGS_TRACKER_ELEMENTS.LIST_ITEM_DELETE_ICON}
          >
            <XCircle className="h-4 w-4 text-red-500" />
          </button>
--- a/apps/web/core/components/core/theme/custom-theme-selector.tsx
+++ b/apps/web/core/components/core/theme/custom-theme-selector.tsx
@ -4,11 +4,13 @@ import { useMemo } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
 // types
+import { PROFILE_SETTINGS_TRACKER_ELEMENTS, PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { IUserTheme } from "@plane/types";
 // ui
 import { Button, InputColorPicker, setPromiseToast } from "@plane/ui";
 // hooks
+import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
 import { useUserProfile } from "@/hooks/store";

 type TCustomThemeSelector = {
@ -81,6 +83,35 @@ export const CustomThemeSelector: React.FC<TCustomThemeSelector> = observer((pro
        message: () => t("failed_to_update_the_theme"),
      },
    });
+    updateCurrentUserThemePromise
+      .then(() => {
+        captureElementAndEvent({
+          element: {
+            elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.THEME_DROPDOWN,
+          },
+          event: {
+            eventName: PROFILE_SETTINGS_TRACKER_EVENTS.theme_updated,
+            payload: {
+              theme: payload.theme,
+            },
+            state: "SUCCESS",
+          },
+        });
+      })
+      .catch(() => {
+        captureElementAndEvent({
+          element: {
+            elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.THEME_DROPDOWN,
+          },
+          event: {
+            eventName: PROFILE_SETTINGS_TRACKER_EVENTS.theme_updated,
+            payload: {
+              theme: payload.theme,
+            },
+            state: "ERROR",
+          },
+        });
+      });

    return;
  };
--- a/apps/web/core/components/profile/form.tsx
+++ b/apps/web/core/components/profile/form.tsx
@ -6,6 +6,7 @@ import { Controller, useForm } from "react-hook-form";
 import { ChevronDown, CircleUserRound, InfoIcon } from "lucide-react";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
+import { PROFILE_SETTINGS_TRACKER_ELEMENTS, PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import type { IUser, TUserProfile } from "@plane/types";
 import { Button, Input, TOAST_TYPE, setPromiseToast, setToast } from "@plane/ui";
@ -16,6 +17,7 @@ import { DeactivateAccountModal } from "@/components/account";
 import { ImagePickerPopover, UserImageUploadModal } from "@/components/core";
 // helpers
 // hooks
+import { captureSuccess, captureError } from "@/helpers/event-tracker.helper";
 import { useUser, useUserProfile } from "@/hooks/store";

 type TUserProfileForm = {
@ -135,6 +137,17 @@ export const ProfileForm = observer((props: TProfileFormProps) => {
        message: () => `There was some error in updating your profile. Please try again.`,
      },
    });
+    updateUserAndProfile
+      .then(() => {
+        captureSuccess({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.update_profile,
+        });
+      })
+      .catch(() => {
+        captureError({
+          eventName: PROFILE_SETTINGS_TRACKER_EVENTS.update_profile,
+        });
+      });
  };

  return (
@ -344,7 +357,12 @@ export const ProfileForm = observer((props: TProfileFormProps) => {
          </div>
          <div className="flex flex-col gap-1">
            <div className="flex items-center justify-between pt-6 pb-8">
-              <Button variant="primary" type="submit" loading={isLoading}>
+              <Button
+                variant="primary"
+                type="submit"
+                loading={isLoading}
+                data-ph-element={PROFILE_SETTINGS_TRACKER_ELEMENTS.SAVE_CHANGES_BUTTON}
+              >
                {isLoading ? t("saving") : t("save_changes")}
              </Button>
            </div>
@ -371,7 +389,11 @@ export const ProfileForm = observer((props: TProfileFormProps) => {
                <div className="flex flex-col gap-8">
                  <span className="text-sm tracking-tight">{t("deactivate_account_description")}</span>
                  <div>
-                    <Button variant="danger" onClick={() => setDeactivateAccountModal(true)}>
+                    <Button
+                      variant="danger"
+                      onClick={() => setDeactivateAccountModal(true)}
+                      data-ph-element={PROFILE_SETTINGS_TRACKER_ELEMENTS.DEACTIVATE_ACCOUNT_BUTTON}
+                    >
                      {t("deactivate_account")}
                    </Button>
                  </div>
--- a/apps/web/core/components/profile/notification/email-notification-form.tsx
+++ b/apps/web/core/components/profile/notification/email-notification-form.tsx
@ -2,11 +2,13 @@

 import React, { FC, useEffect } from "react";
 import { Controller, useForm } from "react-hook-form";
+import { PROFILE_SETTINGS_TRACKER_ELEMENTS, PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { IUserEmailNotificationSettings } from "@plane/types";
 // ui
 import { ToggleSwitch, TOAST_TYPE, setToast } from "@plane/ui";
 // services
+import { captureClick, captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { UserService } from "@/services/user.service";
 // types
 interface IEmailNotificationFormProps {
@ -31,6 +33,12 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
      await userService.updateCurrentUserEmailNotificationSettings({
        [key]: value,
      });
+      captureSuccess({
+        eventName: PROFILE_SETTINGS_TRACKER_EVENTS.notifications_updated,
+        payload: {
+          [key]: value,
+        },
+      });
      setToast({
        title: t("success"),
        type: TOAST_TYPE.SUCCESS,
@ -38,6 +46,12 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
      });
    } catch (err) {
      console.error(err);
+      captureError({
+        eventName: PROFILE_SETTINGS_TRACKER_EVENTS.notifications_updated,
+        payload: {
+          [key]: value,
+        },
+      });
      setToast({
        title: t("error"),
        type: TOAST_TYPE.ERROR,
@ -68,6 +82,9 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
                  value={value}
                  onChange={(newValue) => {
                    onChange(newValue);
+                    captureClick({
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.PROPERTY_CHANGES_TOGGLE,
+                    });
                    handleSettingChange("property_change", newValue);
                  }}
                  size="sm"
@ -90,6 +107,9 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
                  value={value}
                  onChange={(newValue) => {
                    onChange(newValue);
+                    captureClick({
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.STATE_CHANGES_TOGGLE,
+                    });
                    handleSettingChange("state_change", newValue);
                  }}
                  size="sm"
@ -134,6 +154,9 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
                  value={value}
                  onChange={(newValue) => {
                    onChange(newValue);
+                    captureClick({
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.COMMENTS_TOGGLE,
+                    });
                    handleSettingChange("comment", newValue);
                  }}
                  size="sm"
@ -156,6 +179,9 @@ export const EmailNotificationForm: FC<IEmailNotificationFormProps> = (props) =>
                  value={value}
                  onChange={(newValue) => {
                    onChange(newValue);
+                    captureClick({
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.MENTIONS_TOGGLE,
+                    });
                    handleSettingChange("mention", newValue);
                  }}
                  size="sm"
--- a/apps/web/core/components/profile/preferences/language-timezone.tsx
+++ b/apps/web/core/components/profile/preferences/language-timezone.tsx
@ -1,7 +1,9 @@
 import { observer } from "mobx-react";
+import { PROFILE_SETTINGS_TRACKER_ELEMENTS, PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { SUPPORTED_LANGUAGES, useTranslation } from "@plane/i18n";
 import { CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
 import { TimezoneSelect } from "@/components/global";
+import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
 import { useUser, useUserProfile } from "@/hooks/store";

 export const LanguageTimezone = observer(() => {
@ -17,6 +19,18 @@ export const LanguageTimezone = observer(() => {
  const handleTimezoneChange = (value: string) => {
    updateCurrentUser({ user_timezone: value })
      .then(() => {
+        captureElementAndEvent({
+          element: {
+            elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.TIMEZONE_DROPDOWN,
+          },
+          event: {
+            eventName: PROFILE_SETTINGS_TRACKER_EVENTS.timezone_updated,
+            payload: {
+              timezone: value,
+            },
+            state: "SUCCESS",
+          },
+        });
        setToast({
          title: "Success!",
          message: "Timezone updated successfully",
@ -24,6 +38,15 @@ export const LanguageTimezone = observer(() => {
        });
      })
      .catch(() => {
+        captureElementAndEvent({
+          element: {
+            elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.TIMEZONE_DROPDOWN,
+          },
+          event: {
+            eventName: PROFILE_SETTINGS_TRACKER_EVENTS.timezone_updated,
+            state: "ERROR",
+          },
+        });
        setToast({
          title: "Error!",
          message: "Failed to update timezone",
@ -34,6 +57,18 @@ export const LanguageTimezone = observer(() => {
  const handleLanguageChange = (value: string) => {
    updateUserProfile({ language: value })
      .then(() => {
+        captureElementAndEvent({
+          element: {
+            elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.LANGUAGE_DROPDOWN,
+          },
+          event: {
+            eventName: PROFILE_SETTINGS_TRACKER_EVENTS.language_updated,
+            payload: {
+              language: value,
+            },
+            state: "SUCCESS",
+          },
+        });
        setToast({
          title: "Success!",
          message: "Language updated successfully",
@ -41,6 +76,15 @@ export const LanguageTimezone = observer(() => {
        });
      })
      .catch(() => {
+        captureElementAndEvent({
+          element: {
+            elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.LANGUAGE_DROPDOWN,
+          },
+          event: {
+            eventName: PROFILE_SETTINGS_TRACKER_EVENTS.language_updated,
+            state: "ERROR",
+          },
+        });
        setToast({
          title: "Error!",
          message: "Failed to update language",
--- a/apps/web/core/components/profile/start-of-week-preference.tsx
+++ b/apps/web/core/components/profile/start-of-week-preference.tsx
@ -3,10 +3,15 @@
 import React from "react";
 import { observer } from "mobx-react";
 // plane imports
-import { START_OF_THE_WEEK_OPTIONS } from "@plane/constants";
+import {
+  PROFILE_SETTINGS_TRACKER_ELEMENTS,
+  PROFILE_SETTINGS_TRACKER_EVENTS,
+  START_OF_THE_WEEK_OPTIONS,
+} from "@plane/constants";
 import { EStartOfTheWeek } from "@plane/types";
 import { CustomSelect, setToast, TOAST_TYPE } from "@plane/ui";
 // hooks
+import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
 import { useUserProfile } from "@/hooks/store";
 import { PreferencesSection } from "../preferences/section";

@ -29,6 +34,18 @@ export const StartOfWeekPreference = observer((props: { option: { title: string;
            onChange={(val: number) => {
              updateUserProfile({ start_of_the_week: val })
                .then(() => {
+                  captureElementAndEvent({
+                    element: {
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.FIRST_DAY_OF_WEEK_DROPDOWN,
+                    },
+                    event: {
+                      eventName: PROFILE_SETTINGS_TRACKER_EVENTS.first_day_updated,
+                      payload: {
+                        start_of_the_week: val,
+                      },
+                      state: "SUCCESS",
+                    },
+                  });
                  setToast({
                    type: TOAST_TYPE.SUCCESS,
                    title: "Success",
@ -36,6 +53,15 @@ export const StartOfWeekPreference = observer((props: { option: { title: string;
                  });
                })
                .catch(() => {
+                  captureElementAndEvent({
+                    element: {
+                      elementName: PROFILE_SETTINGS_TRACKER_ELEMENTS.FIRST_DAY_OF_WEEK_DROPDOWN,
+                    },
+                    event: {
+                      eventName: PROFILE_SETTINGS_TRACKER_EVENTS.first_day_updated,
+                      state: "ERROR",
+                    },
+                  });
                  setToast({ type: TOAST_TYPE.ERROR, title: "Update failed", message: "Please try again later." });
                });
            }}
--- a/packages/constants/src/event-tracker/core.ts
+++ b/packages/constants/src/event-tracker/core.ts
@ -1,22 +1,34 @@
 import { EProductSubscriptionEnum } from "@plane/types";

-// Dashboard Events
+/**
+ * ===========================================================================
+ * Event Groups
+ * ===========================================================================
+ */
+export const GROUP_WORKSPACE_TRACKER_EVENT = "workspace_metrics";
 export const GITHUB_REDIRECTED_TRACKER_EVENT = "github_redirected";
 export const HEADER_GITHUB_ICON = "header_github_icon";

-// Groups
-export const GROUP_WORKSPACE_TRACKER_EVENT = "workspace_metrics";
-
-// Command palette tracker
+/**
+ * ===========================================================================
+ * Command palette tracker
+ * ===========================================================================
+ */
 export const COMMAND_PALETTE_TRACKER_ELEMENTS = {
  COMMAND_PALETTE_SHORTCUT_KEY: "command_palette_shortcut_key",
 };

+/**
+ * ===========================================================================
+ * Workspace Events and Elements
+ * ===========================================================================
+ */
 export const WORKSPACE_TRACKER_EVENTS = {
  create: "workspace_created",
  update: "workspace_updated",
  delete: "workspace_deleted",
 };
+
 export const WORKSPACE_TRACKER_ELEMENTS = {
  DELETE_WORKSPACE_BUTTON: "delete_workspace_button",
  ONBOARDING_CREATE_WORKSPACE_BUTTON: "onboarding_create_workspace_button",
@ -24,11 +36,17 @@ export const WORKSPACE_TRACKER_ELEMENTS = {
  UPDATE_WORKSPACE_BUTTON: "update_workspace_button",
 };

+/**
+ * ===========================================================================
+ * Project Events and Elements
+ * ===========================================================================
+ */
 export const PROJECT_TRACKER_EVENTS = {
  create: "project_created",
  update: "project_updated",
  delete: "project_deleted",
 };
+
 export const PROJECT_TRACKER_ELEMENTS = {
  EXTENDED_SIDEBAR_ADD_BUTTON: "extended_sidebar_add_project_button",
  SIDEBAR_CREATE_PROJECT_BUTTON: "sidebar_create_project_button",
@ -44,6 +62,11 @@ export const PROJECT_TRACKER_ELEMENTS = {
  TOGGLE_FEATURE: "toggle_project_feature",
 };

+/**
+ * ===========================================================================
+ * Cycle Events and Elements
+ * ===========================================================================
+ */
 export const CYCLE_TRACKER_EVENTS = {
  create: "cycle_created",
  update: "cycle_updated",
@ -53,6 +76,7 @@ export const CYCLE_TRACKER_EVENTS = {
  archive: "cycle_archived",
  restore: "cycle_restored",
 };
+
 export const CYCLE_TRACKER_ELEMENTS = {
  RIGHT_HEADER_ADD_BUTTON: "right_header_add_cycle_button",
  EMPTY_STATE_ADD_BUTTON: "empty_state_add_cycle_button",
@ -63,6 +87,11 @@ export const CYCLE_TRACKER_ELEMENTS = {
  LIST_ITEM: "cycle_list_item",
 } as const;

+/**
+ * ===========================================================================
+ * Module Events and Elements
+ * ===========================================================================
+ */
 export const MODULE_TRACKER_EVENTS = {
  create: "module_created",
  update: "module_updated",
@ -77,6 +106,7 @@ export const MODULE_TRACKER_EVENTS = {
    delete: "module_link_deleted",
  },
 };
+
 export const MODULE_TRACKER_ELEMENTS = {
  RIGHT_HEADER_ADD_BUTTON: "right_header_add_module_button",
  EMPTY_STATE_ADD_BUTTON: "empty_state_add_module_button",
@ -88,6 +118,11 @@ export const MODULE_TRACKER_ELEMENTS = {
  CARD_ITEM: "module_card_item",
 } as const;

+/**
+ * ===========================================================================
+ * Work Item Events and Elements
+ * ===========================================================================
+ */
 export const WORK_ITEM_TRACKER_EVENTS = {
  create: "work_item_created",
  add_existing: "work_item_add_existing",
@ -145,6 +180,11 @@ export const WORK_ITEM_TRACKER_ELEMENTS = {
  },
 } as const;

+/**
+ * ===========================================================================
+ * State Events and Elements
+ * ===========================================================================
+ */
 export const STATE_TRACKER_EVENTS = {
  create: "state_created",
  update: "state_updated",
@ -156,6 +196,11 @@ export const STATE_TRACKER_ELEMENTS = {
  STATE_LIST_EDIT_BUTTON: "state_list_edit_button",
 };

+/**
+ * ===========================================================================
+ * Project Page Events and Elements
+ * ===========================================================================
+ */
 export const PROJECT_PAGE_TRACKER_EVENTS = {
  create: "project_page_created",
  update: "project_page_updated",
@ -184,6 +229,11 @@ export const PROJECT_PAGE_TRACKER_ELEMENTS = {
  DUPLICATE_BUTTON: "page_duplicate_button",
 } as const;

+/**
+ * ===========================================================================
+ * Member Events and Elements
+ * ===========================================================================
+ */
 export const MEMBER_TRACKER_EVENTS = {
  invite: "member_invited",
  accept: "member_accepted",
@ -206,6 +256,11 @@ export const MEMBER_TRACKER_ELEMENTS = {
  WORKSPACE_INVITATIONS_LIST_CONTEXT_MENU: "workspace_invitations_list_context_menu",
 } as const;

+/**
+ * ===========================================================================
+ * Auth Events and Elements
+ * ===========================================================================
+ */
 export const AUTH_TRACKER_EVENTS = {
  code_verify: "code_verified",
  sign_up_with_password: "sign_up_with_password",
@ -213,6 +268,7 @@ export const AUTH_TRACKER_EVENTS = {
  forgot_password: "forgot_password_clicked",
  new_code_requested: "new_code_requested",
 };
+
 export const AUTH_TRACKER_ELEMENTS = {
  NAVIGATE_TO_SIGN_UP: "navigate_to_sign_up",
  FORGOT_PASSWORD_FROM_SIGNIN: "forgot_password_from_signin",
@ -223,12 +279,18 @@ export const AUTH_TRACKER_ELEMENTS = {
  VERIFY_CODE: "verify_code",
 };

+/**
+ * ===========================================================================
+ * Global View Events and Elements
+ * ===========================================================================
+ */
 export const GLOBAL_VIEW_TRACKER_EVENTS = {
  create: "global_view_created",
  update: "global_view_updated",
  delete: "global_view_deleted",
  open: "global_view_opened",
 };
+
 export const GLOBAL_VIEW_TRACKER_ELEMENTS = {
  RIGHT_HEADER_ADD_BUTTON: "global_view_right_header_add_button",
  HEADER_SAVE_VIEW_BUTTON: "global_view_header_save_view_button",
@ -236,15 +298,26 @@ export const GLOBAL_VIEW_TRACKER_ELEMENTS = {
  LIST_ITEM: "global_view_list_item",
 };

+/**
+ * ===========================================================================
+ * Product Tour Events and Elements
+ * ===========================================================================
+ */
 export const PRODUCT_TOUR_TRACKER_EVENTS = {
  complete: "product_tour_completed",
 };
+
 export const PRODUCT_TOUR_TRACKER_ELEMENTS = {
  START_BUTTON: "product_tour_start_button",
  SKIP_BUTTON: "product_tour_skip_button",
  CREATE_PROJECT_BUTTON: "product_tour_create_project_button",
 };

+/**
+ * ===========================================================================
+ * Notification Events and Elements
+ * ===========================================================================
+ */
 export const NOTIFICATION_TRACKER_EVENTS = {
  archive: "notification_archived",
  unarchive: "notification_unarchived",
@ -252,25 +325,88 @@ export const NOTIFICATION_TRACKER_EVENTS = {
  mark_unread: "notification_marked_unread",
  all_marked_read: "all_notifications_marked_read",
 };
+
 export const NOTIFICATION_TRACKER_ELEMENTS = {
  MARK_ALL_AS_READ_BUTTON: "mark_all_as_read_button",
  ARCHIVE_UNARCHIVE_BUTTON: "archive_unarchive_button",
  MARK_READ_UNREAD_BUTTON: "mark_read_unread_button",
 };

+/**
+ * ===========================================================================
+ * User Events
+ * ===========================================================================
+ */
 export const USER_TRACKER_EVENTS = {
  add_details: "user_details_added",
  onboarding_complete: "user_onboarding_completed",
 };
+
+/**
+ * ===========================================================================
+ * Onboarding Events and Elements
+ * ===========================================================================
+ */
 export const ONBOARDING_TRACKER_ELEMENTS = {
  PROFILE_SETUP_FORM: "onboarding_profile_setup_form",
 };

+/**
+ * ===========================================================================
+ * Sidebar Events
+ * ===========================================================================
+ */
 export const SIDEBAR_TRACKER_ELEMENTS = {
  USER_MENU_ITEM: "sidenav_user_menu_item",
  CREATE_WORK_ITEM_BUTTON: "sidebar_create_work_item_button",
 };

+/**
+ * ===========================================================================
+ * Profile Settings Events and Elements
+ * ===========================================================================
+ */
+export const PROFILE_SETTINGS_TRACKER_EVENTS = {
+  // Account
+  deactivate_account: "deactivate_account",
+  update_profile: "update_profile",
+  // Preferences
+  first_day_updated: "first_day_updated",
+  language_updated: "language_updated",
+  timezone_updated: "timezone_updated",
+  theme_updated: "theme_updated",
+  // Notifications
+  notifications_updated: "notifications_updated",
+  // PAT
+  pat_created: "pat_created",
+  pat_deleted: "pat_deleted",
+};
+
+export const PROFILE_SETTINGS_TRACKER_ELEMENTS = {
+  // Account
+  SAVE_CHANGES_BUTTON: "save_changes_button",
+  DEACTIVATE_ACCOUNT_BUTTON: "deactivate_account_button",
+  // Preferences
+  THEME_DROPDOWN: "preferences_theme_dropdown",
+  FIRST_DAY_OF_WEEK_DROPDOWN: "preferences_first_day_of_week_dropdown",
+  LANGUAGE_DROPDOWN: "preferences_language_dropdown",
+  TIMEZONE_DROPDOWN: "preferences_timezone_dropdown",
+  // Notifications
+  PROPERTY_CHANGES_TOGGLE: "notifications_property_changes_toggle",
+  STATE_CHANGES_TOGGLE: "notifications_state_changes_toggle",
+  COMMENTS_TOGGLE: "notifications_comments_toggle",
+  MENTIONS_TOGGLE: "notifications_mentions_toggle",
+  // PAT
+  HEADER_ADD_PAT_BUTTON: "header_add_pat_button",
+  EMPTY_STATE_ADD_PAT_BUTTON: "empty_state_add_pat_button",
+  LIST_ITEM_DELETE_ICON: "list_item_delete_icon",
+};
+
+/**
+ * ===========================================================================
+ * Workspace Settings Events and Elements
+ * ===========================================================================
+ */
 export const WORKSPACE_SETTINGS_TRACKER_EVENTS = {
  // Billing
  upgrade_plan_redirected: "upgrade_plan_redirected",
@ -283,6 +419,7 @@ export const WORKSPACE_SETTINGS_TRACKER_EVENTS = {
  webhook_details_page_toggled: "webhook_details_page_toggled",
  webhook_updated: "webhook_updated",
 };
+
 export const WORKSPACE_SETTINGS_TRACKER_ELEMENTS = {
  // Billing
  BILLING_UPGRADE_BUTTON: (subscriptionType: EProductSubscriptionEnum) => `billing_upgrade_${subscriptionType}_button`,