From a8db8e07fae5455ceba2e0b32f95286a482ee3b9 Mon Sep 17 00:00:00 2001 From: Charles Garrett Date: Thu, 1 Feb 2024 14:42:02 -0500 Subject: [PATCH] perf(analytics): adding events to report on caught errors 919 --- src/components/sandbox/Sandbox.js | 5 +++- src/components/sandbox/TabProps/index.js | 2 ++ src/components/vm/VmInitializer.tsx | 3 ++- src/hooks/useBosLoaderInitializer.ts | 5 ++-- src/hooks/useIdOS.ts | 5 +++- src/pages/settings.tsx | 5 +++- src/pages/signup.tsx | 7 +++++- src/utils/analytics.ts | 4 ++++ src/utils/notifications.ts | 30 +++++++++++++++++------- 9 files changed, 50 insertions(+), 16 deletions(-) diff --git a/src/components/sandbox/Sandbox.js b/src/components/sandbox/Sandbox.js index cd99d641d8..e3b14ce027 100644 --- a/src/components/sandbox/Sandbox.js +++ b/src/components/sandbox/Sandbox.js @@ -59,6 +59,7 @@ import { } from './utils/onboarding'; import Welcome from './Welcome'; import MainLoader from './Welcome/MainLoader'; +import { recordHandledError } from '@/utils/analytics'; export const Sandbox = ({ onboarding = false }) => { const near = useVmStore((store) => store.near); @@ -319,7 +320,8 @@ export const Sandbox = ({ onboarding = false }) => { }); changeCode(path, formattedCode); } catch (e) { - console.log(e); + console.error(e); + recordHandledError({ scope: 'sandbox reformatting', message: e.message || e }); } }; @@ -492,6 +494,7 @@ export const Sandbox = ({ onboarding = false }) => { } catch (e) { setParsedWidgetProps({}); setPropsError(e.message); + recordHandledError({ scope: 'setting component props within the sandbox editor', message: e.message || e }); } }, [widgetProps]); diff --git a/src/components/sandbox/TabProps/index.js b/src/components/sandbox/TabProps/index.js index 3e66c7cc4e..d4414dd165 100644 --- a/src/components/sandbox/TabProps/index.js +++ b/src/components/sandbox/TabProps/index.js @@ -2,6 +2,7 @@ import Editor from '@monaco-editor/react'; import React, { useCallback } from 'react'; import { Tab } from '../utils/const'; +import { recordHandledError } from '@/utils/analytics'; const TabProps = ({ tab, widgetProps, setWidgetProps, propsError }) => { const reformatProps = useCallback( @@ -11,6 +12,7 @@ const TabProps = ({ tab, widgetProps, setWidgetProps, propsError }) => { setWidgetProps(formattedProps); } catch (e) { console.log(e); + recordHandledError({ scope: 'sandbox reformatProps', message: e.message || e }); } }, [setWidgetProps], diff --git a/src/components/vm/VmInitializer.tsx b/src/components/vm/VmInitializer.tsx index 90afeda03a..4b5b5899d7 100644 --- a/src/components/vm/VmInitializer.tsx +++ b/src/components/vm/VmInitializer.tsx @@ -36,7 +36,7 @@ import { useSignInRedirect } from '@/hooks/useSignInRedirect'; import { useAuthStore } from '@/stores/auth'; import { useIdosStore } from '@/stores/idosStore'; import { useVmStore } from '@/stores/vm'; -import { recordWalletConnect, reset as resetAnalytics } from '@/utils/analytics'; +import { recordHandledError, recordWalletConnect, reset as resetAnalytics } from '@/utils/analytics'; import { commitModalBypassAuthorIds, commitModalBypassSources, @@ -173,6 +173,7 @@ export default function VmInitializer() { } catch (err) { const errMsg = err instanceof Error ? err.message : 'Something went wrong'; alert(errMsg); + recordHandledError({ scope: 'requestSignMessage', message: errMsg }); } }, [near], diff --git a/src/hooks/useBosLoaderInitializer.ts b/src/hooks/useBosLoaderInitializer.ts index d6d5d3698e..90f374e93e 100644 --- a/src/hooks/useBosLoaderInitializer.ts +++ b/src/hooks/useBosLoaderInitializer.ts @@ -3,6 +3,7 @@ import { useCallback, useEffect } from 'react'; import { useBosLoaderStore } from '@/stores/bos-loader'; import { useFlags } from './useFlags'; +import { recordHandledError } from '@/utils/analytics'; export function useBosLoaderInitializer() { const [flags] = useFlags(); @@ -37,9 +38,9 @@ export function useBosLoaderInitializer() { hasResolved: true, redirectMap: data.components, }); - } catch (e) { + } catch (e: any) { console.error(e); - + recordHandledError({ scope: 'requestSignMessage', message: e.message || e }); setStore({ failedToLoad: true, hasResolved: true, diff --git a/src/hooks/useIdOS.ts b/src/hooks/useIdOS.ts index 500ff70f9d..74b4b60c21 100644 --- a/src/hooks/useIdOS.ts +++ b/src/hooks/useIdOS.ts @@ -2,6 +2,7 @@ import { idOS } from '@idos-network/idos-sdk'; import { useCallback, useEffect } from 'react'; import { useIdosStore } from '@/stores/idosStore'; +import { recordHandledError } from '@/utils/analytics'; export function useIdOS() { const setIdosStore = useIdosStore((state) => state.set); @@ -15,7 +16,9 @@ export function useIdOS() { })) as any; setIdosStore({ idOS: idos }); } catch (error: any) { - console.error('Failed to initialize IDOS: ', error); + const scope = 'Failed to initialize IDOS:'; + console.error(scope, error); + recordHandledError({ scope, message: error.message || error }); } }, [setIdosStore]); diff --git a/src/pages/settings.tsx b/src/pages/settings.tsx index 95b19606e4..af8245579a 100644 --- a/src/pages/settings.tsx +++ b/src/pages/settings.tsx @@ -13,6 +13,7 @@ import { useDefaultLayout } from '@/hooks/useLayout'; import { useAuthStore } from '@/stores/auth'; import { useIdosStore } from '@/stores/idosStore'; import type { NextPageWithLayout } from '@/utils/types'; +import { recordHandledError } from '@/utils/analytics'; const SettingsPage: NextPageWithLayout = () => { const components = useBosComponents(); @@ -49,8 +50,10 @@ const SettingsPage: NextPageWithLayout = () => { }); } } catch (error: any) { - console.error('Failed to init wallet + idOS: ', error); + const scope = 'Failed to init wallet + idOS: '; + console.error(scope, error); const errorMessage = error.message ? error.message : 'unknown'; + recordHandledError({ scope, message: errorMessage || error }); setError({ type: 'ERROR', title: 'Falilure during idOS initialization:', diff --git a/src/pages/signup.tsx b/src/pages/signup.tsx index f54fc5180a..0a8b0bd794 100644 --- a/src/pages/signup.tsx +++ b/src/pages/signup.tsx @@ -13,6 +13,7 @@ import { network } from '@/utils/config'; import type { NextPageWithLayout } from '@/utils/types'; import { accountAddressPatternNoSubaccount, emailPattern, getEmailId, isValidEmail } from '../utils/form-validation'; +import { recordHandledError } from '@/utils/analytics'; const ErrorText = styled.p` color: hsla(8, 100%, 33%, 1); @@ -76,8 +77,12 @@ const SignUpPage: NextPageWithLayout = () => { if (data?.result?.code_hash) { return setIsAccountAvailable(false); } - } catch (error) { + } catch (error: any) { console.log(error); + recordHandledError({ + scope: 'sign-up: account availability check', + message: error.message || error, + }); setIsAccountAvailable(false); } }, []); diff --git a/src/utils/analytics.ts b/src/utils/analytics.ts index 6a1a9e2ed0..ecc7f45e44 100644 --- a/src/utils/analytics.ts +++ b/src/utils/analytics.ts @@ -162,6 +162,10 @@ export function recordEventWithProps(eventLabel: string, properties: Record) { + recordEventWithProps('error-handled', props); +} + export function recordEvent(eventLabel: string) { if (!rudderAnalytics) return; try { diff --git a/src/utils/notifications.ts b/src/utils/notifications.ts index d27a95e8b6..32ae6bdfe0 100644 --- a/src/utils/notifications.ts +++ b/src/utils/notifications.ts @@ -16,6 +16,7 @@ import { setProcessSuccess, } from './notificationsLocalStorage'; import type { NotificationSubscriptionData } from './types'; +import { recordHandledError } from './analytics'; // min version for iOS to support notifications export const recommendedIosVersionForNotifications = 16.4; @@ -23,16 +24,20 @@ export const recommendedIosVersionForNotifications = 16.4; const handleRequestPermission = () => { try { return Notification.requestPermission(); - } catch (error) { - console.error('Error while requesting permission.', error); + } catch (error: any) { + const scope = 'Error while requesting Notification permission.'; + console.error(scope, error); + recordHandledError({ scope, message: error.message || error }); } }; const registerServiceWorker = () => { try { return navigator.serviceWorker.register('/service-worker.js'); - } catch (error) { - console.error('Error while registering service-worker.', error); + } catch (e: any) { + const scope = 'Error while registering service-worker.js'; + console.error(scope, e); + recordHandledError({ scope, message: e.message || e }); } }; @@ -50,8 +55,9 @@ const handlePushManagerSubscribe = async () => { userVisibleOnly: true, applicationServerKey: notificationApplicationServerKey, }); - } catch (e) { - console.error('Error while subscribing to service-worker.', e); + } catch (e: any) { + const scope = 'Error while subscribing to service-worker.'; + recordHandledError({ scope, message: e.message || e }); throw e; } }; @@ -65,8 +71,10 @@ export const handlePushManagerUnsubscribe = async (hide: () => void) => { await pushServerUnsubscribe(subscription); await unregisterServiceWorker(); await subscription?.unsubscribe(); - } catch (error) { - // TODO: handle + } catch (e: any) { + const scope = 'Error while handling unsubscribe'; + console.error(scope, e); + recordHandledError({ scope, message: e.message || e }); } finally { hide(); } @@ -129,8 +137,12 @@ export const handleTurnOn = async (accountId: string, hideModal: () => void) => }); setProcessSuccess(); - } catch (error: unknown) { + } catch (error: any) { setProcessError(error); + recordHandledError({ + scope: 'Error in the attempt to turn on Push Notifications', + message: error.message || error, + }); } finally { hideModal(); setProcessEnded();