Rupato/bot 1039/test case for gtmts file (deriv-com#14117)

* fix: for input color

* fix: added test cases for gtm

* fix: for test case of gtm

* fix: for test case of gtm

* fix: removed console warn

packages/bot-web-ui/src/components/summary/summary-card.types.ts

@@ -39,6 +39,7 @@ export type TContractInfo = {
     expiry_time: number;
     exit_tick?: number;
     id: string;
+    is_completed?: boolean;
     is_expired: number;
     is_forward_starting: number;
     is_intraday: number;

packages/bot-web-ui/src/utils/__tests__/gtm.spec.ts

@@ -0,0 +1,82 @@
+import { mockStore } from '@deriv/stores';
+import GTM from '../gtm';
+import { mockDBotStore } from 'Stores/useDBotStore';
+import { mock_ws } from 'Utils/mock';
+import { action } from 'mobx';
+
+jest.mock('@deriv/bot-skeleton/src/scratch/dbot', () => jest.fn());
+jest.mock('@deriv/bot-skeleton/src/scratch/xml/main.xml', () => '<xml>sample</xml>');
+
+const mock_login_id = 'test_login_id';
+
+const mock_row_data = {
+    [mock_login_id]: [
+        {
+            type: 'contract',
+            data: {
+                buy_price: 1,
+                contract_id: 235121627708,
+                contract_type: 'CALL',
+                currency: 'USD',
+                date_start: '2024-3-12 03:57:21 GMT',
+                display_name: 'Volatility 10 (1s) Index',
+                is_completed: true,
+                payout: 1.95,
+                profit: false,
+                run_id: 'run-1710215840873',
+                shortcode: 'CALL_1HZ10V_1.95_1710215841_1T_S0P_0',
+                tick_count: 1,
+                transaction_ids: {
+                    buy: 469073343108,
+                },
+                underlying: '1HZ10V',
+            },
+        },
+        {},
+    ],
+};
+const mock_store = mockStore({
+    client: {
+        loginid: mock_login_id,
+    },
+});
+const mock_DBot_store = mockDBotStore(mock_store, mock_ws);
+const combined_store = { ...mock_DBot_store, core: { ...mock_store } };
+
+describe('GTM Module', () => {
+    it('should initialize GTM and push data layer getting called from core', () => {
+        const mockPushDataLayer = jest.fn();
+        mock_store.gtm.pushDataLayer = mockPushDataLayer;
+        GTM.init(combined_store);
+        mock_DBot_store.run_panel.setIsRunning(true);
+
+        expect(mockPushDataLayer).toHaveBeenCalledWith(
+            expect.objectContaining({
+                counters: expect.anything(),
+                event: expect.anything(),
+                run_id: expect.anything(),
+            })
+        );
+    });
+
+    it('should fail on sending null for init', () => {
+        // eslint-disable-next-line no-console
+        console.warn = jest.fn();
+        GTM.init(null);
+        // eslint-disable-next-line no-console
+        expect(console.warn).toHaveBeenCalledWith('Error initializing GTM reactions ', expect.any(Error));
+    });
+
+    it('onRunBot should fail on sending null', () => {
+        const captured_warnings = [];
+        // eslint-disable-next-line no-console
+        console.warn = message => captured_warnings.push(message);
+        try {
+            GTM.onRunBot(null);
+            mock_DBot_store.transactions.elements = mock_row_data;
+            expect(captured_warnings[0]).toContain('Error pushing run data to datalayer');
+        } catch (error) {
+            expect(error).toBeInstanceOf(Error);
+        }
+    });
+});

packages/bot-web-ui/src/utils/gtm.ts

@@ -0,0 +1,101 @@
+import RootStore from 'Stores/root-store';
+import { reaction } from 'mobx';
+import { TStores, TCoreStores } from '@deriv/stores/types';
+import { TStatistics } from 'Components/transaction-details/transaction-details.types';
+import { TContractInfo } from 'Components/summary/summary-card.types';
+
+type TGTM = {
+    core: {
+        client: {
+            loginid: string;
+        };
+        server_time: {
+            unix: () => number;
+        };
+        gtm: {
+            pushDataLayer: (data: Record<string, unknown>) => void;
+        };
+    };
+};
+
+const GTM = (() => {
+    let root_store: RootStore & TGTM;
+
+    const getLoginId = (): string => {
+        return root_store.core.client.loginid;
+    };
+
+    const getServerTime = (): number => {
+        return root_store?.core?.server_time?.unix() || Date.now();
+    };
+
+    const pushDataLayer = (data: Record<string, unknown>): void => {
+        return root_store?.core?.gtm?.pushDataLayer(data);
+    };
+
+    const init = (_root_store: RootStore & TStores & TCoreStores & { core: TGTM['core'] }): void => {
+        try {
+            root_store = _root_store;
+
+            const { run_panel, transactions } = root_store;
+            const run_statistics = run_panel.statistics;
+            const active_loginid = getLoginId();
+
+            reaction(
+                () => run_panel.is_running,
+                () => run_panel.is_running && onRunBot(run_statistics)
+            );
+
+            reaction(
+                () => transactions.elements,
+                () => {
+                    const contract_data = transactions?.elements?.[active_loginid][0]?.data;
+                    onTransactionClosed(contract_data);
+                }
+            );
+        } catch (error) {
+            // eslint-disable-next-line no-console
+            console.warn('Error initializing GTM reactions ', error); // eslint-disable-line no-console
+        }
+    };
+
+    const onRunBot = (statistics: TStatistics): void => {
+        try {
+            const run_id = `${getLoginId()}-${getServerTime()}`;
+            const counters = `tr:${statistics.number_of_runs},\
+                ts:${statistics.total_stake},\
+                py:${statistics.total_payout},\
+                lc:${statistics.lost_contracts},\
+                wc:${statistics.won_contracts},\
+                pr:${statistics.total_profit}`;
+
+            const data = {
+                counters: counters.replace(/\s/g, ''),
+                event: 'dbot_run',
+                run_id,
+            };
+            pushDataLayer(data);
+        } catch (error) {
+            console.warn('Error pushing run data to datalayer ', error); // eslint-disable-line no-console
+        }
+    };
+
+    const onTransactionClosed = (contract: TContractInfo): void => {
+        if (contract && contract.is_completed) {
+            const data = {
+                event: 'dbot_run_transaction',
+                reference_id: contract.contract_id,
+            };
+            pushDataLayer(data);
+        }
+    };
+
+    return {
+        init,
+        pushDataLayer,
+        onTransactionClosed,
+        onRunBot,
+    };
+})();
+
+export default GTM;