move analytics to separate dir

add dd file revert usecompliancestate hook fix import names fix last broken import filepath add events to deposit and withdraw forms fix import names dydx chain transactions logs. add abacus logger implementation. auto log errors finish logger implementation add service name and env fix logging fix type typo
dydxprotocol · Aug 22, 2024 · 50074f4 · 50074f4
1 parent 68c4458
commit 50074f4
Show file tree

Hide file tree

Showing 10 changed files with 101 additions and 76 deletions.
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/constants/analytics.ts b/src/constants/analytics.ts
@@ -305,7 +305,9 @@ export const AnalyticsEvents = unionize(
       errorMessage?: string;
       amount: string;
       chainId?: string;
-      assetId?: string;
+      assetaddress?: string;
+      assetSymbol: string;
+      assetName: string;
     }>(),
   },
   { tag: 'type' as const, value: 'payload' as const }

diff --git a/src/constants/networks.ts b/src/constants/networks.ts
@@ -1,6 +1,6 @@
 import environments from '../../public/configs/v1/env.json';
 
-const CURRENT_MODE = ({
+export const CURRENT_MODE = ({
   production: 'MAINNET',
   testnet: 'TESTNET',
   staging: 'DEV',

diff --git a/src/lib/abacus/dydxChainTransactions.ts b/src/lib/abacus/dydxChainTransactions.ts
@@ -42,6 +42,7 @@ import { type RootStore } from '@/state/_store';
 import { placeOrderTimeout } from '@/state/account';
 import { setInitializationError } from '@/state/app';
 
+import { dd } from '../analytics/datadog';
 import { signComplianceSignature } from '../compliance';
 import { StatefulOrderError, stringifyTransactionError } from '../errors';
 import { bytesToBigInt } from '../numbers';
@@ -410,13 +411,16 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
       }
 
       ibcMsg.value.token.amount = amount.toString();
+
+      dd.info('sendNobleIBC attempting to submit tx', { ibcMsg, fee, amount });
       const tx = await this.nobleClient.send(
         [ibcMsg],
         undefined,
         `${DEFAULT_TRANSACTION_MEMO} | ${this.nobleWallet?.address}`
       );
 
       const parsedTx = this.parseToPrimitives(tx);
+      dd.info('sendNobleIBC tx submitted', { tx, ibcMsg });
 
       return JSON.stringify(parsedTx);
     } catch (error) {
@@ -456,12 +460,16 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
         },
       };
 
+      dd.info('withdrawToNobleIBC attempting to submit tx', { ibcMsg });
+
       const tx = await this.compositeClient.send(
         this.localWallet,
         () => Promise.resolve([msg, ibcMsg]),
         false
       );
 
+      dd.info('withdrawToNobleIBC tx submitted', { tx, ibcMsg });
+
       return JSON.stringify({
         txHash: hashFromTx(tx?.hash),
       });
@@ -494,8 +502,12 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
 
       ibcMsg.value.amount = amount.toString();
 
+      dd.info('cctpWithdraw attempting to submit tx', { ibcMsg, fee, amount });
+
       const tx = await this.nobleClient.send([ibcMsg]);
 
+      dd.info('cctpWithdraw tx submitted', { tx, ibcMsg });
+
       const parsedTx = this.parseToPrimitives(tx);
 
       return JSON.stringify(parsedTx);
@@ -529,7 +541,9 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol {
 
       ibcMsgs[0].value.amount = amount.toString();
 
+      dd.info('cctpMultiMsgWithdraw attempting to submit tx', { ibcMsgs, fee, amount });
       const tx = await this.nobleClient.send(ibcMsgs);
+      dd.info('cctpMultiMsgWithdraw tx submitted', { tx, ibcMsgs });
 
       const parsedTx = this.parseToPrimitives(tx);
 

diff --git a/src/lib/abacus/logger.ts b/src/lib/abacus/logger.ts
@@ -1,6 +1,8 @@
 /* eslint-disable no-console */
 import type { AbacusLoggingProtocol } from '@/constants/abacus';
 
+import { dd } from '../analytics/datadog';
+
 class AbacusLogger implements Omit<AbacusLoggingProtocol, '__doNotUseOrImplementIt'> {
   d(tag: string, message: string) {
     if (
@@ -11,13 +13,21 @@ class AbacusLogger implements Omit<AbacusLoggingProtocol, '__doNotUseOrImplement
     }
   }
 
-  e(tag: string, message: string) {
+  e(tag: string, message: string, context: object, error: Error) {
     if (
       import.meta.env.VITE_ENABLE_ABACUS_LOGGING ||
       import.meta.env.VITE_ABACUS_LOG_LEVEL === 'error'
     ) {
       console.error(`${tag}: ${message}`);
     }
+    dd.error(message, context, error);
+  }
+
+  ddInfo(message: string, context: object) {
+    if (import.meta.env.VITE_ABACUS_LOG_LEVEL === 'debug') {
+      console.log(`dd info: ${message}`, context);
+    }
+    dd.info(message, context);
   }
 }
 

diff --git a/src/lib/analytics/analytics.ts b/src/lib/analytics/analytics.ts
@@ -22,7 +22,7 @@ export const identify = (property: AnalyticsUserProperty) => {
     detail: { property: propertyTypeToLog, propertyValue: property.payload },
   });
   dd.setContextProperty(propertyTypeToLog, property.payload);
-  dd.log(`set context item: ${propertyTypeToLog}`, dd.getContext());
+  dd.info(`set context item: ${propertyTypeToLog}`, dd.getContext());
 
   globalThis.dispatchEvent(customEvent);
 };

diff --git a/src/lib/analytics/datadog.ts b/src/lib/analytics/datadog.ts
@@ -1,14 +1,19 @@
 import { datadogLogs } from '@datadog/browser-logs';
 
+import { CURRENT_MODE } from '@/constants/networks';
+
 const CLIENT_TOKEN = import.meta.env.VITE_DATADOG_CLIENT_TOKEN;
+const SERVICE_NAME = import.meta.env.VITE_DATADOG_SERVICE_NAME ?? 'v4-web-frontend-unknown-source';
 const LOGGER_NAME = 'v4-web';
 
 if (CLIENT_TOKEN) {
   datadogLogs.init({
     clientToken: CLIENT_TOKEN,
     site: 'datadoghq.com',
+    service: SERVICE_NAME,
     forwardErrorsToLogs: true,
     sessionSampleRate: 100,
+    env: CURRENT_MODE,
   });
 }
 

diff --git a/src/lib/telemetry.ts b/src/lib/telemetry.ts
@@ -2,8 +2,9 @@ import { AnalyticsEvents } from '@/constants/analytics';
 import { isDev } from '@/constants/networks';
 
 import { track } from './analytics/analytics';
+import { dd } from './analytics/datadog';
 
-export const log = (location: string, error: Error, metadata?: any) => {
+export const log = (location: string, error: Error, metadata?: object) => {
   if (isDev) {
     // eslint-disable-next-line no-console
     console.warn('telemetry/log:', { location, error, metadata });
@@ -25,6 +26,8 @@ export const log = (location: string, error: Error, metadata?: any) => {
     })
   );
 
+  dd.error(`[Error] ${location}`, metadata, error);
+
   globalThis.dispatchEvent(customEvent);
 };
 

diff --git a/src/views/forms/AccountManagementForms/DepositForm.tsx b/src/views/forms/AccountManagementForms/DepositForm.tsx
@@ -55,6 +55,7 @@ import { getTransferInputs } from '@/state/inputsSelectors';
 
 import abacusStateManager from '@/lib/abacus';
 import { track } from '@/lib/analytics/analytics';
+import { dd } from '@/lib/analytics/datadog';
 import { MustBigNumber } from '@/lib/numbers';
 import { getNobleChainId, NATIVE_TOKEN_ADDRESS } from '@/lib/squid';
 import { log } from '@/lib/telemetry';
@@ -279,21 +280,21 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
 
   const onSubmit = useCallback(
     async (e: FormEvent) => {
-      track(
-        AnalyticsEvents.TransferDepositFundsClick({
-          chainId: chainIdStr ?? undefined,
-          tokenAddress: sourceToken?.address ?? undefined,
-          tokenSymbol: sourceToken?.symbol ?? undefined,
-          slippage: slippage ?? undefined,
-          gasFee: summary?.gasFee ?? undefined,
-          bridgeFee: summary?.bridgeFee ?? undefined,
-          exchangeRate: summary?.exchangeRate ?? undefined,
-          estimatedRouteDuration: summary?.estimatedRouteDuration ?? undefined,
-          toAmount: summary?.toAmount ?? undefined,
-          toAmountMin: summary?.toAmountMin ?? undefined,
-          depositCTAString,
-        })
-      );
+      const transferDepositContext = {
+        chainId: chainIdStr ?? undefined,
+        tokenAddress: sourceToken?.address ?? undefined,
+        tokenSymbol: sourceToken?.symbol ?? undefined,
+        slippage: slippage ?? undefined,
+        gasFee: summary?.gasFee ?? undefined,
+        bridgeFee: summary?.bridgeFee ?? undefined,
+        exchangeRate: summary?.exchangeRate ?? undefined,
+        estimatedRouteDuration: summary?.estimatedRouteDuration ?? undefined,
+        toAmount: summary?.toAmount ?? undefined,
+        toAmountMin: summary?.toAmountMin ?? undefined,
+        depositCTAString,
+      };
+      track(AnalyticsEvents.TransferDepositFundsClick(transferDepositContext));
+      dd.info('Transfer deposit click', transferDepositContext);
       try {
         e.preventDefault();
 
@@ -338,19 +339,12 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
           });
           abacusStateManager.clearTransferInputValues();
           setFromAmount('');
-
-          onDeposit?.({
-            chainId: chainIdStr || undefined,
-            tokenAddress: sourceToken?.address || undefined,
-            tokenSymbol: sourceToken?.symbol || undefined,
-            slippage: slippage || undefined,
-            gasFee: summary?.gasFee || undefined,
-            bridgeFee: summary?.bridgeFee || undefined,
-            exchangeRate: summary?.exchangeRate || undefined,
-            estimatedRouteDuration: summary?.estimatedRouteDuration || undefined,
-            toAmount: summary?.toAmount || undefined,
-            toAmountMin: summary?.toAmountMin || undefined,
-          });
+          const submittedTransferDepositContext = {
+            ...transferDepositContext,
+            txHash,
+          };
+          onDeposit?.(submittedTransferDepositContext);
+          dd.info('Transfer deposit submitted', submittedTransferDepositContext);
         }
       } catch (err) {
         log('DepositForm/onSubmit', err);
@@ -418,15 +412,17 @@ export const DepositForm = ({ onDeposit, onError }: DepositFormProps) => {
     }
 
     if (routeErrors) {
-      track(
-        AnalyticsEvents.RouteError({
-          transferType: TransferType.deposit.name,
-          errorMessage: routeErrorMessage ?? undefined,
-          amount: debouncedAmount,
-          chainId: chainIdStr ?? undefined,
-          assetId: sourceToken?.toString(),
-        })
-      );
+      const routeErrorContext = {
+        transferType: TransferType.deposit.name,
+        errorMessage: routeErrorMessage ?? undefined,
+        amount: debouncedAmount,
+        chainId: chainIdStr ?? undefined,
+        assetAddress: sourceToken?.address,
+        assetSymbol: sourceToken?.symbol,
+        assetName: sourceToken?.name,
+      };
+      track(AnalyticsEvents.RouteError(routeErrorContext));
+      dd.info('Route error received', routeErrorContext);
       return routeErrorMessage
         ? stringGetter({
             key: STRING_KEYS.SOMETHING_WENT_WRONG_WITH_MESSAGE,

diff --git a/src/views/forms/AccountManagementForms/WithdrawForm.tsx b/src/views/forms/AccountManagementForms/WithdrawForm.tsx
@@ -60,6 +60,7 @@ import { getSelectedLocale } from '@/state/localizationSelectors';
 import abacusStateManager from '@/lib/abacus';
 import { validateCosmosAddress } from '@/lib/addressUtils';
 import { track } from '@/lib/analytics/analytics';
+import { dd } from '@/lib/analytics/datadog';
 import { getRouteErrorMessageOverride } from '@/lib/errors';
 import { MustBigNumber } from '@/lib/numbers';
 import { getNobleChainId } from '@/lib/squid';
@@ -227,21 +228,21 @@ export const WithdrawForm = () => {
             setWithdrawAmount('');
 
             addOrUpdateTransferNotification({ ...notificationParams, txHash, isDummy: false });
-
-            track(
-              AnalyticsEvents.TransferWithdraw({
-                chainId: toChainId,
-                tokenAddress: toToken?.address || undefined,
-                tokenSymbol: toToken?.symbol || undefined,
-                slippage: slippage || undefined,
-                gasFee: summary?.gasFee || undefined,
-                bridgeFee: summary?.bridgeFee || undefined,
-                exchangeRate: summary?.exchangeRate || undefined,
-                estimatedRouteDuration: summary?.estimatedRouteDuration || undefined,
-                toAmount: summary?.toAmount || undefined,
-                toAmountMin: summary?.toAmountMin || undefined,
-              })
-            );
+            const transferWithdrawContext = {
+              chainId: toChainId,
+              tokenAddress: toToken?.address || undefined,
+              tokenSymbol: toToken?.symbol || undefined,
+              slippage: slippage || undefined,
+              gasFee: summary?.gasFee || undefined,
+              bridgeFee: summary?.bridgeFee || undefined,
+              exchangeRate: summary?.exchangeRate || undefined,
+              estimatedRouteDuration: summary?.estimatedRouteDuration || undefined,
+              toAmount: summary?.toAmount || undefined,
+              toAmountMin: summary?.toAmountMin || undefined,
+              txHash,
+            };
+            track(AnalyticsEvents.TransferWithdraw(transferWithdrawContext));
+            dd.info('Transfer withdraw submitted', transferWithdrawContext);
           } else {
             throw new Error('No transaction hash returned');
           }
@@ -436,16 +437,17 @@ export const WithdrawForm = () => {
         routeErrors,
         routeErrorMessage
       );
-
-      track(
-        AnalyticsEvents.RouteError({
-          transferType: TransferType.withdrawal.name,
-          errorMessage: routeErrorMessageOverride ?? undefined,
-          amount: debouncedAmount,
-          chainId: chainIdStr ?? undefined,
-          assetId: toToken?.toString(),
-        })
-      );
+      const routeErrorContext = {
+        transferType: TransferType.withdrawal.name,
+        errorMessage: routeErrorMessageOverride ?? undefined,
+        amount: debouncedAmount,
+        chainId: chainIdStr ?? undefined,
+        assetAddress: toToken?.address,
+        assetSymbol: toToken?.symbol,
+        assetName: toToken?.name,
+      };
+      track(AnalyticsEvents.RouteError(routeErrorContext));
+      dd.info('Route error received', routeErrorContext);
       return {
         errorMessage: routeErrorMessageOverride
           ? stringGetter({