Skip to content

Commit 3d9df83

Browse files
authored
[BOT] Farabi/bot-1252/update dashboard events rudderstack (#13100)
* chore: added more details in the rs events * refactor: updated the implementation of rudderstack * chore: add null check for strategies length
1 parent 7aa2710 commit 3d9df83

File tree

7 files changed

+167
-63
lines changed

7 files changed

+167
-63
lines changed
Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
import { Analytics, TEvents } from '@deriv-com/analytics';
2+
3+
const form_name = 'ce_bot_dashboard_form';
4+
const form_source = 'ce_bot_dashboard_form';
5+
6+
enum ACTION {
7+
OPEN = 'open',
8+
CLOSE = 'close',
9+
CHOOSE_YOUR_BOT = 'choose_your_bot',
10+
EDIT_YOUR_BOT = 'edit_your_bot',
11+
SAVE_YOUR_BOT = 'save_your_bot',
12+
DELETE_YOUR_BOT = 'delete_your_bot',
13+
PUSH_OPEN_BUTTON = 'push_open_button',
14+
CHOOSE_SHORTCUT = 'choose_shortcut',
15+
PUSH_USER_GUIDE = 'push_user_guide',
16+
}
17+
18+
export const rudderstackDashboardOpen = ({
19+
bot_name,
20+
preview_mode,
21+
bot_last_modified_time,
22+
}: TEvents['ce_bot_dashboard_form']) => {
23+
Analytics.trackEvent('ce_bot_dashboard_form', {
24+
action: ACTION.OPEN,
25+
form_source,
26+
form_name,
27+
bot_name,
28+
preview_mode,
29+
bot_last_modified_time,
30+
});
31+
};
32+
33+
export const rudderstackDashboardClose = ({
34+
bot_name,
35+
preview_mode,
36+
bot_last_modified_time,
37+
}: TEvents['ce_bot_dashboard_form']) => {
38+
Analytics.trackEvent('ce_bot_dashboard_form', {
39+
action: ACTION.OPEN,
40+
form_source,
41+
form_name,
42+
bot_name,
43+
preview_mode,
44+
bot_last_modified_time,
45+
});
46+
};
47+
48+
export const rudderstackDashboardChooseYourBot = ({
49+
bot_name,
50+
bot_last_modified_time,
51+
}: TEvents['ce_bot_dashboard_form']) => {
52+
Analytics.trackEvent('ce_bot_dashboard_form', {
53+
action: ACTION.CHOOSE_YOUR_BOT,
54+
form_name,
55+
bot_name,
56+
bot_last_modified_time,
57+
});
58+
};
59+
60+
export const rudderstackDashboardEditYourBot = ({ bot_name }: TEvents['ce_bot_dashboard_form']) => {
61+
Analytics.trackEvent('ce_bot_dashboard_form', {
62+
action: ACTION.EDIT_YOUR_BOT,
63+
form_name,
64+
bot_name,
65+
});
66+
};
67+
68+
export const rudderstackDashboardSaveYourBot = ({
69+
bot_name,
70+
bot_last_modified_time,
71+
bot_status,
72+
}: TEvents['ce_bot_dashboard_form']) => {
73+
Analytics.trackEvent('ce_bot_dashboard_form', {
74+
action: ACTION.SAVE_YOUR_BOT,
75+
form_name,
76+
bot_name,
77+
bot_last_modified_time,
78+
bot_status,
79+
});
80+
};
81+
82+
export const rudderstackDashboardDeleteYourBot = ({
83+
bot_name,
84+
delete_popup_respond,
85+
}: TEvents['ce_bot_dashboard_form']) => {
86+
Analytics.trackEvent('ce_bot_dashboard_form', {
87+
action: ACTION.DELETE_YOUR_BOT,
88+
bot_name,
89+
delete_popup_respond,
90+
});
91+
};
92+
93+
export const rudderstackDashboardOpenButton = () => {
94+
Analytics.trackEvent('ce_bot_dashboard_form', {
95+
action: ACTION.PUSH_OPEN_BUTTON,
96+
form_name,
97+
form_source,
98+
});
99+
};
100+
101+
export const rudderstackDashboardChooseShortcut = ({ shortcut_name }: TEvents['ce_bot_dashboard_form']) => {
102+
Analytics.trackEvent('ce_bot_dashboard_form', {
103+
action: ACTION.CHOOSE_SHORTCUT,
104+
form_name,
105+
form_source,
106+
shortcut_name,
107+
});
108+
};
109+
110+
export const rudderstackDashboardUserGuide = () => {
111+
Analytics.trackEvent('ce_bot_dashboard_form', {
112+
action: ACTION.PUSH_USER_GUIDE,
113+
form_name,
114+
form_source,
115+
});
116+
};

packages/bot-web-ui/src/pages/dashboard/cards.tsx

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,12 @@ import classNames from 'classnames';
44
import { DesktopWrapper, Dialog, Icon, MobileFullPageModal, MobileWrapper, Text } from '@deriv/components';
55
import { observer } from '@deriv/stores';
66
import { localize } from '@deriv/translations';
7+
import { Analytics } from '@deriv-com/analytics';
78
import { DBOT_TABS } from 'Constants/bot-contents';
89
import { useDBotStore } from 'Stores/useDBotStore';
10+
import { rudderstackDashboardChooseShortcut } from './analytics/rudderstack-dashboard';
911
import GoogleDrive from './load-bot-preview/google-drive';
1012
import Recent from './load-bot-preview/recent';
11-
import { Analytics } from '@deriv-com/analytics';
1213

1314
type TCardProps = {
1415
has_dashboard_strategies: boolean;
@@ -54,15 +55,6 @@ const Cards = observer(({ is_mobile, has_dashboard_strategies }: TCardProps) =>
5455
});
5556
};
5657

57-
//this is to check which icon is clicked on dashboard
58-
const sentToRudderStack = (type: string) => {
59-
Analytics.trackEvent('ce_bot_builder_form', {
60-
shortcut_name: type,
61-
action: 'choose_shortcut',
62-
form_source: 'ce_bot_dashboard_form',
63-
});
64-
};
65-
6658
const [is_file_supported, setIsFileSupported] = React.useState<boolean>(true);
6759
const file_input_ref = React.useRef<HTMLInputElement | null>(null);
6860

@@ -143,7 +135,7 @@ const Cards = observer(({ is_mobile, has_dashboard_strategies }: TCardProps) =>
143135
id={icon}
144136
onClick={() => {
145137
method();
146-
sentToRudderStack(type);
138+
rudderstackDashboardChooseShortcut({ shortcut_name: type });
147139
}}
148140
/>
149141
<Text color='prominent' size={is_mobile ? 'xxs' : 'xs'}>

packages/bot-web-ui/src/pages/dashboard/dashboard.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import React from 'react';
22
import classNames from 'classnames';
3-
import { Analytics } from '@deriv-com/analytics';
43
import { Text } from '@deriv/components';
54
import { observer, useStore } from '@deriv/stores';
65
import { localize } from '@deriv/translations';
76
import { useDBotStore } from 'Stores/useDBotStore';
87
import OnboardTourHandler from '../tutorials/dbot-tours/onboarding-tour';
8+
import { rudderstackDashboardClose, rudderstackDashboardOpen } from './analytics/rudderstack-dashboard';
99
import Local from './load-bot-preview/local';
1010
import Cards from './cards';
1111
import InfoPanel from './info-panel';
@@ -28,17 +28,19 @@ const DashboardComponent = observer(({ handleTabChange }: TMobileIconGuide) => {
2828
if (!get_first_strategy_info.current) {
2929
//on dashbord umount fire close event for rudderstack
3030
get_first_strategy_info.current = true;
31-
Analytics.trackEvent('ce_bot_dashboard_form', {
32-
action: 'open',
33-
form_source: 'ce_bot_dashboard_form',
31+
rudderstackDashboardOpen({
32+
bot_name: dashboard_strategies?.[0]?.name,
33+
preview_mode: dashboard_strategies?.length ? 'yes' : 'no',
34+
bot_last_modified_time: dashboard_strategies?.[0]?.timestamp,
3435
});
35-
return () => {
36-
Analytics.trackEvent('ce_bot_dashboard_form', {
37-
action: 'close',
38-
form_source: 'ce_bot_dashboard_form',
39-
});
40-
};
4136
}
37+
return () => {
38+
rudderstackDashboardClose({
39+
bot_name: dashboard_strategies?.[0]?.name,
40+
preview_mode: dashboard_strategies?.length ? 'yes' : 'no',
41+
bot_last_modified_time: dashboard_strategies?.[0]?.timestamp,
42+
});
43+
};
4244
}, []);
4345

4446
return (

packages/bot-web-ui/src/pages/dashboard/load-bot-preview/delete-dialog.tsx

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
import React from 'react';
22
import localForage from 'localforage';
33
import LZString from 'lz-string';
4-
import { Analytics } from '@deriv-com/analytics';
54
import { getSavedWorkspaces } from '@deriv/bot-skeleton';
65
import { Dialog, Text } from '@deriv/components';
76
import { observer } from '@deriv/stores';
87
import { localize } from '@deriv/translations';
98
import { TStrategy } from 'Types';
109
import { useDBotStore } from 'Stores/useDBotStore';
10+
import { rudderstackDashboardDeleteYourBot } from '../analytics/rudderstack-dashboard';
1111

1212
const DeleteDialog = observer(() => {
1313
const { load_modal, dashboard } = useDBotStore();
@@ -59,21 +59,13 @@ const DeleteDialog = observer(() => {
5959
onToggleDeleteDialog(false);
6060
};
6161

62-
//this is to check after click of yes ir no on delete dailog send event to rudderstck
63-
const sentToRudderStack = (param: string) => {
64-
Analytics.trackEvent('ce_bot_builder_form', {
65-
delete_popup_respond: param,
66-
form_source: 'ce_bot_dashboard_form',
67-
});
68-
};
69-
7062
const onHandleChange = (type: string, param: boolean) => {
7163
if (type === 'confirm') {
7264
removeBotStrategy(selected_strategy_id);
7365
setOpenSettings('delete', true);
74-
sentToRudderStack('yes');
66+
rudderstackDashboardDeleteYourBot({ delete_popup_respond: 'yes' });
7567
} else {
76-
sentToRudderStack('no');
68+
rudderstackDashboardDeleteYourBot({ delete_popup_respond: 'no' });
7769
}
7870
onToggleDeleteDialog(param);
7971
};

packages/bot-web-ui/src/pages/dashboard/load-bot-preview/local.tsx

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
import React from 'react';
22
import classNames from 'classnames';
3-
import { Analytics } from '@deriv-com/analytics';
43
import { Dialog, MobileWrapper } from '@deriv/components';
54
import { observer, useStore } from '@deriv/stores';
65
import { Localize, localize } from '@deriv/translations';
6+
import { Analytics } from '@deriv-com/analytics';
77
import { DBOT_TABS } from 'Constants/bot-contents';
88
import { useDBotStore } from 'Stores/useDBotStore';
9+
import { rudderstackDashboardOpenButton } from '../analytics/rudderstack-dashboard';
910
import BotPreview from './bot-preview';
1011
import './index.scss';
1112

@@ -20,11 +21,6 @@ const LocalComponent = observer(() => {
2021
const has_strategies = !!dashboard_strategies?.length;
2122

2223
const sendToRudderStackForOpenButton = () => {
23-
Analytics.trackEvent('ce_bot_dashboard_form', {
24-
action: 'push_open_button',
25-
form_source: 'ce_bot_dashboard_form',
26-
});
27-
2824
//this is to track from which open button user has come to bot builder tab
2925
Analytics.trackEvent('ce_bot_builder_form', {
3026
action: 'open',
@@ -42,6 +38,7 @@ const LocalComponent = observer(() => {
4238
<button
4339
className='load-strategy__button-group--open'
4440
onClick={() => {
41+
rudderstackDashboardOpenButton();
4542
sendToRudderStackForOpenButton();
4643
setPreviewOnDialog(false);
4744
loadFileFromRecent();

packages/bot-web-ui/src/pages/dashboard/load-bot-preview/recent-workspace.tsx

Lines changed: 27 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,22 @@
11
import React from 'react';
22
import classnames from 'classnames';
3-
import { Analytics, BotTActions } from '@deriv-com/analytics';
43
import { timeSince } from '@deriv/bot-skeleton';
54
import { save_types } from '@deriv/bot-skeleton/src/constants/save-type';
65
import { DesktopWrapper, Icon, MobileWrapper, Text } from '@deriv/components';
76
import { isDesktop } from '@deriv/shared';
87
import { observer, useStore } from '@deriv/stores';
8+
import { Analytics } from '@deriv-com/analytics';
99
import { DBOT_TABS } from 'Constants/bot-contents';
1010
import { waitForDomElement } from 'Utils/dom-observer';
1111
import { useDBotStore } from 'Stores/useDBotStore';
1212
import { CONTEXT_MENU_MOBILE, MENU_DESKTOP, STRATEGY } from '../../../constants/dashboard';
1313
import { useComponentVisibility } from '../../../hooks';
14+
import {
15+
rudderstackDashboardChooseYourBot,
16+
rudderstackDashboardDeleteYourBot,
17+
rudderstackDashboardEditYourBot,
18+
rudderstackDashboardSaveYourBot,
19+
} from '../analytics/rudderstack-dashboard';
1420
import './index.scss';
1521

1622
type TRecentWorkspace = {
@@ -46,14 +52,6 @@ const RecentWorkspace = observer(({ workspace, index }: TRecentWorkspace) => {
4652
const { setDropdownVisibility, is_dropdown_visible } = visible;
4753
const is_desktop = isDesktop();
4854

49-
const sendToRudderStack = (action: BotTActions) => {
50-
Analytics.trackEvent('ce_bot_builder_form', {
51-
action,
52-
form_source: 'ce_bot_dashboard_form',
53-
bot_last_modified_time: dashboard_strategies?.[0]?.timestamp,
54-
});
55-
};
56-
5755
React.useEffect(() => {
5856
let timer: ReturnType<typeof setTimeout>;
5957

@@ -110,14 +108,8 @@ const RecentWorkspace = observer(({ workspace, index }: TRecentWorkspace) => {
110108
};
111109

112110
const handleSave = () => {
113-
/* Send the event on rudderstack on strategy save */
114-
Analytics.trackEvent('ce_bot_dashboard_form', {
115-
bot_name: workspace?.name,
116-
form_source: 'ce_bot_dashboard_form',
117-
});
118111
updateBotName(workspace?.name);
119112
toggleSaveModal();
120-
sendToRudderStack('save_your_bot');
121113
};
122114

123115
const viewRecentStrategy = async (type: string) => {
@@ -127,28 +119,43 @@ const RecentWorkspace = observer(({ workspace, index }: TRecentWorkspace) => {
127119
case STRATEGY.INIT:
128120
// Fires for desktop preview
129121
handleInit();
130-
sendToRudderStack('choose_your_bot');
122+
rudderstackDashboardChooseYourBot({
123+
bot_name: workspace?.name,
124+
bot_last_modified_time: dashboard_strategies?.[0]?.timestamp,
125+
});
131126
break;
132127

133128
case STRATEGY.PREVIEW_LIST:
134129
// Fires for mobile preview
135130
handlePreviewList();
136-
sendToRudderStack('choose_your_bot');
131+
rudderstackDashboardChooseYourBot({
132+
bot_name: workspace?.name,
133+
bot_last_modified_time: dashboard_strategies?.[0]?.timestamp,
134+
});
137135
break;
138136

139137
case STRATEGY.EDIT:
140138
await handleEdit();
141-
sendToRudderStack('edit_your_bot');
139+
rudderstackDashboardEditYourBot({
140+
bot_name: workspace?.name,
141+
});
142142
break;
143143

144144
case STRATEGY.SAVE:
145145
handleSave();
146-
sendToRudderStack('save_your_bot');
146+
rudderstackDashboardSaveYourBot({
147+
bot_name: workspace?.name,
148+
bot_last_modified_time: dashboard_strategies?.[0]?.timestamp,
149+
bot_status: dashboard_strategies?.[0]?.save_type,
150+
});
147151
break;
148152

149153
case STRATEGY.DELETE:
150154
onToggleDeleteDialog(true);
151-
sendToRudderStack('delete_your_bot');
155+
rudderstackDashboardDeleteYourBot({
156+
bot_name: workspace?.name,
157+
delete_popup_respond: 'yes',
158+
});
152159
break;
153160

154161
default:

0 commit comments

Comments
 (0)