chore: make pixel events more resilient

src/legacy/components/analytics/pixel/constants.ts

@@ -1,3 +1,6 @@
+// TODO: Leaving true just for testing, then i will enable for PROD and ENS
+export const PIXEL_ENABLED = true // isProd || isEns
+
 export enum PIXEL_EVENTS {
   INIT = 'init',
   CONNECT_WALLET = 'connect_wallet',

src/legacy/components/analytics/pixel/facebook.ts

@@ -1,11 +1,12 @@
 import { PIXEL_EVENTS } from './constants'
+import { sendPixel } from './utils'
 
 const events = {
   [PIXEL_EVENTS.INIT]: 'InitiateCheckout',
   [PIXEL_EVENTS.CONNECT_WALLET]: 'Contact',
   [PIXEL_EVENTS.POST_TRADE]: 'Lead',
 }
 
-export const sendFacebookEvent = (event: PIXEL_EVENTS) => {
+export const sendFacebookEvent = sendPixel((event) => {
   window.fbq?.('track', events[event])
-}
+})

src/legacy/components/analytics/pixel/linkedin.ts

@@ -1,11 +1,12 @@
 import { PIXEL_EVENTS } from './constants'
+import { sendPixel } from './utils'
 
 const events = {
   [PIXEL_EVENTS.INIT]: 10759506,
   [PIXEL_EVENTS.CONNECT_WALLET]: 10759514,
   [PIXEL_EVENTS.POST_TRADE]: 10759522,
 }
 
-export const sendLinkedinEvent = (event: PIXEL_EVENTS) => {
+export const sendLinkedinEvent = sendPixel((event) => {
   window.lintrk?.('track', { conversion_id: events[event] })
-}
+})

src/legacy/components/analytics/pixel/microsoft.ts

@@ -1,12 +1,13 @@
 import { PIXEL_EVENTS } from './constants'
+import { sendPixel } from './utils'
 
 const events = {
   [PIXEL_EVENTS.INIT]: 'page_view',
   [PIXEL_EVENTS.CONNECT_WALLET]: 'begin_checkout',
   [PIXEL_EVENTS.POST_TRADE]: 'purchase',
 }
 
-export const sendMicrosoftEvent = (event: PIXEL_EVENTS) => {
+export const sendMicrosoftEvent = sendPixel((event) => {
   window.uetq = window.uetq || []
   window.uetq.push('event', events[event], {})
-}
+})

src/legacy/components/analytics/pixel/paved.ts

@@ -1,11 +1,12 @@
 import { PIXEL_EVENTS } from './constants'
+import { sendPixel } from './utils'
 
 const events = {
   [PIXEL_EVENTS.INIT]: 'search',
   [PIXEL_EVENTS.CONNECT_WALLET]: 'sign_up',
   [PIXEL_EVENTS.POST_TRADE]: 'purchase',
 }
 
-export const sendPavedEvent = (event: PIXEL_EVENTS) => {
+export const sendPavedEvent = sendPixel((event: PIXEL_EVENTS) => {
   window.pvd?.('event', events[event])
-}
+})

src/legacy/components/analytics/pixel/reddit.ts

@@ -1,11 +1,12 @@
 import { PIXEL_EVENTS } from './constants'
+import { sendPixel } from './utils'
 
 const events = {
   [PIXEL_EVENTS.INIT]: 'Lead',
   [PIXEL_EVENTS.CONNECT_WALLET]: 'SignUp',
   [PIXEL_EVENTS.POST_TRADE]: 'Purchase',
 }
 
-export const sendRedditEvent = (event: PIXEL_EVENTS) => {
+export const sendRedditEvent = sendPixel((event) => {
   window.rdt?.('track', events[event])
-}
+})

src/legacy/components/analytics/pixel/twitter.ts

@@ -1,11 +1,12 @@
 import { PIXEL_EVENTS } from './constants'
+import { sendPixel } from './utils'
 
 const events = {
   [PIXEL_EVENTS.INIT]: 'tw-oddz2-oddz8',
   [PIXEL_EVENTS.CONNECT_WALLET]: 'tw-oddz2-oddza',
   [PIXEL_EVENTS.POST_TRADE]: 'tw-oddz2-oddzb',
 }
 
-export const sendTwitterEvent = (event: PIXEL_EVENTS) => {
+export const sendTwitterEvent = sendPixel((event: PIXEL_EVENTS) => {
   window.twq?.('event', events[event], {})
-}
+})

src/legacy/components/analytics/pixel/utils.ts

@@ -0,0 +1,17 @@
+import { PIXEL_ENABLED, PIXEL_EVENTS } from './constants'
+
+type SendPixelFn = (event: PIXEL_EVENTS) => void
+
+export function sendPixel(sendFn: SendPixelFn): SendPixelFn {
+  return (event) => {
+    if (!PIXEL_ENABLED) {
+      return
+    }
+
+    try {
+      sendFn(event)
+    } catch (e: any) {
+      console.error('Error sending pixel event', e)
+    }
+  }
+}