diff --git a/src/components/Main/Authentication/index.tsx b/src/components/Main/Authentication/index.tsx index bff2594bb..796eb1209 100644 --- a/src/components/Main/Authentication/index.tsx +++ b/src/components/Main/Authentication/index.tsx @@ -1,9 +1,11 @@ -import { forwardRef, useState } from "react"; +import { forwardRef, useEffect, useState } from "react"; import { SLACK_WORKSPACE_URL } from "../../../constants"; import { openURLInDefaultBrowser } from "../../../utils/actions/openURLInDefaultBrowser"; +import { sendTrackingEvent } from "../../../utils/actions/sendTrackingEvent"; import { SlackLogoIcon } from "../../common/icons/16px/SlackLogoIcon"; import { DigmaLoginLogo } from "../../common/icons/DigmaLoginLogo"; import { Toggle } from "../../common/v3/Toggle"; +import { trackingEvents } from "../tracking"; import { Login } from "./Login"; import { Registration } from "./Registration"; import * as s from "./styles"; @@ -30,6 +32,10 @@ const AuthenticationComponent = () => { setLoginSuccessMessage(""); }; + useEffect(() => { + sendTrackingEvent(trackingEvents.LOGIN_SCREEN_VIEWED); + }, []); + return ( diff --git a/src/components/Main/index.tsx b/src/components/Main/index.tsx index d13940e64..3e4aeb6fe 100644 --- a/src/components/Main/index.tsx +++ b/src/components/Main/index.tsx @@ -5,7 +5,10 @@ import { history } from "../../containers/Main/history"; import { useGlobalStore } from "../../containers/Main/stores/useGlobalStore"; import { dispatcher } from "../../dispatcher"; import { HistoryEntryLocation } from "../../history/History"; +import { usePrevious } from "../../hooks/usePrevious"; import { logger } from "../../logging"; +import { trackingEvents as globalTrackingEvents } from "../../trackingEvents"; +import { sendTrackingEvent } from "../../utils/actions/sendTrackingEvent"; import { Navigation } from "../Navigation"; import { TAB_IDS } from "../Navigation/Tabs/types"; import { Scope } from "../common/App/types"; @@ -44,6 +47,8 @@ export const Main = () => { const environment = useGlobalStore.use.environment(); const scope = useGlobalStore.use.scope(); const userInfo = useGlobalStore.use.userInfo(); + const userId = userInfo?.id; + const previousUserId = usePrevious(userId); const backendInfo = useGlobalStore.use.backendInfo(); const { goTo } = useHistory(); const updateBrowserLocation = useBrowserLocationUpdater(); @@ -159,9 +164,17 @@ export const Main = () => { window.sendMessageToDigma({ action: actions.INITIALIZE }); - }, [userInfo?.id]); + }, [userId]); - if (!userInfo?.id && backendInfo?.centralize) { + useEffect(() => { + if (previousUserId !== userId) { + sendTrackingEvent(globalTrackingEvents.USER_ID_CHANGED, { + userId + }); + } + }, [previousUserId, userId]); + + if (!userId && backendInfo?.centralize) { return ; } diff --git a/src/components/Main/tracking.ts b/src/components/Main/tracking.ts index 6724494b8..481df111e 100644 --- a/src/components/Main/tracking.ts +++ b/src/components/Main/tracking.ts @@ -15,7 +15,8 @@ export const trackingEvents = addPrefix( PROMOTION_REGISTRATION_CLOSED_CLICKED: "promotion registration close button clicked", PROMOTION_DISCARDED: "promotion discarded", - PROMOTION_REGISTRATION_OPENED: "promotion registration form opened" + PROMOTION_REGISTRATION_OPENED: "promotion registration form opened", + LOGIN_SCREEN_VIEWED: "login screen viewed" }, " " ); diff --git a/src/trackingEvents.ts b/src/trackingEvents.ts index 4c71f2145..18d306dad 100644 --- a/src/trackingEvents.ts +++ b/src/trackingEvents.ts @@ -5,5 +5,6 @@ export const trackingEvents = { ERROR_SCREEN_REFRESH_BUTTON_CLICKED: "error screen refresh button clicked", PAGINATION_BUTTON_CLICKED: "pagination button clicked", CAROUSEL_NAVIGATION_BUTTON_CLICKED: "carousel navigation button clicked", - CAROUSEL_PAGE_BUTTON_CLICKED: "carousel page button clicked" + CAROUSEL_PAGE_BUTTON_CLICKED: "carousel page button clicked", + USER_ID_CHANGED: "user id changed" };