feat(tooling): add sentry and amplitude analytics to wallet and explo…

…rer (#3945) * feat: enable sentry for testnet tracking * feat: add sentry envs and webpack configurations * refactor: localnet network name * feat: add production configurations * feat(tooling-sdk): Add a default env value empty for SENTRY_AUTH_TOKEN * feat: update nightlhy wallet build to use dev and not sentry * feat: configure sentry in explorer * feat: add amplitude support in the wallet * feat(tooling-wallet): Restore the lib path in wallet/ampli.json * feat(tooling-wallet): Fix wrong branch in wallet/ampli.json * feat(tooling-explorer): Update explorer ampli.json * feat(tooling-explorer): Update explorer amplitude types config * feat(tooling-wallet): Format ampli.json * feat(tooling-wallet): Remove SENTRY token env from wallet_rc workflow * refactor(ci): Add nightly-only type of build * fmt * feat(wallet): Update sentry DSNs to EU * feat(wallet): Update org for sentry plugin source maps upload * feat(explorer):Update sentry DSNs to EU * fix: nightly envs --------- Co-authored-by: Mario Sarcevic <[email protected]> Co-authored-by: marc2332 <[email protected]>
iotaledger · Nov 12, 2024 · 6fec2b0 · 6fec2b0
1 parent 753ecf0
commit 6fec2b0
Show file tree

Hide file tree

Showing 28 changed files with 115 additions and 105 deletions.
diff --git a/.github/workflows/apps_wallet_nightly_build.yml b/.github/workflows/apps_wallet_nightly_build.yml
@@ -43,7 +43,7 @@ jobs:
           restore-keys: |
             turbo-${{ runner.os }}-
       - name: Build Wallet
-        run: pnpm wallet build
+        run: pnpm wallet build:nightly
       - name: Upload artifacts
         uses: actions/upload-artifact@b4b15b8c7c6ac21ea08fcf65892d2ee8f75cf882 # pin@v4
         with:

diff --git a/.github/workflows/apps_wallet_prod_build.yml b/.github/workflows/apps_wallet_prod_build.yml
@@ -9,6 +9,7 @@ env:
   DEFAULT_NETWORK: ${{ secrets.WALLET_PROD_DEFAULT_NETWORK }}
   IOTA_NETWORKS: ${{ secrets.WALLET_PROD_IOTA_NETWORKS }}
   APPS_BACKEND: ${{ secrets.WALLET_PROD_APPS_BACKEND }}
+  SENTRY_AUTH_TOKEN: ${{ secrets.TOOLING_SENTRY_AUTH_TOKEN }}
 
 jobs:
   wallet-prod-build:

diff --git a/apps/explorer/.env.example b/apps/explorer/.env.example
@@ -1,5 +1 @@
 VITE_SENTRY_SAMPLE_RATE=xxxxxxx
-VITE_PROD_SENTRY_DSN=xxxxxxx
-VITE_DEV_SENTRY_DSN=xxxxxxx
-VITE_AMPLI_PROD_API_KEY=xxxxxxx
-VITE_AMPLI_DEV_API_KEY=xxxxxxx
diff --git a/apps/explorer/ampli.json b/apps/explorer/ampli.json
@@ -1,14 +1,14 @@
 {
-    "Zone": "us",
-    "OrgId": "216883",
-    "WorkspaceId": "cee48712-5b35-403d-af7e-a46bf71ee2c7",
-    "SourceId": "f2439a98-2bcd-4e46-a2a5-38662eda6d51",
+    "Zone": "eu",
+    "OrgId": "100007351",
+    "WorkspaceId": "141ec983-01d0-4494-a140-3463d0a8ce27",
+    "SourceId": "ba177631-4a93-48e1-91f4-c45b3ac4d63f",
+    "Branch": "main",
+    "Version": "1.0.0",
+    "VersionId": "81db59d9-e06e-4c91-be42-e1b536a9f68a",
     "Runtime": "browser:typescript-ampli-v2",
     "Platform": "Browser",
     "Language": "TypeScript",
     "SDK": "@amplitude/analytics-browser@^1.0",
-    "Branch": "main",
-    "Version": "1.0.0",
-    "VersionId": "e04b8300-7375-4e37-a47e-7eb097e55c65",
     "Path": "./src/utils/analytics/ampli"
 }
diff --git a/apps/explorer/src/components/activity/Activity.tsx b/apps/explorer/src/components/activity/Activity.tsx
@@ -72,7 +72,7 @@ export function Activity({ initialLimit, disablePagination }: ActivityProps): JS
     const refetchInterval = paused || !pollingTxnTableEnabled ? undefined : REFETCH_INTERVAL;
     // TODO remove network check when querying transactions with TransactionKind filter is fixed on devnet and testnet
     /*const [network] = useNetwork();
-    const isTransactionKindFilterEnabled = Network.MAINNET === network || Network.LOCAL === network;
+    const isTransactionKindFilterEnabled = Network.Mainnet === network || Network.Localnet === network;
     const [showSystemTransactions, setShowSystemTransaction] = useState(
         !isTransactionKindFilterEnabled,
     );

diff --git a/apps/explorer/src/hooks/useEnhancedRpc.ts b/apps/explorer/src/hooks/useEnhancedRpc.ts
@@ -12,7 +12,7 @@ export function useEnhancedRpcClient(): IotaClient {
     const [network] = useNetwork();
     const client = useIotaClient();
     const enhancedRpc = useMemo(() => {
-        if (network === Network.Local) {
+        if (network === Network.Localnet) {
             return new IotaClient({ url: 'http://localhost:9124' });
         }
 

diff --git a/apps/explorer/src/lib/utils/analytics/ampli/index.ts b/apps/explorer/src/lib/utils/analytics/ampli/index.ts
@@ -26,8 +26,8 @@ import * as amplitude from '@amplitude/analytics-browser';
 type Environment = 'production' | 'development';
 
 export const ApiKey: Record<Environment, string> = {
-    production: import.meta.env.VITE_AMPLI_PROD_API_KEY,
-    development: import.meta.env.VITE_AMPLI_DEV_API_KEY,
+    production: '896b9073219c06800d9bf0aecf1b6f80',
+    development: '253fa1582d8ed913d8c5957f601df3fe',
 };
 
 /**
@@ -38,14 +38,15 @@ export const DefaultConfiguration: BrowserOptions = {
         version: '1',
         branch: 'main',
         source: 'web',
-        versionId: 'e04b8300-7375-4e37-a47e-7eb097e55c65',
+        versionId: '81db59d9-e06e-4c91-be42-e1b536a9f68a',
     },
     ...{
         ingestionMetadata: {
             sourceName: 'browser-typescript-ampli',
             sourceVersion: '2.0.0',
         },
     },
+    serverZone: amplitude.Types.ServerZone.EU,
 };
 
 interface LoadOptionsBase {

diff --git a/apps/explorer/src/lib/utils/api/defaultRpcClient.ts b/apps/explorer/src/lib/utils/api/defaultRpcClient.ts
@@ -29,7 +29,7 @@ export const createIotaClient = (network: NetworkId): IotaClient => {
 
     const client = new IotaClient({
         transport:
-            supportedNetwork && network === Network.Mainnet
+            supportedNetwork && network === Network.Testnet // Sentry dev hint: change this to eg [Network.Localnet]
                 ? new SentryHttpTransport(networkUrl)
                 : new IotaHTTPTransport({ url: networkUrl }),
     });

diff --git a/apps/explorer/src/lib/utils/sentry.ts b/apps/explorer/src/lib/utils/sentry.ts
@@ -14,14 +14,14 @@ import {
 const SENTRY_ENABLED = import.meta.env.PROD;
 const SENTRY_SAMPLE_RATE = import.meta.env.VITE_SENTRY_SAMPLE_RATE
     ? parseFloat(import.meta.env.VITE_SENTRY_SAMPLE_RATE)
-    : 1;
+    : 0;
 
 export function initSentry() {
     Sentry.init({
         enabled: SENTRY_ENABLED,
         dsn: import.meta.env.PROD
-            ? import.meta.env.VITE_PROD_SENTRY_DSN
-            : import.meta.env.VITE_DEV_SENTRY_DSN,
+            ? 'https://ce107602e4d122f0639332c7c43fdc08@o4508279186718720.ingest.de.sentry.io/4508279962140752'
+            : 'https://c8085701fa2650fb2a090ed6aba6bc62@o4508279186718720.ingest.de.sentry.io/4508279963320400',
         environment: import.meta.env.VITE_VERCEL_ENV,
         integrations: [
             new Sentry.BrowserTracing({
@@ -56,10 +56,6 @@ export function initSentry() {
             /^chrome(?:-extension)?:\/\//i,
             /<anonymous>/,
         ],
-        allowUrls: [
-            /.*\.iota\.org/i,
-            /.*-iota-foundation\.vercel\.app/i,
-            'explorer-topaz.vercel.app',
-        ],
+        allowUrls: [/.*\.iota\.org/i, /.*\.iota\.cafe/i, /.*\.iotaledger\.net/i],
     });
 }
diff --git a/apps/wallet/ampli.json b/apps/wallet/ampli.json
@@ -1,14 +1,14 @@
 {
-    "Zone": "us",
-    "OrgId": "216883",
-    "WorkspaceId": "d08bae31-a74f-45c2-985d-2f5dc943b2ea",
-    "SourceId": "409326bd-fc3f-453e-9275-0bab406831d2",
-    "Branch": "main",
-    "Version": "3.0.0",
-    "VersionId": "e417ca76-bc93-4e57-b900-d5cd7c4b033c",
+    "Zone": "eu",
+    "OrgId": "100007351",
+    "WorkspaceId": "114d6e91-e23e-4185-9235-5d8bf8fac617",
+    "SourceId": "0bdd0a01-5a4b-4659-86b6-9413d1341b4e",
     "Runtime": "browser:typescript-ampli-v2",
     "Platform": "Browser",
     "Language": "TypeScript",
     "SDK": "@amplitude/analytics-browser@^1.0",
+    "Branch": "main",
+    "Version": "1.0.0",
+    "VersionId": "bc7a9c07-e259-439c-b48c-026b16a8a548",
     "Path": "./src/shared/analytics/ampli"
 }
diff --git a/apps/wallet/configs/webpack/webpack.config.common.ts b/apps/wallet/configs/webpack/webpack.config.common.ts
@@ -25,10 +25,17 @@ const CONFIGS_ROOT = resolve(PROJECT_ROOT, 'configs');
 const SRC_ROOT = resolve(PROJECT_ROOT, 'src');
 const OUTPUT_ROOT = resolve(PROJECT_ROOT, 'dist');
 const TS_CONFIGS_ROOT = resolve(CONFIGS_ROOT, 'ts');
+const IS_NIGHTLY = process.env.NODE_ENV === 'nightly';
 const IS_DEV = process.env.NODE_ENV === 'development';
 const IS_PROD = process.env.NODE_ENV === 'production';
 const TS_CONFIG_FILE = resolve(TS_CONFIGS_ROOT, `tsconfig.${IS_DEV ? 'dev' : 'prod'}.json`);
-const APP_NAME = WALLET_RC ? 'IOTA Wallet (RC)' : IS_DEV ? 'IOTA Wallet (DEV)' : 'IOTA Wallet';
+const APP_NAME = WALLET_RC
+    ? 'IOTA Wallet (RC)'
+    : IS_DEV
+      ? 'IOTA Wallet (DEV)'
+      : IS_NIGHTLY
+        ? 'IOTA Wallet (Nightly)'
+        : 'IOTA Wallet';
 
 dotenv.config({
     path: [resolve(SDK_ROOT, '.env'), resolve(SDK_ROOT, '.env.defaults')],
@@ -227,13 +234,14 @@ const commonConfig: () => Promise<Configuration> = async () => {
                 'process.env.DEFAULT_NETWORK': JSON.stringify(process.env.DEFAULT_NETWORK),
                 'process.env.IOTA_NETWORKS': JSON.stringify(process.env.IOTA_NETWORKS),
                 'process.env.APPS_BACKEND': JSON.stringify(process.env.APPS_BACKEND),
+                'process.env.SENTRY_AUTH_TOKEN': JSON.stringify(process.env.SENTRY_AUTH_TOKEN),
             }),
             new ProvidePlugin({
                 Buffer: ['buffer', 'Buffer'],
             }),
             new SentryWebpackPlugin({
-                org: 'iota-foundation',
-                project: 'wallet',
+                org: 'iota-foundation-eu',
+                project: 'iota-wallet', // Sentry dev hint: use 'iota-wallet-dev' project for testing
                 include: OUTPUT_ROOT,
                 dryRun: !IS_PROD || !sentryAuthToken,
                 authToken: sentryAuthToken,

diff --git a/apps/wallet/package.json b/apps/wallet/package.json
@@ -9,6 +9,7 @@
         "build:prod": "cross-env NODE_ENV=\"production\" TS_NODE_PROJECT=\"./configs/ts/tsconfig.webpack.json\" webpack --progress",
         "build:dev": "cross-env NODE_ENV=\"development\" TS_NODE_PROJECT=\"./configs/ts/tsconfig.webpack.json\" webpack --progress",
         "build:rc": "cross-env WALLET_RC=true NODE_ENV=\"production\" TS_NODE_PROJECT=\"./configs/ts/tsconfig.webpack.json\" webpack --progress",
+        "build:nightly": "cross-env NODE_ENV=\"nightly\" TS_NODE_PROJECT=\"./configs/ts/tsconfig.webpack.json\" webpack --progress",
         "prettier:check": "prettier -c --ignore-unknown --ignore-path=../../.prettierignore --ignore-path=.prettierignore .",
         "prettier:fix": "prettier -w --ignore-unknown --ignore-path=../../.prettierignore --ignore-path=.prettierignore .",
         "prettier:fix:watch": "onchange '**' -i -f add -f change -j 5 -- prettier -w --ignore-unknown --ignore-path=../../.prettierignore --ignore-path=.prettierignore {{file}}",
@@ -43,7 +44,7 @@
         "@amplitude/analytics-types": "^0.20.0",
         "@playwright/test": "^1.46.1",
         "@sentry/react": "^7.59.2",
-        "@sentry/webpack-plugin": "^1.20.0",
+        "@sentry/webpack-plugin": "^1.21.0",
         "@svgr/webpack": "^7.0.0",
         "@types/git-rev-sync": "^2.0.0",
         "@types/node": "^20.14.10",

diff --git a/apps/wallet/src/background/index.ts b/apps/wallet/src/background/index.ts
@@ -15,13 +15,13 @@ import Alarms, { AUTO_LOCK_ALARM_NAME, CLEAN_UP_ALARM_NAME } from './Alarms';
 import { Connections } from './connections';
 import NetworkEnv from './NetworkEnv';
 import Permissions from './Permissions';
-// import { initSentry } from './sentry';
+import { initSentry } from './sentry';
 import Transactions from './Transactions';
 
 growthbook.loadFeatures().catch(() => {
     // silence the error
 });
-// initSentry();
+initSentry();
 
 Browser.runtime.onInstalled.addListener(async ({ reason, previousVersion }) => {
     // Skip automatically opening the onboarding in end-to-end tests.

diff --git a/apps/wallet/src/shared/analytics/ampli/index.ts b/apps/wallet/src/shared/analytics/ampli/index.ts
@@ -26,26 +26,27 @@ import * as amplitude from '@amplitude/analytics-browser';
 export type Environment = 'production' | 'development';
 
 const API_KEY: Record<Environment, string> = {
-    production: '05c63856469c4e1d4aa9a6c1b2298d3b',
-    development: '938968357fcb3bf031d27b5049f62449',
+    production: '2a5d35822a1bab41835813f0223f319e',
+    development: '30a15c4ef8ae0e10ce5d2ed4f0023de3',
 };
 
 /**
  * Default Amplitude configuration options. Contains tracking plan information.
  */
 const DEFAULT_CONFIGURATION: BrowserOptions = {
     plan: {
-        version: '3',
+        version: '1',
         branch: 'main',
         source: 'web',
-        versionId: 'e417ca76-bc93-4e57-b900-d5cd7c4b033c',
+        versionId: 'ca799820-3dab-4797-bf37-22ff7cc67e78',
     },
     ...{
         ingestionMetadata: {
             sourceName: 'browser-typescript-ampli',
             sourceVersion: '2.0.0',
         },
     },
+    serverZone: amplitude.Types.ServerZone.EU,
 };
 
 export interface LoadOptionsBase {
@@ -635,11 +636,11 @@ export class Ampli {
   }
 
   private isInitializedAndEnabled(): boolean {
-		// if (!this.amplitude) {
-		// 	console.error('ERROR: Ampli is not yet initialized. Have you called ampli.load() on app start?');
-		// 	return false;
-		// }
-		return false;
+		if (!this.amplitude) {
+			console.error('ERROR: Ampli is not yet initialized. Have you called ampli.load() on app start?');
+			return false;
+		}
+		return !this.disabled;
   }
 
   /**

diff --git a/apps/wallet/src/shared/analytics/amplitude.ts b/apps/wallet/src/shared/analytics/amplitude.ts
@@ -32,9 +32,9 @@ export async function initAmplitude() {
 }
 
 export function getUrlWithDeviceId(url: URL) {
-    // const amplitudeDeviceId = ampli.client.getDeviceId();
-    // if (amplitudeDeviceId) {
-    // 	url.searchParams.append('deviceId', amplitudeDeviceId);
-    // }
+    const amplitudeDeviceId = ampli.client.getDeviceId();
+    if (amplitudeDeviceId) {
+        url.searchParams.append('deviceId', amplitudeDeviceId);
+    }
     return url;
 }
diff --git a/apps/wallet/src/shared/iota-client.ts b/apps/wallet/src/shared/iota-client.ts
@@ -8,7 +8,7 @@ import { SentryHttpTransport } from '@iota/core';
 import { getNetwork, Network, IotaClient, IotaHTTPTransport } from '@iota/iota-sdk/client';
 
 const iotaClientPerNetwork = new Map<string, IotaClient>();
-const SENTRY_MONITORED_ENVS = [Network.Custom];
+const SENTRY_MONITORED_ENVS = [Network.Testnet]; // Sentry dev hint: change this to eg [Network.Localnet]
 
 export function getIotaClient({ network, customRpcUrl }: NetworkEnvType): IotaClient {
     const key = `${network}_${customRpcUrl}`;

diff --git a/apps/wallet/src/shared/sentry-config.ts b/apps/wallet/src/shared/sentry-config.ts
@@ -8,12 +8,12 @@ import Browser from 'webextension-polyfill';
 const WALLET_VERSION = Browser.runtime.getManifest().version;
 const IS_PROD = process.env.NODE_ENV === 'production';
 
-// NOTE: If you want to enable sentry in dev, you can tweak this value:
+// Sentry dev hint: If you want to enable sentry in dev, you can tweak this value:
 const ENABLE_SENTRY = IS_PROD;
 
 const SENTRY_DSN = IS_PROD
-    ? 'https://e52a4e5c90224fe0800cc96aa2570581@o1314142.ingest.sentry.io/6761112'
-    : 'https://d1022411f6284cab9660146f3aa514d2@o1314142.ingest.sentry.io/4504697974751232';
+    ? 'https://36e3e3c59a2e842034b2fc624103b72a@o4508279186718720.ingest.de.sentry.io/4508279958536272'
+    : 'https://36c25e34e606cac787b1536348101976@o4508279186718720.ingest.de.sentry.io/4508279960895568';
 
 export function getSentryConfig({
     integrations,
@@ -27,8 +27,8 @@ export function getSentryConfig({
         tracesSampler: IS_PROD ? tracesSampler : () => 1,
         allowUrls: IS_PROD
             ? [
-                  'ehndjpedolgphielnhnpnkomdhgpaaei', // chrome beta
-                  'opcgpfmipidbgpenhmajoajpbobppdil', // chrome prod
+                  'nlmllpflpelpannpijhhnbhekpbpejch', // chrome rc
+                  'iidjkmdceolghepehaaddojmnjnkkija', // chrome prod
               ]
             : undefined,
     };

diff --git a/apps/wallet/src/ui/app/components/menu/content/WalletSettingsMenuList.tsx b/apps/wallet/src/ui/app/components/menu/content/WalletSettingsMenuList.tsx
@@ -28,6 +28,7 @@ import {
     CardType,
     ImageType,
 } from '@iota/apps-ui-kit';
+import { ampli } from '_src/shared/analytics/ampli';
 
 function MenuList() {
     const navigate = useNavigate();
@@ -46,7 +47,7 @@ function MenuList() {
     const logoutMutation = useMutation({
         mutationKey: ['logout', 'clear wallet'],
         mutationFn: async () => {
-            // ampli.client.reset();
+            ampli.client.reset();
             queryClient.cancelQueries();
             queryClient.clear();
             await persister.removeClient();

diff --git a/apps/wallet/src/ui/app/pages/home/transfer-coin/index.tsx b/apps/wallet/src/ui/app/pages/home/transfer-coin/index.tsx
@@ -14,7 +14,7 @@ import {
     useCoinMetadata,
     useFormatCoin,
 } from '@iota/core';
-// import * as Sentry from '@sentry/react';
+import * as Sentry from '@sentry/react';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { useMemo, useState } from 'react';
 import { toast } from 'react-hot-toast';
@@ -56,22 +56,22 @@ function TransferCoinPage() {
             if (!transaction || !signer) {
                 throw new Error('Missing data');
             }
-
-            // const sentryTransaction = Sentry.startTransaction({
-            // 	name: 'send-tokens',
-            // });
-            return signer.signAndExecuteTransaction({
-                transactionBlock: transaction,
-                options: {
-                    showInput: true,
-                    showEffects: true,
-                    showEvents: true,
-                },
+            const sentryTransaction = Sentry.startTransaction({
+                name: 'send-tokens',
             });
 
-            // finally {
-            // sentryTransaction.finish();
-            // }
+            try {
+                return signer.signAndExecuteTransaction({
+                    transactionBlock: transaction,
+                    options: {
+                        showInput: true,
+                        showEffects: true,
+                        showEvents: true,
+                    },
+                });
+            } finally {
+                sentryTransaction.finish();
+            }
         },
         onSuccess: (response) => {
             queryClient.invalidateQueries({ queryKey: ['get-coins'] });