fix same page type navigation

lib/mixpanel/useLogPageView.tsx

@@ -1,3 +1,4 @@
+import { usePathname } from 'next/navigation';
 import { useRouter } from 'next/router';
 import React from 'react';
 
@@ -11,8 +12,8 @@ import { EventTypes } from './utils';
 
 export default function useLogPageView(isInited: boolean) {
   const router = useRouter();
+  const pathname = usePathname();
 
-  const pathname = router.pathname;
   const tab = getQueryParamString(router.query.tab);
   const page = getQueryParamString(router.query.page);
 
@@ -22,9 +23,14 @@ export default function useLogPageView(isInited: boolean) {
     }
 
     logEvent(EventTypes.PAGE_VIEW, {
-      'Page type': getPageType(pathname),
+      'Page type': getPageType(router.pathname),
       Tab: getTabName(tab),
       Page: page || undefined,
     });
+    // these are only deps that should trigger the effect
+    // in some scenarios page type is not changing (e.g navigation from one address page to another),
+    // but we still want to log page view
+    // so we use pathname from 'next/navigation' instead of router.pathname from 'next/router' as deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [ isInited, page, pathname, tab ]);
 }