Merge branch 'master' into release

src/components/cards/ChartCard/ChartCard.tsx

@@ -18,7 +18,6 @@ import { DataContext } from '../../../hooks/DataContext/DataContext'
 import { ListModal } from '../../modals/ListModal/ListModal'
 import { ListEntityButton } from '../../buttons/ListEntityButton/ListEntityButton'
 import { useTranslation } from 'react-i18next'
-import { useTracking } from '../../../hooks/useTracking'
 
 export interface ChartCardProps {}
 
@@ -29,7 +28,6 @@ export const ChartCard: FC<ChartCardProps> = () => {
 	const { selection } = useContext(SelectionContext)
 	const { getTokens } = useContext(DataContext)
 	const { theme } = useContext(ThemeContext)
-	const { trackEvent } = useTracking()
 	const [{ chartType, token, interval, chartData }, dispatch] = useChartReducer(selection.swapCard)
 	const { addNotification } = useContext(NotificationsContext)
 	const isMobile = useMediaQuery('mobile')

src/components/cards/NewsCard/NewsCard.tsx

@@ -15,7 +15,7 @@ import { CardHeader } from '../CardHeader/CardHeader'
 import { CryptoSymbol } from '../../tags/CryptoSymbol/CryptoSymbol'
 import { useTranslation } from 'react-i18next'
 import { action, category } from '../../../constants/tracking'
-import { useTracking } from '../../../hooks/useTracking'
+import { trackEvent } from '../../../hooks/useTracking'
 
 interface NewsCardProps {}
 
@@ -26,7 +26,6 @@ export const NewsCard: FC<NewsCardProps> = () => {
 	const [{ data, isLoading, timestamp, isModalVisible, selectedToken }, dispatch] = useNewsReducer(selection)
 	const { t } = useTranslation()
 
-	const { trackEvent } = useTracking()
 	useEffect(() => {
 		if (!selectedToken) return
 		getNews(data, dispatch, selectedToken, timestamp, addNotification)

src/components/cards/NewsCard/columns.tsx

@@ -2,11 +2,10 @@ import { IconClock } from '@tabler/icons-react'
 import { truncate, unixtimeFromNow } from '../../../utils/formatting'
 import classNames from './NewsCard.module.pcss'
 import { CryptoSymbol } from '../../tags/CryptoSymbol/CryptoSymbol'
-import { useTracking } from '../../../hooks/useTracking'
 import { action, category } from '../../../constants/tracking'
+import { trackEvent } from '../../../hooks/useTracking'
 
 export const columns = () => {
-	const { trackEvent } = useTracking()
 	return [
 		{
 			columnTitle: 'Title',

src/components/cards/RouteCard/RouteCard.tsx

@@ -9,15 +9,15 @@ import { renderSteps } from './renderSteps'
 import { RouteCardProps } from './types'
 import { numberToFormatString, roundNumberByDecimals } from '../../../utils/formatting'
 import { useMediaQuery } from '../../../hooks/useMediaQuery'
-import { useTracking } from '../../../hooks/useTracking'
 import { action, category } from '../../../constants/tracking'
+import { trackEvent } from '../../../hooks/useTracking'
 
 export const RouteCard: FC<RouteCardProps> = ({ route, isSelected, onClick }) => {
 	const stepsContainerRef = useRef(null)
 	const isMobile = useMediaQuery('mobile')
 	const [isRoutesCollapsed, setIsRoutesCollapsed] = useState(true)
 	const [springProps, setSpringProps] = useSpring(() => ({ height: 'auto' }))
-	const { trackEvent } = useTracking()
+
 	const getTextColor = () => (isSelected ? classNames.bestText : '')
 	const getIconColor = () => (isSelected ? 'var(--color-primary-400)' : 'var(--color-text-secondary)')
 

src/components/cards/SwapCard/SwapDetails/SwapDetails.tsx

@@ -6,12 +6,11 @@ import { RateTag } from './RateTag'
 import { RouteCard } from '../../RouteCard/RouteCard'
 import { SwapDetailsProps } from '../types'
 import { numberToFormatString } from '../../../../utils/formatting'
-import { useTracking } from '../../../../hooks/useTracking'
 import { action, category } from '../../../../constants/tracking'
+import { trackEvent } from '../../../../hooks/useTracking'
 
 export const SwapDetails: FC<SwapDetailsProps> = ({ swapState, setSelectedRoute }) => {
 	const { from, to, routes, isLoading, selectedRoute } = swapState
-	const { trackEvent } = useTracking()
 	const [isSelectRouteModalVisible, setIsSelectRouteModalVisible] = useState<true | false>(false)
 
 	const rate = {

src/components/layout/Header/WalletButton/WalletButton.tsx

@@ -1,20 +1,19 @@
 import { useWeb3Modal } from '@web3modal/react'
 import { FC } from 'react'
-import { useTracking } from '../../../../hooks/useTracking'
 import { action, category } from '../../../../constants/tracking'
 import { useAccount } from 'wagmi'
 import { IconWallet } from '@tabler/icons-react'
 import { Button } from '../../../buttons/Button/Button'
 import { truncateWallet } from '../../../../utils/formatting'
 import { useTranslation } from 'react-i18next'
 import classNames from './WalletButton.module.pcss'
+import { trackEvent } from '../../../../hooks/useTracking'
 
 interface WalletButtonProps {}
 
 export const WalletButton: FC<WalletButtonProps> = () => {
 	const { address, isConnected, isDisconnected, isConnecting } = useAccount()
 	const { open } = useWeb3Modal()
-	const { trackEvent } = useTracking()
 	const { t } = useTranslation()
 
 	function handleClick() {

src/hooks/useTracking.tsx

@@ -1,8 +1,5 @@
-import { useCallback, useEffect } from 'react'
 import posthog from 'posthog-js'
-import { useAccount } from 'wagmi'
 import { TrackEventProps } from '../types/TrackEventProps'
-import { action, category } from '../constants/tracking'
 
 // Standalone function for trackTransaction
 export const trackTransaction = () => {
@@ -22,28 +19,3 @@ export const trackEvent = async ({ category, action, label, data }: TrackEventPr
 		console.error('trackEvent error', error)
 	}
 }
-
-// Hook that utilizes the standalone functions
-export const useTracking = () => {
-	const { address, isConnected } = useAccount()
-
-	useEffect(() => {
-		if (isConnected) {
-			posthog.identify(address)
-			trackEvent({
-				category: category.Wallet,
-				action: action.ConnectWalletSuccess,
-				label: 'Wallet Connected',
-			})
-		}
-	}, [isConnected])
-
-	// Use callbacks to reference the standalone functions
-	const memoizedTrackTransaction = useCallback(trackTransaction, [])
-	const memoizedTrackEvent = useCallback(trackEvent, [])
-
-	return {
-		trackTransaction: memoizedTrackTransaction,
-		trackEvent: memoizedTrackEvent,
-	}
-}