chore: mx panel [skip cypress] (#2144)

aave · Aug 5, 2024 · 758414b · 758414b · github-actions · Aug 5, 2024
1 parent 9dde336
commit 758414b
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 14 deletions.
diff --git a/pages/_app.page.tsx b/pages/_app.page.tsx
@@ -18,6 +18,7 @@ import { GasStationProvider } from 'src/components/transactions/GasStation/GasSt
 import { AppDataProvider } from 'src/hooks/app-data-provider/useAppDataProvider';
 import { ModalContextProvider } from 'src/hooks/useModal';
 import { Web3ContextProvider } from 'src/libs/web3-data-provider/Web3Provider';
+import { useRootStore } from 'src/store/root';
 import { SharedDependenciesProvider } from 'src/ui-config/SharedDependenciesProvider';
 
 import createEmotionCache from '../src/createEmotionCache';
@@ -102,7 +103,7 @@ interface MyAppProps extends AppProps {
 export default function MyApp(props: MyAppProps) {
   const { Component, emotionCache = clientSideEmotionCache, pageProps } = props;
   const getLayout = Component.getLayout ?? ((page: ReactNode) => page);
-  // const initializeMixpanel = useRootStore((store) => store.initializeMixpanel);
+  const initializeMixpanel = useRootStore((store) => store.initializeMixpanel);
   const [queryClient] = useState(
     () =>
       new QueryClient({
@@ -114,13 +115,13 @@ export default function MyApp(props: MyAppProps) {
       })
   );
 
-  // const MIXPANEL_TOKEN = process.env.NEXT_PUBLIC_MIXPANEL;
+  const MIXPANEL_TOKEN = process.env.NEXT_PUBLIC_MIXPANEL;
   useEffect(() => {
-    // if (MIXPANEL_TOKEN) {
-    //   initializeMixpanel();
-    // } else {
-    console.log('no analytics tracking');
-    // }
+    if (MIXPANEL_TOKEN) {
+      initializeMixpanel();
+    } else {
+      console.log('no analytics tracking');
+    }
   }, []);
 
   return (

diff --git a/src/modules/dashboard/DashboardContentWrapper.tsx b/src/modules/dashboard/DashboardContentWrapper.tsx
@@ -10,7 +10,7 @@ import { StyledTxModalToggleGroup } from 'src/components/StyledToggleButtonGroup
 import { useWeb3Context } from 'src/libs/hooks/useWeb3Context';
 import { useRootStore } from 'src/store/root';
 import { CustomMarket } from 'src/utils/marketsAndNetworksConfig';
-import { AUTH } from 'src/utils/mixPanelEvents';
+import { AUTH, DASHBOARD } from 'src/utils/mixPanelEvents';
 
 import { BorrowAssetsList } from './lists/BorrowAssetsList/BorrowAssetsList';
 import { BorrowedPositionsList } from './lists/BorrowedPositionsList/BorrowedPositionsList';
@@ -63,10 +63,9 @@ export const DashboardContentWrapper = ({ isBorrow }: DashboardContentWrapperPro
                   currentMarket === ('fork_proto_mainnet_v3' as string)) ||
                 (!currentNetworkConfig.isFork && currentMarket === 'proto_mainnet_v3')
               }
-              // Todo tracking?
-              // onClick={() =>
-              //   trackEvent(WITHDRAW_MODAL.SWITCH_WITHDRAW_TYPE, { withdrawType: 'Withdraw' })
-              // }
+              onClick={() =>
+                trackEvent(DASHBOARD.SELECT_V3_ETH_MARKET, { market: 'Ethereum Main' })
+              }
             >
               <TokenIcon sx={{ mr: 2 }} symbol="eth-round" />
 
@@ -86,7 +85,7 @@ export const DashboardContentWrapper = ({ isBorrow }: DashboardContentWrapperPro
               value={currentNetworkConfig.isFork ? 'fork_proto_lido_v3' : 'proto_lido_v3'}
               // disabled={currentMarket === 'proto_lido_v3' || 'fork_proto_lido_v3' ? true : false}
 
-              // Todo tracking?
+              onClick={() => trackEvent(DASHBOARD.SELECT_V3_ETH_MARKET, { market: 'Lido' })}
             >
               <TokenIcon sx={{ mr: 2 }} symbol="ldo" />
 

diff --git a/src/modules/markets/MarketsTopPanel.tsx b/src/modules/markets/MarketsTopPanel.tsx
@@ -9,6 +9,7 @@ import { StyledTxModalToggleButton } from 'src/components/StyledToggleButton';
 import { StyledTxModalToggleGroup } from 'src/components/StyledToggleButtonGroup';
 import { useRootStore } from 'src/store/root';
 import { CustomMarket } from 'src/utils/marketsAndNetworksConfig';
+import { MARKETS } from 'src/utils/mixPanelEvents';
 
 import { FormattedNumber } from '../../components/primitives/FormattedNumber';
 import { TopInfoPanel } from '../../components/TopInfoPanel/TopInfoPanel';
@@ -21,6 +22,7 @@ export const MarketsTopPanel = () => {
     store.currentMarket,
     store.setCurrentMarket,
   ]);
+  const trackEvent = useRootStore((store) => store.trackEvent);
 
   const [currentNetworkConfig] = useRootStore((state) => [
     state.currentNetworkConfig,
@@ -110,6 +112,9 @@ export const MarketsTopPanel = () => {
                     currentMarket === ('fork_proto_mainnet_v3' as string)) ||
                   (!currentNetworkConfig.isFork && currentMarket === 'proto_mainnet_v3')
                 }
+                onClick={() =>
+                  trackEvent(MARKETS.SELECT_V3_ETH_MARKET, { market: 'Ethereum Main' })
+                }
               >
                 <TokenIcon sx={{ mr: 2 }} symbol="eth-round" />
 
@@ -142,7 +147,7 @@ export const MarketsTopPanel = () => {
                   (!currentNetworkConfig.isFork && currentMarket === 'proto_lido_v3')
                 }
                 value={currentNetworkConfig.isFork ? 'fork_proto_lido_v3' : 'proto_lido_v3'}
-                // Todo tracking?
+                onClick={() => trackEvent(MARKETS.SELECT_V3_ETH_MARKET, { market: 'Lido' })}
               >
                 <TokenIcon sx={{ mr: 2 }} symbol="ldo" />
 

diff --git a/src/utils/mixPanelEvents.ts b/src/utils/mixPanelEvents.ts
@@ -33,12 +33,14 @@ export const DASHBOARD = {
   NOTIFY_DASHBOARD: 'Notify dashboard', // done
   TILE_VISBILITY: 'Tile visibility',
   SHOW_ASSETS_0_BALANCE: 'Show assets with zero balance dashboard', // done
+  SELECT_V3_ETH_MARKET: 'Clicks a V3 ETH market from dashboard', // done
 };
 
 export const MARKETS = {
   DETAILS_NAVIGATION: 'View reserve details markets',
   SEARCH_ASSET: 'Search asset markets', // how to handle
   SORT: 'Sort',
+  SELECT_V3_ETH_MARKET: 'Clicks a V3 ETH market from markets', // done
 };
 
 export const RESERVE_DETAILS = {