Skip to content

Commit 37fa4ae

Browse files
Nixieboluodinoallo
authored andcommitted
feat: track gtm v2 events (#5733)
* fix(gtm): delay gtm script load so we can mount script after config init Signed-off-by: Nixieboluo <[email protected]> * feat(desktop): add gtm v2 config and script Signed-off-by: Nixieboluo <[email protected]> * fix(gtm): incorrect literal constraint for event fields Signed-off-by: Nixieboluo <[email protected]> * feat(gtm): type refining for gtm package Signed-off-by: Nixieboluo <[email protected]> * feat(desktop): add gtm v2 event trackers Signed-off-by: Nixieboluo <[email protected]> * feat(applaunchpad): add gtmv2 config and scripts Signed-off-by: Nixieboluo <[email protected]> * feat(applaunchpad): add gtmv2 events Signed-off-by: Nixieboluo <[email protected]> * feat(applaunchpad): add gtmv2 error and paywall event Signed-off-by: Nixieboluo <[email protected]> * fix(desktop): workspace toggle not closed when workspace popup is open Signed-off-by: Nixieboluo <[email protected]> * fix(applaunchpad): missing default config for gtm id Signed-off-by: Nixieboluo <[email protected]> * feat(applaunchpad): add gtmv2 terminal open event Signed-off-by: Nixieboluo <[email protected]> --------- Signed-off-by: Nixieboluo <[email protected]>
1 parent 0ffe1d6 commit 37fa4ae

File tree

30 files changed

+401
-119
lines changed

30 files changed

+401
-119
lines changed

frontend/desktop/data/config.yaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ desktop:
4040
docsUrl: "https://sealos.run/docs/Intro/"
4141
aiAssistantEnabled: false
4242
bannerEnabled: false
43+
gtmId: null
4344
auth:
4445
proxyAddress: ""
4546
callbackURL: "https://127.0.0.1.nip.io/callback"

frontend/desktop/src/components/AppDock/index.tsx

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import { MouseEvent, useContext, useMemo, useRef, useState } from 'react';
1010
import { useContextMenu } from 'react-contexify';
1111
import { ChevronDownIcon } from '../icons';
1212
import { AnimatePresence, motion, useMotionValue, useSpring, useTransform } from 'framer-motion';
13-
import { gtmOpenCostcenter } from '@/utils/gtm';
1413

1514
const APP_DOCK_MENU_ID = 'APP_DOCK_MENU_ID';
1615

@@ -255,9 +254,6 @@ export default function AppDock() {
255254
moreAppsContent?.setShowMoreApps(true);
256255
return;
257256
}
258-
if (item.key === 'system-costcenter') {
259-
gtmOpenCostcenter();
260-
}
261257
if (item.pid === currentAppPid && item.size !== 'minimize') {
262258
updateOpenedAppInfo({
263259
...item,

frontend/desktop/src/components/account/GuideModal.tsx

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import { ArrowLeft, ChevronLeft, ChevronRight, CircleAlert, X } from 'lucide-rea
1616
import { useQuery } from '@tanstack/react-query';
1717
import { UserInfo } from '@/api/auth';
1818
import useSessionStore from '@/stores/session';
19-
import { useCallback } from 'react';
19+
import { useCallback, useEffect } from 'react';
2020
import useAppStore from '@/stores/app';
2121
import {
2222
devboxDriverObj,
@@ -29,6 +29,7 @@ import {
2929
import { WindowSize } from '@/types';
3030
import { Image } from '@chakra-ui/react';
3131
import { useGuideModalStore } from '@/stores/guideModal';
32+
import { track } from '@sealos/gtm';
3233

3334
const GuideModal = () => {
3435
const { t } = useTranslation();
@@ -45,6 +46,15 @@ const GuideModal = () => {
4546
setInitGuide
4647
} = useGuideModalStore();
4748

49+
useEffect(() => {
50+
if (isOpen) {
51+
track('module_open', {
52+
module: 'guide',
53+
trigger: guideModalInitGuide ? 'onboarding' : 'manual'
54+
});
55+
}
56+
}, [isOpen, guideModalInitGuide]);
57+
4858
const infoData = useQuery({
4959
queryFn: UserInfo,
5060
queryKey: [session?.token, 'UserInfo'],
@@ -278,6 +288,11 @@ const GuideModal = () => {
278288
setInitGuide(false);
279289
closeGuideModal();
280290
startDriver(quitGuideDriverObj(t));
291+
292+
track('guide_exit', {
293+
module: 'guide',
294+
progress_step: activeStep
295+
});
281296
};
282297

283298
return (
@@ -332,12 +347,28 @@ const GuideModal = () => {
332347

333348
switch (cur.key) {
334349
case 'system-applaunchpad':
350+
track('guide_start', {
351+
module: 'guide',
352+
guide_name: 'applaunchpad'
353+
});
335354
return startDriver(appLaunchpadDriverObj(openDesktopApp, t));
336355
case 'system-template':
356+
track('guide_start', {
357+
module: 'guide',
358+
guide_name: 'appstore'
359+
});
337360
return startDriver(templateDriverObj(openDesktopApp, t));
338361
case 'system-dbprovider':
362+
track('guide_start', {
363+
module: 'guide',
364+
guide_name: 'database'
365+
});
339366
return startDriver(databaseDriverObj(openDesktopApp, t));
340367
case 'system-devbox':
368+
track('guide_start', {
369+
module: 'guide',
370+
guide_name: 'devbox'
371+
});
341372
return startDriver(devboxDriverObj(openDesktopApp, t));
342373
default:
343374
return;

frontend/desktop/src/components/desktop_content/apps.tsx

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ import styles from './index.module.scss';
3434
import { ArrowRight, Volume2 } from 'lucide-react';
3535
import { useGuideModalStore } from '@/stores/guideModal';
3636
import { currentDriver, destroyDriver } from '../account/driver';
37+
import { track } from '@sealos/gtm';
3738

3839
const AppItem = ({
3940
app,
@@ -795,7 +796,23 @@ export default function Apps() {
795796
gap={'8px'}
796797
p={'8px 12px'}
797798
cursor={'pointer'}
798-
onClick={layoutConfig?.version === 'cn' ? openReferralApp : () => openGuideModal()}
799+
onClick={
800+
layoutConfig?.version === 'cn'
801+
? () => {
802+
track('announcement_click', {
803+
module: 'dashboard',
804+
announcement_id: 'invitation_referral_prompt'
805+
});
806+
openReferralApp();
807+
}
808+
: () => {
809+
track('announcement_click', {
810+
module: 'dashboard',
811+
announcement_id: 'onboarding_guide_prompt'
812+
});
813+
openGuideModal();
814+
}
815+
}
799816
>
800817
<Box position="relative" className="gradient-icon">
801818
<Volume2 width={16} height={16} />

frontend/desktop/src/components/team/CreateTeam.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { createRequest } from '@/api/namespace';
1616
import { useCustomToast } from '@/hooks/useCustomToast';
1717
import { ApiResp } from '@/types';
1818
import { useTranslation } from 'next-i18next';
19+
import { track } from '@sealos/gtm';
1920

2021
export default function CreateTeam({ isOpen, onClose }: { isOpen: boolean; onClose: () => void }) {
2122
const { t } = useTranslation();
@@ -29,6 +30,9 @@ export default function CreateTeam({ isOpen, onClose }: { isOpen: boolean; onClo
2930
onSuccess(data) {
3031
if (data.code === 200) {
3132
queryClient.invalidateQueries({ queryKey: ['teamList'] });
33+
track('workspace_create', {
34+
module: 'workspace'
35+
});
3236
onClose();
3337
}
3438
},

frontend/desktop/src/components/team/DissolveTeam.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
2020
import { useTranslation } from 'next-i18next';
2121
import { useState } from 'react';
2222
import CustomInput from './Input';
23+
import { track } from '@sealos/gtm';
2324
export default function DissolveTeam({
2425
nsid,
2526
ns_uid,
@@ -43,6 +44,9 @@ export default function DissolveTeam({
4344
queryKey: ['teamList'],
4445
exact: false
4546
});
47+
track('workspace_delete', {
48+
module: 'workspace'
49+
});
4650
onSuccess && onSuccess(ns_uid);
4751
onClose();
4852
},

frontend/desktop/src/components/team/InviteMember.tsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import { ApiResp } from '@/types';
2929
import { useTranslation } from 'next-i18next';
3030
import { GroupAddIcon } from '@sealos/ui';
3131
import { useCopyData } from '@/hooks/useCopyData';
32+
import { track } from '@sealos/gtm';
3233

3334
export default function InviteMember({
3435
ns_uid,
@@ -68,6 +69,12 @@ export default function InviteMember({
6869
const getLinkCode = useMutation({
6970
mutationFn: getInviteCodeRequest,
7071
mutationKey: [session?.user.ns_uid],
72+
onSuccess(_data, variables) {
73+
track('workspace_invite', {
74+
module: 'workspace',
75+
invite_role: variables.role === UserRole.Developer ? 'developer' : 'manager'
76+
});
77+
},
7178
onError() {
7279
toast({
7380
status: 'error',

frontend/desktop/src/components/team/TeamCenter.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ import NsListItem from '@/components/team/NsListItem';
3737
import RenameTeam from './RenameTeam';
3838
import { Plus, Settings } from 'lucide-react';
3939
import useAppStore from '@/stores/app';
40+
import { track } from '@sealos/gtm';
4041

4142
export default function TeamCenter({
4243
isOpen,
@@ -108,6 +109,15 @@ export default function TeamCenter({
108109
}
109110
}, [_namespaces, ns_uid]);
110111

112+
useEffect(() => {
113+
if (isOpen) {
114+
track('module_view', {
115+
view_name: 'manage',
116+
module: 'workspace'
117+
});
118+
}
119+
}, [isOpen]);
120+
111121
const openAccountCenterApp = (page?: string) => {
112122
openDesktopApp({
113123
appKey: 'system-account-center',

0 commit comments

Comments
 (0)