removes google analytics, adds posthog.capture

EveripediaNetwork · Jun 24, 2024 · 0bd3eba · 0bd3eba
1 parent 112b4b7
commit 0bd3eba
Show file tree

Hide file tree

Showing 10 changed files with 31 additions and 143 deletions.
diff --git a/src/components/SEO/GoogleAnalyticsScripts.tsx b/src/components/SEO/GoogleAnalyticsScripts.tsx
diff --git a/src/components/client/AppProviders.tsx b/src/components/client/AppProviders.tsx
@@ -10,7 +10,6 @@ import { connectors, publicClient, webSocketPublicClient } from '@/config/wagmi'
 import { store } from '@/store/store'
 import { UALProviderSwitch, WalletProvider } from '@/context/eosWalletContext'
 import { DashboardLayout } from '@/components/dashboard/layout'
-import GoogleAnalyticsScripts from '@/components/SEO/GoogleAnalyticsScripts'
 import chakraTheme from '@/theme'
 import { CSPostHogProvider } from './PosthogProvider'
 
@@ -32,7 +31,6 @@ const AppProviders = ({ children }: { children: React.ReactNode }) => {
           <Fonts />
           <WagmiConfig config={client}>
             <CSPostHogProvider>
-              <GoogleAnalyticsScripts />
               <UALProviderSwitch>
                 <WalletProvider>
                   <DashboardLayout>{children}</DashboardLayout>

diff --git a/src/components/client/BridgePage.tsx b/src/components/client/BridgePage.tsx
@@ -21,7 +21,6 @@ import {
 import { IQEosLogo } from '@/components/iq-eos-logo'
 import { IQEthLogo } from '@/components/iq-eth-logo'
 import { Swap } from '@/components/icons/swap'
-import { logEvent } from '@/utils/googleAnalytics'
 import { useGetIqPriceQuery } from '@/services/iqPrice'
 import { getError } from '@/utils/getError'
 import NetworkErrorNotification from '@/components/lock/NetworkErrorNotification'
@@ -112,7 +111,7 @@ const BridgePage = () => {
       const { error } = await bridgeFromPTokenToEth(tokenInputAmount)
       if (error) isError = true
       showToast(
-        error || 'Ptokens bridged successfully',
+        error ?? 'Ptokens bridged successfully',
         error ? 'error' : 'success',
       )
     }
@@ -126,18 +125,11 @@ const BridgePage = () => {
 
       if (error) isError = true
       showToast(
-        error || 'IQ bridged successfully to EOS',
+        error ?? 'IQ bridged successfully to EOS',
         error ? 'error' : 'success',
       )
     }
 
-    logEvent({
-      action: isError ? 'TOKEN_BRIDGE_ERROR' : 'TOKEN_BRIDGE_SUCCESS',
-      label: JSON.stringify(inputAddress),
-      value: 1,
-      category: isError ? 'token_bridge_error' : 'token_bridge_success',
-    })
-
     posthog.capture('bridge_transaction', {
       action: isError ? 'TOKEN_BRIDGE_ERROR' : 'TOKEN_BRIDGE_SUCCESS',
       label: JSON.stringify(inputAddress),
@@ -149,7 +141,7 @@ const BridgePage = () => {
   }
 
   const getSpecificBalance = (id: TokenId) => {
-    if (id) return parseInt(balances.find((b) => b.id === id)?.balance || '')
+    if (id) return parseInt(balances.find(b => b.id === id)?.balance || '')
 
     return 0
   }
@@ -268,8 +260,8 @@ const BridgePage = () => {
 
   useEffect(() => {
     if (pIQBalance)
-      setBalances((currentBalances) =>
-        currentBalances.map((b) => {
+      setBalances(currentBalances =>
+        currentBalances.map(b => {
           if (b.id === TokenId.PIQ) b.balance = pIQBalance
 
           return b
@@ -279,8 +271,8 @@ const BridgePage = () => {
 
   useEffect(() => {
     if (iqBalanceOnEth)
-      setBalances((currentBalances) =>
-        currentBalances.map((b) => {
+      setBalances(currentBalances =>
+        currentBalances.map(b => {
           if (b.id === TokenId.IQ) b.balance = iqBalanceOnEth
 
           return b
@@ -293,7 +285,7 @@ const BridgePage = () => {
       const balance = await getUserTokenBalance(authContext)
       if (balance)
         setBalances(
-          balances.map((b) => {
+          balances.map(b => {
             if (b.id === TokenId.EOS)
               b.balance = balance.toString().replace(' IQ', '')
             return b

diff --git a/src/components/client/PosthogProvider.tsx b/src/components/client/PosthogProvider.tsx
@@ -21,7 +21,9 @@ export const CSPostHogProvider = ({
   )
 }
 
-function PosthogAuthWrapper({ children }: React.PropsWithChildren<{}>) {
+function PosthogAuthWrapper({
+  children,
+}: Readonly<React.PropsWithChildren<{}>>) {
   const { address, connector } = useAccount()
 
   useEffect(() => {

diff --git a/src/components/dashboard/Exchanges.tsx b/src/components/dashboard/Exchanges.tsx
@@ -1,4 +1,3 @@
-import { logEvent } from '@/utils/googleAnalytics'
 import { Divider, Flex, Link as ChakraLink, Text } from '@chakra-ui/layout'
 import { IconButton } from '@chakra-ui/react'
 import Link from 'next/link'
@@ -30,12 +29,6 @@ const ExchangeLink: React.FC<IconButtonProps> = ({
       href={href}
       target="_blank"
       onClick={() => {
-        logEvent({
-          category: 'Dashboard',
-          action: 'Click',
-          label: `${logEventLabel}`,
-          value: 1,
-        })
         posthog.capture('exchange_link_click', {
           category: 'Dashboard',
           target: logEventLabel,

diff --git a/src/components/lock/IncreaseLockTime.tsx b/src/components/lock/IncreaseLockTime.tsx
@@ -7,11 +7,11 @@ import { useReward } from '@/hooks/useReward'
 import { useAccount, useWaitForTransaction } from 'wagmi'
 import { calculateReturn } from '@/utils/LockOverviewUtils'
 import { Dict } from '@chakra-ui/utils'
-import { logEvent } from '@/utils/googleAnalytics'
 import { useReusableToast } from '@/hooks/useToast'
 import { useLockEnd } from '@/hooks/useLockEnd'
 import LockFormCommon from './LockFormCommon'
 import LockSlider from '../elements/Slider/LockSlider'
+import { usePostHog } from 'posthog-js/react'
 
 const IncreaseLockTime = () => {
   const { increaseLockPeriod } = useLock()
@@ -26,6 +26,7 @@ const IncreaseLockTime = () => {
   const { checkPoint } = useReward()
   const { data } = useWaitForTransaction({ hash: trxHash })
   const { address } = useAccount()
+  const posthog = usePostHog()
 
   const resetValues = () => {
     setLoading(false)
@@ -89,20 +90,14 @@ const IncreaseLockTime = () => {
       const result = await increaseLockPeriod(lockend.getTime())
       if (!result) {
         showToast('Transaction failed', 'error')
-        logEvent({
-          action: 'INCREASE_STAKE_PERIOD_FAILURE',
-          label: JSON.stringify(address),
-          value: 0,
-          category: 'increase_stake_period_failure',
+        posthog.capture('increase_stake_period_failure', {
+          userAddress: address,
         })
         setLoading(false)
         return
       }
-      logEvent({
-        action: 'INCREASE_STAKE_PERIOD_SUCCESS',
-        label: JSON.stringify(address),
-        value: 1,
-        category: 'increase_stake_period_success',
+      posthog.capture('increase_stake_period_success', {
+        userAddress: address,
       })
       setTrxHash(result.hash)
     } catch (err) {

diff --git a/src/components/lock/LockedDetails.tsx b/src/components/lock/LockedDetails.tsx
@@ -14,7 +14,6 @@ import * as Humanize from 'humanize-plus'
 import { useReward } from '@/hooks/useReward'
 import { useAccount, useWaitForTransaction } from 'wagmi'
 import { Dict } from '@chakra-ui/utils'
-import { logEvent } from '@/utils/googleAnalytics'
 import { useGetIqPriceQuery } from '@/services/iqPrice'
 import { useReusableToast } from '@/hooks/useToast'
 import { useLockEnd } from '@/hooks/useLockEnd'
@@ -23,6 +22,7 @@ import StakeHeader from '../elements/stakeCommon/StakeHeader'
 import TooltipElement from '../elements/Tooltip/TooltipElement'
 import ClaimModal from './ClaimWarningModal'
 import { CLAIM_WARNING_THRESHOLD } from '@/data/LockConstants'
+import { usePostHog } from 'posthog-js/react'
 
 const LockedDetails = ({
   setOpenUnlockNotification,
@@ -59,6 +59,7 @@ const LockedDetails = ({
   const { showToast } = useReusableToast()
   const [isModalOpen, setIsModalOpen] = useState(false)
   const closeModal = () => setIsModalOpen(false)
+  const posthog = usePostHog()
 
   useEffect(() => {
     const resolveReward = async () => {
@@ -116,11 +117,9 @@ const LockedDetails = ({
     try {
       const result = await resultAction()
       setTrxHash(result.hash)
-      logEvent({
-        action: logAction,
-        label: JSON.stringify(address),
-        value: 1,
-        category: logAction.toLocaleLowerCase(),
+      posthog.capture(logAction.toLocaleLowerCase(), {
+        category: 'lock',
+        userAddress: address,
       })
       if (logAction === 'CLAIM_REWARD' && result) {
         setHasClaimed(true)

diff --git a/src/components/lock/StakeIQ.tsx b/src/components/lock/StakeIQ.tsx
@@ -14,7 +14,6 @@ import { useAccount, useWaitForTransaction } from 'wagmi'
 import { useLockOverview } from '@/hooks/useLockOverview'
 import { useReward } from '@/hooks/useReward'
 import { Dict } from '@chakra-ui/utils'
-import { logEvent } from '@/utils/googleAnalytics'
 import { useReusableToast } from '@/hooks/useToast'
 import { useLockEnd } from '@/hooks/useLockEnd'
 import LockFormCommon from './LockFormCommon'
@@ -138,12 +137,7 @@ const StakeIQ = ({ exchangeRate }: { exchangeRate: number }) => {
         const result = await increaseLockAmount(iqToBeLocked)
         if (!result) {
           showToast('Transaction failed', 'error')
-          logEvent({
-            action: 'INCREASE_STAKE_FAILURE',
-            label: JSON.stringify(address),
-            value: 0,
-            category: 'increase_stake_failure',
-          })
+
           posthog.capture('INCREASE_STAKE_FAILURE', {
             action: 'INCREASE_STAKE_FAILURE',
             userId: address,
@@ -160,12 +154,6 @@ const StakeIQ = ({ exchangeRate }: { exchangeRate: number }) => {
           setLoading(false)
           return
         }
-        logEvent({
-          action: 'INCREASE_STAKE_SUCCESS',
-          label: JSON.stringify(address),
-          value: 1,
-          category: 'increase_stake_success',
-        })
         posthog.capture('INCREASE_STAKE_SUCCESS', {
           action: 'INCREASE_STAKE_SUCCESS',
           userId: address,
@@ -186,12 +174,6 @@ const StakeIQ = ({ exchangeRate }: { exchangeRate: number }) => {
           const result = await lockIQ(iqToBeLocked, lockValue)
           if (!result) {
             showToast('Transaction failed', 'error')
-            logEvent({
-              action: 'STAKE_FAILURE',
-              label: JSON.stringify(address),
-              value: 0,
-              category: 'stake_failure',
-            })
             posthog.capture('STAKE_FAILURE', {
               action: 'STAKE_FAILURE',
               userId: address,
@@ -208,12 +190,6 @@ const StakeIQ = ({ exchangeRate }: { exchangeRate: number }) => {
             setLoading(false)
             return
           }
-          logEvent({
-            action: 'STAKE_SUCCESS',
-            label: JSON.stringify(address),
-            value: 1,
-            category: 'stake_success',
-          })
           posthog.capture('STAKE_SUCCESS', {
             action: 'STAKE_SUCCESS',
             userId: address,
@@ -280,7 +256,7 @@ const StakeIQ = ({ exchangeRate }: { exchangeRate: number }) => {
         <Flex align="center" gap="2.5" w="full">
           <Input
             variant="unstyled"
-            onChange={(e) => updateIqToBeLocked(e.target.value)}
+            onChange={e => updateIqToBeLocked(e.target.value)}
             placeholder="23.00"
             value={userInput}
             color="fadedText4"
@@ -306,7 +282,7 @@ const StakeIQ = ({ exchangeRate }: { exchangeRate: number }) => {
         </Flex>
       </VStack>
       {userTotalIQLocked < 1 && (
-        <LockSlider updateLockend={(newDate) => updateLockend(newDate)} />
+        <LockSlider updateLockend={newDate => updateLockend(newDate)} />
       )}
       <IconButton
         icon={<RiArrowDownLine />}

diff --git a/src/components/wallet/WalletConnect.tsx b/src/components/wallet/WalletConnect.tsx
@@ -13,7 +13,6 @@ import { FocusableElement } from '@chakra-ui/utils'
 import { RiCloseLine } from 'react-icons/ri'
 import { useConnect, Connector } from 'wagmi'
 import { WALLET_LOGOS } from '@/data/WalletData'
-import { logEvent } from '@/utils/googleAnalytics'
 import { usePostHog } from 'posthog-js/react'
 
 const WalletConnect = ({
@@ -26,19 +25,17 @@ const WalletConnect = ({
   const posthog = usePostHog()
   const { connectors, connect } = useConnect({
     onError(error) {
-      logEvent({
+      posthog.capture('LOGIN_ERROR', {
         action: 'LOGIN_ERROR',
-        label: error.message,
-        value: 0,
-        category: 'login_status',
+        errorReason: error.message,
+        category: 'connectors',
       })
     },
     onSuccess(data) {
-      logEvent({
+      posthog.capture('LOGIN_SUCCESS', {
         action: 'LOGIN_SUCCESS',
-        label: JSON.stringify(data.account),
-        value: 1,
-        category: 'login_status',
+        userAddress: data.account,
+        category: 'connectors',
       })
       const w = window as any
       w.gtag('config', process.env.NEXT_PUBLIC_GOOGLE_ANALYTICS, {
@@ -49,12 +46,6 @@ const WalletConnect = ({
   })
 
   const handleConnect = (selectedConnector: Connector) => {
-    logEvent({
-      action: 'LOGIN_ATTEMPT',
-      label: selectedConnector.name,
-      value: 1,
-      category: 'connectors',
-    })
     posthog.capture('LOGIN_ATTEMPT', {
       action: 'LOGIN_ATTEMPT',
       label: selectedConnector.name,

diff --git a/src/utils/googleAnalytics.ts b/src/utils/googleAnalytics.ts