diff --git a/src/components/SelectPair.tsx b/src/components/SelectPair.tsx
index 56c10b3..dd49994 100644
--- a/src/components/SelectPair.tsx
+++ b/src/components/SelectPair.tsx
@@ -3,12 +3,11 @@ import { useCallback, useMemo } from 'react'
import { FaArrowRightArrowLeft } from 'react-icons/fa6'
import { useNavigate } from 'react-router-dom'
import { BTCImage, ETHImage } from 'lib/const'
-import { getMixPanel, MixPanelEvent } from 'lib/mixpanel'
+import { mixpanel, MixPanelEvent } from 'lib/mixpanel'
import { AssetSelection } from './AssetSelection'
export const SelectPair = () => {
- const mixpanel = getMixPanel()
const navigate = useNavigate()
const switchIcon = useMemo(() => , [])
const handleSubmit = useCallback(() => {
@@ -17,7 +16,7 @@ export const SelectPair = () => {
})
navigate('/input')
- }, [mixpanel, navigate])
+ }, [navigate])
const handleFromAssetClick = useCallback(() => {
console.info('asset click')
diff --git a/src/components/TradeInput.tsx b/src/components/TradeInput.tsx
index fd26874..e4fba80 100644
--- a/src/components/TradeInput.tsx
+++ b/src/components/TradeInput.tsx
@@ -19,12 +19,11 @@ import { useCallback, useMemo } from 'react'
import { FaArrowRightArrowLeft } from 'react-icons/fa6'
import { useNavigate } from 'react-router-dom'
import { BTCImage, ETHImage } from 'lib/const'
-import { getMixPanel, MixPanelEvent } from 'lib/mixpanel'
+import { mixpanel, MixPanelEvent } from 'lib/mixpanel'
import { Amount } from './Amount/Amount'
export const TradeInput = () => {
- const mixpanel = getMixPanel()
const navigate = useNavigate()
const Divider = useMemo(() => , [])
const FromAssetIcon = useMemo(() => , [])
@@ -35,7 +34,7 @@ export const TradeInput = () => {
'some key': 'some val',
})
navigate('/status')
- }, [mixpanel, navigate])
+ }, [navigate])
const handleFromAssetClick = useCallback(() => {
console.info('asset click')
diff --git a/src/lib/mixpanel/mixpanelSingleton.ts b/src/lib/mixpanel/mixpanelSingleton.ts
index 5439eb2..4d6fc98 100644
--- a/src/lib/mixpanel/mixpanelSingleton.ts
+++ b/src/lib/mixpanel/mixpanelSingleton.ts
@@ -2,18 +2,18 @@ import Mixpanel from 'mixpanel-browser'
import type { MixPanelType } from './types'
-// don't export me, access me through the getter
-let _mixPanel: MixPanelType | undefined = undefined
-
// we need to be able to access this outside react
-export const getMixPanel = (): MixPanelType | undefined => {
+export const mixpanel = (() => {
+ let _mixPanel: MixPanelType | undefined = undefined
+
const mixPanelEnabled = import.meta.env.VITE_FEATURE_MIXPANEL
- if (!mixPanelEnabled) return
+ if (!mixPanelEnabled) return undefined
if (_mixPanel) return _mixPanel
const mixpanelToken = import.meta.env.VITE_MIXPANEL_TOKEN
Mixpanel.init(mixpanelToken)
_mixPanel = Mixpanel // identify once per session
_mixPanel.set_config({ persistence: 'localStorage' })
_mixPanel.identify()
+
return _mixPanel
-}
+})()