diff --git a/src/pages/App.tsx b/src/pages/App.tsx
index 89648990c7..3f15ce0356 100644
--- a/src/pages/App.tsx
+++ b/src/pages/App.tsx
@@ -97,12 +97,10 @@ export default function App() {
const location = useLocation()
const { pathname } = location
const currentPage = getCurrentPageFromLocation(pathname)
- const isDarkMode = useIsDarkMode()
- const [routerPreference] = useRouterPreference()
+
const [scrollY, setScrollY] = useState(0)
const scrolledState = scrollY > 0
- const isUniswapXDefaultEnabled = useUniswapXDefaultEnabled()
- const userOptedOutOfUniswapX = useUserOptedOutOfUniswapX()
+
const routerConfig = useRouterConfig()
const originCountry = useAppSelector((state: AppState) => state.user.originCountry)
@@ -122,53 +120,6 @@ export default function App() {
}
}, [searchParams, setShouldDisableNFTRoutes])
- useEffect(() => {
- // User properties *must* be set before sending corresponding event properties,
- // so that the event contains the correct and up-to-date user properties.
- user.set(CustomUserProperties.USER_AGENT, navigator.userAgent)
- user.set(CustomUserProperties.BROWSER, getBrowser())
- user.set(CustomUserProperties.SCREEN_RESOLUTION_HEIGHT, window.screen.height)
- user.set(CustomUserProperties.SCREEN_RESOLUTION_WIDTH, window.screen.width)
- user.set(CustomUserProperties.GIT_COMMIT_HASH, process.env.REACT_APP_GIT_COMMIT_HASH ?? 'unknown')
-
- // Service Worker analytics
- const isServiceWorkerInstalled = Boolean(window.navigator.serviceWorker?.controller)
- const isServiceWorkerHit = Boolean((window as any).__isDocumentCached)
- const serviceWorkerProperty = isServiceWorkerInstalled ? (isServiceWorkerHit ? 'hit' : 'miss') : 'uninstalled'
-
- const pageLoadProperties = { service_worker: serviceWorkerProperty }
- sendInitializationEvent(SharedEventName.APP_LOADED, pageLoadProperties)
- const sendWebVital =
- (metric: string) =>
- ({ delta }: Metric) =>
- sendAnalyticsEvent(SharedEventName.WEB_VITALS, { ...pageLoadProperties, [metric]: delta })
- getCLS(sendWebVital('cumulative_layout_shift'))
- getFCP(sendWebVital('first_contentful_paint_ms'))
- getFID(sendWebVital('first_input_delay_ms'))
- getLCP(sendWebVital('largest_contentful_paint_ms'))
- }, [])
-
- useEffect(() => {
- user.set(CustomUserProperties.DARK_MODE, isDarkMode)
- }, [isDarkMode])
-
- useEffect(() => {
- // If we're not in the transition period to UniswapX opt-out, set the router preference to whatever is specified.
- if (!isUniswapXDefaultEnabled) {
- user.set(CustomUserProperties.ROUTER_PREFERENCE, routerPreference)
- return
- }
-
- // In the transition period, override the stored API preference to UniswapX if the user hasn't opted out.
- if (routerPreference === RouterPreference.API && !userOptedOutOfUniswapX) {
- user.set(CustomUserProperties.ROUTER_PREFERENCE, RouterPreference.X)
- return
- }
-
- // Otherwise, the user has opted out or their preference is UniswapX/client, so set the preference to whatever is specified.
- user.set(CustomUserProperties.ROUTER_PREFERENCE, routerPreference)
- }, [routerPreference, isUniswapXDefaultEnabled, userOptedOutOfUniswapX])
-
useEffect(() => {
const scrollListener = () => {
setScrollY(window.scrollY)
@@ -221,6 +172,7 @@ export default function App() {
api: process.env.REACT_APP_STATSIG_PROXY_URL,
}}
>
+
{renderUkBannner && }
@@ -255,3 +207,59 @@ export default function App() {
)
}
+
+function UserPropertyUpdater() {
+ const isDarkMode = useIsDarkMode()
+
+ const [routerPreference] = useRouterPreference()
+ const userOptedOutOfUniswapX = useUserOptedOutOfUniswapX()
+ const isUniswapXDefaultEnabled = useUniswapXDefaultEnabled()
+
+ useEffect(() => {
+ // User properties *must* be set before sending corresponding event properties,
+ // so that the event contains the correct and up-to-date user properties.
+ user.set(CustomUserProperties.USER_AGENT, navigator.userAgent)
+ user.set(CustomUserProperties.BROWSER, getBrowser())
+ user.set(CustomUserProperties.SCREEN_RESOLUTION_HEIGHT, window.screen.height)
+ user.set(CustomUserProperties.SCREEN_RESOLUTION_WIDTH, window.screen.width)
+ user.set(CustomUserProperties.GIT_COMMIT_HASH, process.env.REACT_APP_GIT_COMMIT_HASH ?? 'unknown')
+
+ // Service Worker analytics
+ const isServiceWorkerInstalled = Boolean(window.navigator.serviceWorker?.controller)
+ const isServiceWorkerHit = Boolean((window as any).__isDocumentCached)
+ const serviceWorkerProperty = isServiceWorkerInstalled ? (isServiceWorkerHit ? 'hit' : 'miss') : 'uninstalled'
+
+ const pageLoadProperties = { service_worker: serviceWorkerProperty }
+ sendInitializationEvent(SharedEventName.APP_LOADED, pageLoadProperties)
+ const sendWebVital =
+ (metric: string) =>
+ ({ delta }: Metric) =>
+ sendAnalyticsEvent(SharedEventName.WEB_VITALS, { ...pageLoadProperties, [metric]: delta })
+ getCLS(sendWebVital('cumulative_layout_shift'))
+ getFCP(sendWebVital('first_contentful_paint_ms'))
+ getFID(sendWebVital('first_input_delay_ms'))
+ getLCP(sendWebVital('largest_contentful_paint_ms'))
+ }, [])
+
+ useEffect(() => {
+ user.set(CustomUserProperties.DARK_MODE, isDarkMode)
+ }, [isDarkMode])
+
+ useEffect(() => {
+ // If we're not in the transition period to UniswapX opt-out, set the router preference to whatever is specified.
+ if (!isUniswapXDefaultEnabled) {
+ user.set(CustomUserProperties.ROUTER_PREFERENCE, routerPreference)
+ return
+ }
+
+ // In the transition period, override the stored API preference to UniswapX if the user hasn't opted out.
+ if (routerPreference === RouterPreference.API && !userOptedOutOfUniswapX) {
+ user.set(CustomUserProperties.ROUTER_PREFERENCE, RouterPreference.X)
+ return
+ }
+
+ // Otherwise, the user has opted out or their preference is UniswapX/client, so set the preference to whatever is specified.
+ user.set(CustomUserProperties.ROUTER_PREFERENCE, routerPreference)
+ }, [routerPreference, isUniswapXDefaultEnabled, userOptedOutOfUniswapX])
+ return null
+}