use recoil instead to break free the real current path and specific path

js_modules/dagster-ui/packages/ui-core/package.json

@@ -62,6 +62,7 @@
     "react-is": "^18.2.0",
     "react-markdown": "^8.0.6",
     "react-virtualized": "^9.22.3",
+    "recoil": "^0.7.7",
     "rehype-highlight": "^6.0.0",
     "rehype-sanitize": "^5.0.1",
     "remark": "^14.0.2",

js_modules/dagster-ui/packages/ui-core/src/app/analytics.tsx

@@ -1,5 +1,10 @@
-import {createContext, useCallback, useContext, useEffect, useMemo} from 'react';
-import {useLocation, useRouteMatch} from 'react-router-dom';
+import {createContext, useCallback, useContext, useEffect} from 'react';
+import {atom, useRecoilValue, useSetRecoilState} from 'recoil';
+
+export const currentPageAtom = atom<{path: string; specificPath: string}>({
+  key: 'currentPageAtom',
+  default: {path: '/', specificPath: '/'},
+});
 
 export interface GenericAnalytics {
   group?: (groupId: string, traits?: Record<string, any>) => void;
@@ -13,10 +18,7 @@ export const AnalyticsContext = createContext<GenericAnalytics>(undefined!);
 const PAGEVIEW_DELAY = 300;
 
 export const usePageContext = () => {
-  const match = useRouteMatch();
-  const {pathname: specificPath} = useLocation();
-  const {path} = match;
-  return useMemo(() => ({path, specificPath}), [path, specificPath]);
+  return useRecoilValue(currentPageAtom);
 };
 
 const useAnalytics = () => {
@@ -54,11 +56,14 @@ export const useTrackPageView = () => {
   const analytics = useAnalytics();
   const {path, specificPath} = usePageContext();
 
+  const setCurrentPage = useSetRecoilState(currentPageAtom);
+
   useEffect(() => {
     // Wait briefly to allow redirects.
     const timer = setTimeout(() => {
       analytics.page(path, specificPath);
     }, PAGEVIEW_DELAY);
+    setCurrentPage({path, specificPath});
 
     return () => {
       clearTimeout(timer);