Agrim/CRO-770/Missing-Userid (deriv-com#17549)

* fix: testing user id * chore: add cacheTrackEvents for missing user id * fix: fix type * fix: revert isReady change * fix: failing test cases * fix: empty commit * fix: test
Nuzhy-Deriv · Nov 25, 2024 · baf4303 · baf4303
1 parent 594997b
commit baf4303
Show file tree

Hide file tree

Showing 26 changed files with 792 additions and 406 deletions.
diff --git a/packages/appstore/src/components/add-options-account/add-options-account.tsx b/packages/appstore/src/components/add-options-account/add-options-account.tsx
@@ -4,8 +4,7 @@ import { Localize, localize } from '@deriv/translations';
 import './add-options-account.scss';
 import { useGrowthbookGetFeatureValue } from '@deriv/hooks';
 import { useStore, observer } from '@deriv/stores';
-import { isMobile, ContentFlag } from '@deriv/shared';
-import { Analytics } from '@deriv-com/analytics';
+import { isMobile, ContentFlag, cacheTrackEvents } from '@deriv/shared';
 
 const AddOptions = observer(() => {
     const { client, traders_hub, ui } = useStore();
@@ -37,12 +36,19 @@ const AddOptions = observer(() => {
                     has_effect
                     onClick={() => {
                         if (is_traders_dashboard_tracking_enabled) {
-                            Analytics.trackEvent('ce_tradershub_dashboard_form', {
-                                action: 'account_get',
-                                form_name: 'traders_hub_default',
-                                account_mode: selected_account_type,
-                                account_name: 'cfd_banner',
-                            });
+                            cacheTrackEvents.loadEvent([
+                                {
+                                    event: {
+                                        name: 'ce_tradershub_dashboard_form',
+                                        properties: {
+                                            action: 'account_get',
+                                            form_name: 'traders_hub_default',
+                                            account_mode: selected_account_type,
+                                            account_name: 'cfd_banner',
+                                        },
+                                    },
+                                },
+                            ]);
                         }
 
                         if (is_real && eu_user) {

diff --git a/packages/appstore/src/components/app-content.tsx b/packages/appstore/src/components/app-content.tsx
@@ -1,8 +1,7 @@
 import React, { useEffect } from 'react';
-import { routes, WS } from '@deriv/shared';
+import { routes, WS, cacheTrackEvents } from '@deriv/shared';
 import { useGrowthbookGetFeatureValue } from '@deriv/hooks';
 import { observer, useStore } from '@deriv/stores';
-import { Analytics } from '@deriv-com/analytics';
 import Routes from 'Components/routes/routes';
 import classNames from 'classnames';
 import './app.scss';
@@ -51,11 +50,18 @@ const AppContent: React.FC = observer(() => {
     useEffect(() => {
         if (selected_account_type) {
             if (is_traders_dashboard_tracking_enabled) {
-                Analytics.trackEvent('ce_tradershub_dashboard_form', {
-                    action: 'open',
-                    form_name: 'traders_hub_default',
-                    account_mode: selected_account_type,
-                });
+                cacheTrackEvents.loadEvent([
+                    {
+                        event: {
+                            name: 'ce_tradershub_dashboard_form',
+                            properties: {
+                                action: 'open',
+                                form_name: 'traders_hub_default',
+                                account_mode: selected_account_type,
+                            },
+                        },
+                    },
+                ]);
             }
         }
     }, [selected_account_type]);

diff --git a/packages/appstore/src/components/banners/book-banner/banner-template.tsx b/packages/appstore/src/components/banners/book-banner/banner-template.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { useStore } from '@deriv/stores';
 import { Analytics } from '@deriv-com/analytics';
-import { SessionStore } from '@deriv/shared';
+import { SessionStore, cacheTrackEvents } from '@deriv/shared';
 import { getAllowedLanguages, Localize } from '@deriv/translations';
 import { LabelPairedCircleChevronDownXlBoldIcon, LabelPairedXmarkLgBoldIcon } from '@deriv/quill-icons';
 import { TEbooksUrl } from 'Components/banners/book-banner/book-banner';
@@ -23,10 +23,17 @@ const BookBannerTemplate = ({ e_book_show_way, e_books_url, e_book_from_landing,
     };
 
     React.useEffect(() => {
-        Analytics.trackEvent('ce_tradershub_banner', {
-            action: 'open',
-            ...analytics_data,
-        });
+        cacheTrackEvents.loadEvent([
+            {
+                event: {
+                    name: 'ce_tradershub_banner',
+                    properties: {
+                        action: 'open',
+                        ...analytics_data,
+                    },
+                },
+            },
+        ]);
     }, []);
 
     return (
@@ -45,10 +52,17 @@ const BookBannerTemplate = ({ e_book_show_way, e_books_url, e_book_from_landing,
                                     target='_blank'
                                     rel='noopener noreferrer'
                                     onClick={() => {
-                                        Analytics.trackEvent('ce_tradershub_banner', {
-                                            action: 'click download',
-                                            ...analytics_data,
-                                        });
+                                        cacheTrackEvents.loadEvent([
+                                            {
+                                                event: {
+                                                    name: 'ce_tradershub_banner',
+                                                    properties: {
+                                                        action: 'click download',
+                                                        ...analytics_data,
+                                                    },
+                                                },
+                                            },
+                                        ]);
                                     }}
                                 >
                                     <Localize i18n_default_text='Download e-book' />
@@ -68,10 +82,17 @@ const BookBannerTemplate = ({ e_book_show_way, e_books_url, e_book_from_landing,
                         height='24'
                         fill='var(--text-prominent)'
                         onClick={() => {
-                            Analytics.trackEvent('ce_tradershub_banner', {
-                                action: 'close',
-                                ...analytics_data,
-                            });
+                            cacheTrackEvents.loadEvent([
+                                {
+                                    event: {
+                                        name: 'ce_tradershub_banner',
+                                        properties: {
+                                            action: 'close',
+                                            ...analytics_data,
+                                        },
+                                    },
+                                },
+                            ]);
                             SessionStore.remove('show_book');
                             setIsBannerShows(false);
                         }}

diff --git a/packages/appstore/src/components/banners/deposit-now-banner/deposit-now-banner.tsx b/packages/appstore/src/components/banners/deposit-now-banner/deposit-now-banner.tsx
@@ -6,7 +6,7 @@ import { Localize } from '@deriv/translations';
 import { Button, Text, Icon } from '@deriv/components';
 import { observer, useStore } from '@deriv/stores';
 import { useCurrentCurrencyConfig } from '@deriv/hooks';
-import { routes } from '@deriv/shared';
+import { routes, cacheTrackEvents } from '@deriv/shared';
 import './deposit-now-banner.scss';
 
 const desktopWidth = 368;
@@ -23,20 +23,34 @@ const DepositNowBanner = observer(() => {
     const { is_eu_user } = traders_hub;
 
     const handleButtonClick = () => {
-        Analytics.trackEvent('ce_tradershub_banner', {
-            action: 'click_cta',
-            banner_name: 'first_deposit',
-            banner_type: 'with_cta',
-        });
+        cacheTrackEvents.loadEvent([
+            {
+                event: {
+                    name: 'ce_tradershub_banner',
+                    properties: {
+                        action: 'click_cta',
+                        banner_name: 'first_deposit',
+                        banner_type: 'with_cta',
+                    },
+                },
+            },
+        ]);
         history.push(`${routes.cashier_deposit}${is_crypto_account ? '#deposit' : ''}`);
     };
 
     React.useEffect(() => {
-        Analytics.trackEvent('ce_tradershub_banner', {
-            action: 'open',
-            banner_name: 'first_deposit',
-            banner_type: 'with_cta',
-        });
+        cacheTrackEvents.loadEvent([
+            {
+                event: {
+                    name: 'ce_tradershub_banner',
+                    properties: {
+                        action: 'open',
+                        banner_name: 'first_deposit',
+                        banner_type: 'with_cta',
+                    },
+                },
+            },
+        ]);
     }, []);
 
     return (

diff --git a/...tore/src/components/banners/real-account-creation-banner/real-account-creation-banner.tsx b/...tore/src/components/banners/real-account-creation-banner/real-account-creation-banner.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import { useDevice } from '@deriv-com/ui';
-import { getUrlBase, Jurisdiction } from '@deriv/shared';
+import { getUrlBase, Jurisdiction, cacheTrackEvents } from '@deriv/shared';
 import { Analytics } from '@deriv-com/analytics';
 import { Localize } from '@deriv/translations';
 import { Text, Button } from '@deriv/components';
@@ -14,20 +14,34 @@ const RealAccountCreationBanner = observer(() => {
     const device = !isDesktop ? 'mobile' : 'desktop';
 
     const handleClick = () => {
-        Analytics.trackEvent('ce_tradershub_banner', {
-            action: 'click_cta',
-            banner_name: 'real_account_cta',
-            banner_type: 'with_cta',
-        });
+        cacheTrackEvents.loadEvent([
+            {
+                event: {
+                    name: 'ce_tradershub_banner',
+                    properties: {
+                        action: 'click_cta',
+                        banner_name: 'real_account_cta',
+                        banner_type: 'with_cta',
+                    },
+                },
+            },
+        ]);
         openRealAccountSignup(Jurisdiction.SVG);
     };
 
     useEffect(() => {
-        Analytics.trackEvent('ce_tradershub_banner', {
-            action: 'open',
-            banner_name: 'real_account_cta',
-            banner_type: 'with_cta',
-        });
+        cacheTrackEvents.loadEvent([
+            {
+                event: {
+                    name: 'ce_tradershub_banner',
+                    properties: {
+                        action: 'open',
+                        banner_name: 'real_account_cta',
+                        banner_type: 'with_cta',
+                    },
+                },
+            },
+        ]);
     }, []);
 
     return (

diff --git a/packages/appstore/src/components/banners/wallets-banner/wallets-banner-unsuccessful.tsx b/packages/appstore/src/components/banners/wallets-banner/wallets-banner-unsuccessful.tsx
@@ -4,18 +4,26 @@ import { Icon, Text } from '@deriv/components';
 import { observer, useStore } from '@deriv/stores';
 import { Localize } from '@deriv/translations';
 import { useDevice } from '@deriv-com/ui';
+import { cacheTrackEvents } from '@deriv/shared';
 
 const trackAnalyticsEvent = (
     action: TEvents['ce_tradershub_banner']['action'],
     account_mode: TEvents['ce_tradershub_banner']['account_mode']
 ) => {
-    Analytics.trackEvent('ce_tradershub_banner', {
-        action,
-        form_name: 'ce_tradershub_banner',
-        account_mode,
-        banner_name: 'setup_unsuccessful_wallets_step_3_2',
-        banner_type: 'with_cta',
-    });
+    cacheTrackEvents.loadEvent([
+        {
+            event: {
+                name: 'ce_tradershub_banner',
+                properties: {
+                    action,
+                    form_name: 'ce_tradershub_banner',
+                    account_mode,
+                    banner_name: 'setup_unsuccessful_wallets_step_3_2',
+                    banner_type: 'with_cta',
+                },
+            },
+        },
+    ]);
 };
 
 const WalletsBannerUnsuccessful = observer(() => {

diff --git a/packages/appstore/src/components/banners/wallets-banner/wallets-banner-upgrade.tsx b/packages/appstore/src/components/banners/wallets-banner/wallets-banner-upgrade.tsx
@@ -4,18 +4,26 @@ import { Button, Icon, Text } from '@deriv/components';
 import { observer, useStore } from '@deriv/stores';
 import { Localize, localize } from '@deriv/translations';
 import { useDevice } from '@deriv-com/ui';
+import { cacheTrackEvents } from '@deriv/shared';
 
 const trackAnalyticsEvent = (
     action: TEvents['ce_tradershub_banner']['action'],
     account_mode: TEvents['ce_tradershub_banner']['account_mode']
 ) => {
-    Analytics.trackEvent('ce_tradershub_banner', {
-        action,
-        form_name: 'ce_tradershub_banner',
-        account_mode,
-        banner_name: 'lets_go_wallets_step_1_2',
-        banner_type: 'with_cta',
-    });
+    cacheTrackEvents.loadEvent([
+        {
+            event: {
+                name: 'ce_tradershub_banner',
+                properties: {
+                    action,
+                    form_name: 'ce_tradershub_banner',
+                    account_mode,
+                    banner_name: 'lets_go_wallets_step_1_2',
+                    banner_type: 'with_cta',
+                },
+            },
+        },
+    ]);
 };
 
 type TProps = {

diff --git a/packages/appstore/src/components/banners/wallets-banner/wallets-banner-upgrading.tsx b/packages/appstore/src/components/banners/wallets-banner/wallets-banner-upgrading.tsx
@@ -4,6 +4,7 @@ import { Icon, Text } from '@deriv/components';
 import { observer, useStore } from '@deriv/stores';
 import { Localize } from '@deriv/translations';
 import { useDevice } from '@deriv-com/ui';
+import { cacheTrackEvents } from '@deriv/shared';
 
 const WalletsBannerUpgrading = observer(() => {
     const { traders_hub, common } = useStore();
@@ -30,13 +31,20 @@ const WalletsBannerUpgrading = observer(() => {
     }
 
     React.useEffect(() => {
-        Analytics.trackEvent('ce_tradershub_banner', {
-            action: 'open',
-            form_name: 'ce_tradershub_banner',
-            account_mode: is_demo ? 'demo' : 'real',
-            banner_name: 'setting_up_wallets_step_2',
-            banner_type: 'without_url',
-        });
+        cacheTrackEvents.loadEvent([
+            {
+                event: {
+                    name: 'ce_tradershub_banner',
+                    properties: {
+                        action: 'open',
+                        form_name: 'ce_tradershub_banner',
+                        account_mode: is_demo ? 'demo' : 'real',
+                        banner_name: 'setting_up_wallets_step_2',
+                        banner_type: 'without_url',
+                    },
+                },
+            },
+        ]);
     }, [is_demo]);
 
     return (