[Statsig] Make gate checks lazily (#3594)

zio/stable
dan 2024-04-18 04:39:29 +01:00 committed by GitHub
parent 086dc93a7a
commit 02becdf449
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
14 changed files with 67 additions and 62 deletions

View File

@ -25,6 +25,7 @@ exports.create = function create(context) {
"Use useGate() from '#/lib/statsig/statsig' instead of the one on npm.",
})
}
// TODO: Verify gate() call results aren't stored in variables.
},
}
}

View File

@ -31,8 +31,8 @@ async function setExtraParams() {
}
export function useOTAUpdates() {
const shouldReceiveUpdates =
useGate('receive_updates') && isEnabled && !__DEV__
const gate = useGate()
const shouldReceiveUpdates = isEnabled && !__DEV__ && gate('receive_updates')
const appState = React.useRef<AppStateStatus>('active')
const lastMinimize = React.useRef(0)

View File

@ -2,11 +2,7 @@ import React from 'react'
import {Platform} from 'react-native'
import {AppState, AppStateStatus} from 'react-native'
import {sha256} from 'js-sha256'
import {
Statsig,
StatsigProvider,
useGate as useStatsigGate,
} from 'statsig-react-native-expo'
import {Statsig, StatsigProvider} from 'statsig-react-native-expo'
import {logger} from '#/logger'
import {isWeb} from '#/platform/detection'
@ -98,16 +94,24 @@ export function logEvent<E extends keyof LogEvents>(
}
}
export function useGate(gateName: Gate): boolean {
const {isLoading, value} = useStatsigGate(gateName)
if (isLoading) {
// This should not happen because of waitForInitialization={true}.
console.error('Did not expected isLoading to ever be true.')
export function useGate(): (gateName: Gate) => boolean {
const cache = React.useRef<Map<Gate, boolean>>()
if (cache.current === undefined) {
cache.current = new Map()
}
// This shouldn't technically be necessary but let's get a strong
// guarantee that a gate value can never change while mounted.
const [initialValue] = React.useState(value)
return initialValue
const gate = React.useCallback((gateName: Gate): boolean => {
// TODO: Replace local cache with a proper session one.
const cachedValue = cache.current!.get(gateName)
if (cachedValue !== undefined) {
return cachedValue
}
const value = Statsig.initializeCalled()
? Statsig.checkGate(gateName)
: false
cache.current!.set(gateName, value)
return value
}, [])
return gate
}
function toStatsigUser(did: string | undefined): StatsigUser {

View File

@ -80,9 +80,7 @@ let ProfileHeaderStandard = ({
})
}, [track, openModal, profile])
const autoExpandSuggestionsOnProfileFollow = useGate(
'autoexpand_suggestions_on_profile_follow',
)
const gate = useGate()
const onPressFollow = () => {
requireAuth(async () => {
try {
@ -96,7 +94,7 @@ let ProfileHeaderStandard = ({
)}`,
),
)
if (isWeb && autoExpandSuggestionsOnProfileFollow) {
if (isWeb && gate('autoexpand_suggestions_on_profile_follow')) {
setShowSuggestedFollows(true)
}
} catch (e: any) {

View File

@ -1,5 +1,6 @@
import React from 'react'
import {Gate} from '#/lib/statsig/gates'
import {useGate} from '#/lib/statsig/statsig'
import {isWeb} from '#/platform/detection'
import * as persisted from '#/state/persisted'
@ -10,7 +11,7 @@ type SetContext = (v: string) => void
const stateContext = React.createContext<StateContext>('home')
const setContext = React.createContext<SetContext>((_: string) => {})
function getInitialFeed(startSessionWithFollowing: boolean) {
function getInitialFeed(gate: (gateName: Gate) => boolean) {
if (isWeb) {
if (window.location.pathname === '/') {
const params = new URLSearchParams(window.location.search)
@ -26,7 +27,7 @@ function getInitialFeed(startSessionWithFollowing: boolean) {
return feedFromSession
}
}
if (!startSessionWithFollowing) {
if (!gate('start_session_with_following')) {
const feedFromPersisted = persisted.get('lastSelectedHomeFeed')
if (feedFromPersisted) {
// Fall back to the last chosen one across all tabs.
@ -37,10 +38,8 @@ function getInitialFeed(startSessionWithFollowing: boolean) {
}
export function Provider({children}: React.PropsWithChildren<{}>) {
const startSessionWithFollowing = useGate('start_session_with_following')
const [state, setState] = React.useState(() =>
getInitialFeed(startSessionWithFollowing),
)
const gate = useGate()
const [state, setState] = React.useState(() => getInitialFeed(gate))
const saveState = React.useCallback((feed: string) => {
setState(feed)

View File

@ -53,6 +53,7 @@ export function FeedPage({
const headerOffset = useHeaderOffset()
const scrollElRef = React.useRef<ListMethods>(null)
const [hasNew, setHasNew] = React.useState(false)
const gate = useGate()
const scrollToTop = React.useCallback(() => {
scrollElRef.current?.scrollToOffset({
@ -105,9 +106,10 @@ export function FeedPage({
let feedPollInterval
if (
useGate('disable_poll_on_discover') &&
feed === // Discover
'feedgen|at://did:plc:z72i7hdynmk6r22z27h6tvur/app.bsky.feed.generator/whats-hot'
'feedgen|at://did:plc:z72i7hdynmk6r22z27h6tvur/app.bsky.feed.generator/whats-hot' &&
// TODO: This gate check is still too early. Move it to where the polling happens.
gate('disable_poll_on_discover')
) {
feedPollInterval = undefined
} else {

View File

@ -48,7 +48,7 @@ function PostThreadFollowBtnLoaded({
'PostThreadItem',
)
const requireAuth = useRequireAuth()
const showFollowBackLabel = useGate('show_follow_back_label')
const gate = useGate()
const isFollowing = !!profile.viewer?.following
const isFollowedBy = !!profile.viewer?.followedBy
@ -140,7 +140,7 @@ function PostThreadFollowBtnLoaded({
style={[!isFollowing ? palInverted.text : pal.text, s.bold]}
numberOfLines={1}>
{!isFollowing ? (
showFollowBackLabel && isFollowedBy ? (
isFollowedBy && gate('show_follow_back_label') ? (
<Trans>Follow Back</Trans>
) : (
<Trans>Follow</Trans>

View File

@ -40,8 +40,8 @@ function ListImpl<ItemT>(
const isScrolledDown = useSharedValue(false)
const contextScrollHandlers = useScrollHandlers()
const pal = usePalette('default')
const showsVerticalScrollIndicator =
!useGate('hide_vertical_scroll_indicators') || isWeb
const gate = useGate()
function handleScrolledDownChange(didScrollDown: boolean) {
onScrolledDownChange?.(didScrollDown)
}
@ -97,7 +97,9 @@ function ListImpl<ItemT>(
scrollEventThrottle={1}
style={style}
ref={ref}
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
showsVerticalScrollIndicator={
isWeb || !gate('hide_vertical_scroll_indicators')
}
/>
)
}

View File

@ -10,14 +10,11 @@ export function CenteredView(props) {
}
export function ScrollView(props) {
const showsVerticalScrollIndicator = !useGate(
'hide_vertical_scroll_indicators',
)
const gate = useGate()
return (
<Animated.ScrollView
{...props}
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
showsVerticalScrollIndicator={!gate('hide_vertical_scroll_indicators')}
/>
)
}

View File

@ -111,21 +111,20 @@ function HomeScreenReady({
}),
)
const disableMinShellOnForegrounding = useGate(
'disable_min_shell_on_foregrounding',
)
const gate = useGate()
React.useEffect(() => {
if (disableMinShellOnForegrounding) {
const listener = AppState.addEventListener('change', nextAppState => {
if (nextAppState === 'active') {
const listener = AppState.addEventListener('change', nextAppState => {
if (nextAppState === 'active') {
// TODO: Check if minimal shell is on before logging an exposure.
if (gate('disable_min_shell_on_foregrounding')) {
setMinimalShellMode(false)
}
})
return () => {
listener.remove()
}
})
return () => {
listener.remove()
}
}, [setMinimalShellMode, disableMinShellOnForegrounding])
}, [setMinimalShellMode, gate])
const onPageSelected = React.useCallback(
(index: number) => {

View File

@ -38,8 +38,7 @@ export function ModerationBlockedAccounts({}: Props) {
const setMinimalShellMode = useSetMinimalShellMode()
const {isTabletOrDesktop} = useWebMediaQueries()
const {screen} = useAnalytics()
const showsVerticalScrollIndicator =
!useGate('hide_vertical_scroll_indicators') || isWeb
const gate = useGate()
const [isPTRing, setIsPTRing] = React.useState(false)
const {
@ -169,7 +168,9 @@ export function ModerationBlockedAccounts({}: Props) {
)}
// @ts-ignore our .web version only -prf
desktopFixedHeight
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
showsVerticalScrollIndicator={
isWeb || !gate('hide_vertical_scroll_indicators')
}
/>
)}
</CenteredView>

View File

@ -38,8 +38,8 @@ export function ModerationMutedAccounts({}: Props) {
const setMinimalShellMode = useSetMinimalShellMode()
const {isTabletOrDesktop} = useWebMediaQueries()
const {screen} = useAnalytics()
const showsVerticalScrollIndicator =
!useGate('hide_vertical_scroll_indicators') || isWeb
const gate = useGate()
const [isPTRing, setIsPTRing] = React.useState(false)
const {
data,
@ -167,7 +167,9 @@ export function ModerationMutedAccounts({}: Props) {
)}
// @ts-ignore our .web version only -prf
desktopFixedHeight
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
showsVerticalScrollIndicator={
isWeb || !gate('hide_vertical_scroll_indicators')
}
/>
)}
</CenteredView>

View File

@ -143,7 +143,7 @@ function ProfileScreenLoaded({
const setMinimalShellMode = useSetMinimalShellMode()
const {openComposer} = useComposerControls()
const {screen, track} = useAnalytics()
const shouldUseScrollableHeader = useGate('new_profile_scroll_component')
const gate = useGate()
const {
data: labelerInfo,
error: labelerError,
@ -317,7 +317,7 @@ function ProfileScreenLoaded({
// =
const renderHeader = React.useCallback(() => {
if (shouldUseScrollableHeader) {
if (gate('new_profile_scroll_component')) {
return (
<ExpoScrollForwarderView scrollViewTag={scrollViewTag}>
<ProfileHeader
@ -343,7 +343,7 @@ function ProfileScreenLoaded({
)
}
}, [
shouldUseScrollableHeader,
gate,
scrollViewTag,
profile,
labelerInfo,

View File

@ -210,7 +210,8 @@ function useSuggestedFollowsV2(): [
function SearchScreenSuggestedFollows() {
const pal = usePalette('default')
const useSuggestedFollows = useGate('use_new_suggestions_endpoint')
const gate = useGate()
const useSuggestedFollows = gate('use_new_suggestions_endpoint')
? // Conditional hook call here is *only* OK because useGate()
// result won't change until a remount.
useSuggestedFollowsV2
@ -406,8 +407,7 @@ export function SearchScreenInner({
const {isDesktop} = useWebMediaQueries()
const [activeTab, setActiveTab] = React.useState(0)
const {_} = useLingui()
const isNewSearch = useGate('new_search')
const gate = useGate()
const onPageSelected = React.useCallback(
(index: number) => {
@ -420,7 +420,7 @@ export function SearchScreenInner({
const sections = React.useMemo(() => {
if (!query) return []
if (isNewSearch) {
if (gate('new_search')) {
if (hasSession) {
return [
{
@ -487,7 +487,7 @@ export function SearchScreenInner({
]
}
}
}, [hasSession, isNewSearch, _, query, activeTab])
}, [hasSession, gate, _, query, activeTab])
if (hasSession) {
return query ? (