fix: user prop updater staging (#7443)

fix: move user prop updater into statsigProvider
This commit is contained in:
eddie 2023-10-10 15:51:26 -07:00 committed by GitHub
parent e16348e2e0
commit f09ded1a3f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -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,
}}
>
<UserPropertyUpdater />
{renderUkBannner && <UkBanner />}
<HeaderWrapper transparent={isHeaderTransparent} bannerIsVisible={renderUkBannner} scrollY={scrollY}>
<NavBar blur={isHeaderTransparent} />
@ -255,3 +207,59 @@ export default function App() {
</ErrorBoundary>
)
}
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
}