ansxor.ca
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
[Statsig] Make gate checks lazily (#3594)
authored by
GitHub
02becdf4
086dc93a
+1
eslint/use-typed-gates.js
+1
eslint/use-typed-gates.js
+2
-2
src/lib/hooks/useOTAUpdates.ts
+2
-2
src/lib/hooks/useOTAUpdates.ts
+18
-14
src/lib/statsig/statsig.tsx
+18
-14
src/lib/statsig/statsig.tsx
···
2
import {Platform} from 'react-native'
3
import {AppState, AppStateStatus} from 'react-native'
4
import {sha256} from 'js-sha256'
5
-
import {
6
-
Statsig,
7
-
StatsigProvider,
8
-
useGate as useStatsigGate,
9
-
} from 'statsig-react-native-expo'
10
11
import {logger} from '#/logger'
12
import {isWeb} from '#/platform/detection'
···
98
}
99
}
100
101
-
export function useGate(gateName: Gate): boolean {
102
-
const {isLoading, value} = useStatsigGate(gateName)
103
-
if (isLoading) {
104
-
// This should not happen because of waitForInitialization={true}.
105
-
console.error('Did not expected isLoading to ever be true.')
106
}
107
-
// This shouldn't technically be necessary but let's get a strong
108
-
// guarantee that a gate value can never change while mounted.
109
-
const [initialValue] = React.useState(value)
110
-
return initialValue
111
}
112
113
function toStatsigUser(did: string | undefined): StatsigUser {
···
2
import {Platform} from 'react-native'
3
import {AppState, AppStateStatus} from 'react-native'
4
import {sha256} from 'js-sha256'
5
+
import {Statsig, StatsigProvider} from 'statsig-react-native-expo'
6
7
import {logger} from '#/logger'
8
import {isWeb} from '#/platform/detection'
···
94
}
95
}
96
97
+
export function useGate(): (gateName: Gate) => boolean {
98
+
const cache = React.useRef<Map<Gate, boolean>>()
99
+
if (cache.current === undefined) {
100
+
cache.current = new Map()
101
}
102
+
const gate = React.useCallback((gateName: Gate): boolean => {
103
+
// TODO: Replace local cache with a proper session one.
104
+
const cachedValue = cache.current!.get(gateName)
105
+
if (cachedValue !== undefined) {
106
+
return cachedValue
107
+
}
108
+
const value = Statsig.initializeCalled()
109
+
? Statsig.checkGate(gateName)
110
+
: false
111
+
cache.current!.set(gateName, value)
112
+
return value
113
+
}, [])
114
+
return gate
115
}
116
117
function toStatsigUser(did: string | undefined): StatsigUser {
+2
-4
src/screens/Profile/Header/ProfileHeaderStandard.tsx
+2
-4
src/screens/Profile/Header/ProfileHeaderStandard.tsx
···
80
})
81
}, [track, openModal, profile])
82
83
-
const autoExpandSuggestionsOnProfileFollow = useGate(
84
-
'autoexpand_suggestions_on_profile_follow',
85
-
)
86
const onPressFollow = () => {
87
requireAuth(async () => {
88
try {
···
96
)}`,
97
),
98
)
99
-
if (isWeb && autoExpandSuggestionsOnProfileFollow) {
100
setShowSuggestedFollows(true)
101
}
102
} catch (e: any) {
···
80
})
81
}, [track, openModal, profile])
82
83
+
const gate = useGate()
84
const onPressFollow = () => {
85
requireAuth(async () => {
86
try {
···
94
)}`,
95
),
96
)
97
+
if (isWeb && gate('autoexpand_suggestions_on_profile_follow')) {
98
setShowSuggestedFollows(true)
99
}
100
} catch (e: any) {
+5
-6
src/state/shell/selected-feed.tsx
+5
-6
src/state/shell/selected-feed.tsx
···
1
import React from 'react'
2
3
import {useGate} from '#/lib/statsig/statsig'
4
import {isWeb} from '#/platform/detection'
5
import * as persisted from '#/state/persisted'
···
10
const stateContext = React.createContext<StateContext>('home')
11
const setContext = React.createContext<SetContext>((_: string) => {})
12
13
-
function getInitialFeed(startSessionWithFollowing: boolean) {
14
if (isWeb) {
15
if (window.location.pathname === '/') {
16
const params = new URLSearchParams(window.location.search)
···
26
return feedFromSession
27
}
28
}
29
-
if (!startSessionWithFollowing) {
30
const feedFromPersisted = persisted.get('lastSelectedHomeFeed')
31
if (feedFromPersisted) {
32
// Fall back to the last chosen one across all tabs.
···
37
}
38
39
export function Provider({children}: React.PropsWithChildren<{}>) {
40
-
const startSessionWithFollowing = useGate('start_session_with_following')
41
-
const [state, setState] = React.useState(() =>
42
-
getInitialFeed(startSessionWithFollowing),
43
-
)
44
45
const saveState = React.useCallback((feed: string) => {
46
setState(feed)
···
1
import React from 'react'
2
3
+
import {Gate} from '#/lib/statsig/gates'
4
import {useGate} from '#/lib/statsig/statsig'
5
import {isWeb} from '#/platform/detection'
6
import * as persisted from '#/state/persisted'
···
11
const stateContext = React.createContext<StateContext>('home')
12
const setContext = React.createContext<SetContext>((_: string) => {})
13
14
+
function getInitialFeed(gate: (gateName: Gate) => boolean) {
15
if (isWeb) {
16
if (window.location.pathname === '/') {
17
const params = new URLSearchParams(window.location.search)
···
27
return feedFromSession
28
}
29
}
30
+
if (!gate('start_session_with_following')) {
31
const feedFromPersisted = persisted.get('lastSelectedHomeFeed')
32
if (feedFromPersisted) {
33
// Fall back to the last chosen one across all tabs.
···
38
}
39
40
export function Provider({children}: React.PropsWithChildren<{}>) {
41
+
const gate = useGate()
42
+
const [state, setState] = React.useState(() => getInitialFeed(gate))
43
44
const saveState = React.useCallback((feed: string) => {
45
setState(feed)
+4
-2
src/view/com/feeds/FeedPage.tsx
+4
-2
src/view/com/feeds/FeedPage.tsx
···
53
const headerOffset = useHeaderOffset()
54
const scrollElRef = React.useRef<ListMethods>(null)
55
const [hasNew, setHasNew] = React.useState(false)
56
57
const scrollToTop = React.useCallback(() => {
58
scrollElRef.current?.scrollToOffset({
···
105
106
let feedPollInterval
107
if (
108
-
useGate('disable_poll_on_discover') &&
109
feed === // Discover
110
-
'feedgen|at://did:plc:z72i7hdynmk6r22z27h6tvur/app.bsky.feed.generator/whats-hot'
111
) {
112
feedPollInterval = undefined
113
} else {
···
53
const headerOffset = useHeaderOffset()
54
const scrollElRef = React.useRef<ListMethods>(null)
55
const [hasNew, setHasNew] = React.useState(false)
56
+
const gate = useGate()
57
58
const scrollToTop = React.useCallback(() => {
59
scrollElRef.current?.scrollToOffset({
···
106
107
let feedPollInterval
108
if (
109
feed === // Discover
110
+
'feedgen|at://did:plc:z72i7hdynmk6r22z27h6tvur/app.bsky.feed.generator/whats-hot' &&
111
+
// TODO: This gate check is still too early. Move it to where the polling happens.
112
+
gate('disable_poll_on_discover')
113
) {
114
feedPollInterval = undefined
115
} else {
+2
-2
src/view/com/post-thread/PostThreadFollowBtn.tsx
+2
-2
src/view/com/post-thread/PostThreadFollowBtn.tsx
···
48
'PostThreadItem',
49
)
50
const requireAuth = useRequireAuth()
51
-
const showFollowBackLabel = useGate('show_follow_back_label')
52
53
const isFollowing = !!profile.viewer?.following
54
const isFollowedBy = !!profile.viewer?.followedBy
···
140
style={[!isFollowing ? palInverted.text : pal.text, s.bold]}
141
numberOfLines={1}>
142
{!isFollowing ? (
143
-
showFollowBackLabel && isFollowedBy ? (
144
<Trans>Follow Back</Trans>
145
) : (
146
<Trans>Follow</Trans>
···
48
'PostThreadItem',
49
)
50
const requireAuth = useRequireAuth()
51
+
const gate = useGate()
52
53
const isFollowing = !!profile.viewer?.following
54
const isFollowedBy = !!profile.viewer?.followedBy
···
140
style={[!isFollowing ? palInverted.text : pal.text, s.bold]}
141
numberOfLines={1}>
142
{!isFollowing ? (
143
+
isFollowedBy && gate('show_follow_back_label') ? (
144
<Trans>Follow Back</Trans>
145
) : (
146
<Trans>Follow</Trans>
+5
-3
src/view/com/util/List.tsx
+5
-3
src/view/com/util/List.tsx
···
40
const isScrolledDown = useSharedValue(false)
41
const contextScrollHandlers = useScrollHandlers()
42
const pal = usePalette('default')
43
-
const showsVerticalScrollIndicator =
44
-
!useGate('hide_vertical_scroll_indicators') || isWeb
45
function handleScrolledDownChange(didScrollDown: boolean) {
46
onScrolledDownChange?.(didScrollDown)
47
}
···
97
scrollEventThrottle={1}
98
style={style}
99
ref={ref}
100
-
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
101
/>
102
)
103
}
···
40
const isScrolledDown = useSharedValue(false)
41
const contextScrollHandlers = useScrollHandlers()
42
const pal = usePalette('default')
43
+
const gate = useGate()
44
+
45
function handleScrolledDownChange(didScrollDown: boolean) {
46
onScrolledDownChange?.(didScrollDown)
47
}
···
97
scrollEventThrottle={1}
98
style={style}
99
ref={ref}
100
+
showsVerticalScrollIndicator={
101
+
isWeb || !gate('hide_vertical_scroll_indicators')
102
+
}
103
/>
104
)
105
}
+2
-5
src/view/com/util/Views.jsx
+2
-5
src/view/com/util/Views.jsx
+9
-10
src/view/screens/Home.tsx
+9
-10
src/view/screens/Home.tsx
···
111
}),
112
)
113
114
-
const disableMinShellOnForegrounding = useGate(
115
-
'disable_min_shell_on_foregrounding',
116
-
)
117
React.useEffect(() => {
118
-
if (disableMinShellOnForegrounding) {
119
-
const listener = AppState.addEventListener('change', nextAppState => {
120
-
if (nextAppState === 'active') {
121
setMinimalShellMode(false)
122
}
123
-
})
124
-
return () => {
125
-
listener.remove()
126
}
127
}
128
-
}, [setMinimalShellMode, disableMinShellOnForegrounding])
129
130
const onPageSelected = React.useCallback(
131
(index: number) => {
···
111
}),
112
)
113
114
+
const gate = useGate()
115
React.useEffect(() => {
116
+
const listener = AppState.addEventListener('change', nextAppState => {
117
+
if (nextAppState === 'active') {
118
+
// TODO: Check if minimal shell is on before logging an exposure.
119
+
if (gate('disable_min_shell_on_foregrounding')) {
120
setMinimalShellMode(false)
121
}
122
}
123
+
})
124
+
return () => {
125
+
listener.remove()
126
}
127
+
}, [setMinimalShellMode, gate])
128
129
const onPageSelected = React.useCallback(
130
(index: number) => {
+4
-3
src/view/screens/ModerationBlockedAccounts.tsx
+4
-3
src/view/screens/ModerationBlockedAccounts.tsx
···
38
const setMinimalShellMode = useSetMinimalShellMode()
39
const {isTabletOrDesktop} = useWebMediaQueries()
40
const {screen} = useAnalytics()
41
-
const showsVerticalScrollIndicator =
42
-
!useGate('hide_vertical_scroll_indicators') || isWeb
43
44
const [isPTRing, setIsPTRing] = React.useState(false)
45
const {
···
169
)}
170
// @ts-ignore our .web version only -prf
171
desktopFixedHeight
172
-
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
173
/>
174
)}
175
</CenteredView>
···
38
const setMinimalShellMode = useSetMinimalShellMode()
39
const {isTabletOrDesktop} = useWebMediaQueries()
40
const {screen} = useAnalytics()
41
+
const gate = useGate()
42
43
const [isPTRing, setIsPTRing] = React.useState(false)
44
const {
···
168
)}
169
// @ts-ignore our .web version only -prf
170
desktopFixedHeight
171
+
showsVerticalScrollIndicator={
172
+
isWeb || !gate('hide_vertical_scroll_indicators')
173
+
}
174
/>
175
)}
176
</CenteredView>
+5
-3
src/view/screens/ModerationMutedAccounts.tsx
+5
-3
src/view/screens/ModerationMutedAccounts.tsx
···
38
const setMinimalShellMode = useSetMinimalShellMode()
39
const {isTabletOrDesktop} = useWebMediaQueries()
40
const {screen} = useAnalytics()
41
-
const showsVerticalScrollIndicator =
42
-
!useGate('hide_vertical_scroll_indicators') || isWeb
43
const [isPTRing, setIsPTRing] = React.useState(false)
44
const {
45
data,
···
167
)}
168
// @ts-ignore our .web version only -prf
169
desktopFixedHeight
170
-
showsVerticalScrollIndicator={showsVerticalScrollIndicator}
171
/>
172
)}
173
</CenteredView>
···
38
const setMinimalShellMode = useSetMinimalShellMode()
39
const {isTabletOrDesktop} = useWebMediaQueries()
40
const {screen} = useAnalytics()
41
+
const gate = useGate()
42
+
43
const [isPTRing, setIsPTRing] = React.useState(false)
44
const {
45
data,
···
167
)}
168
// @ts-ignore our .web version only -prf
169
desktopFixedHeight
170
+
showsVerticalScrollIndicator={
171
+
isWeb || !gate('hide_vertical_scroll_indicators')
172
+
}
173
/>
174
)}
175
</CenteredView>
+3
-3
src/view/screens/Profile.tsx
+3
-3
src/view/screens/Profile.tsx
···
143
const setMinimalShellMode = useSetMinimalShellMode()
144
const {openComposer} = useComposerControls()
145
const {screen, track} = useAnalytics()
146
-
const shouldUseScrollableHeader = useGate('new_profile_scroll_component')
147
const {
148
data: labelerInfo,
149
error: labelerError,
···
317
// =
318
319
const renderHeader = React.useCallback(() => {
320
-
if (shouldUseScrollableHeader) {
321
return (
322
<ExpoScrollForwarderView scrollViewTag={scrollViewTag}>
323
<ProfileHeader
···
343
)
344
}
345
}, [
346
-
shouldUseScrollableHeader,
347
scrollViewTag,
348
profile,
349
labelerInfo,
···
143
const setMinimalShellMode = useSetMinimalShellMode()
144
const {openComposer} = useComposerControls()
145
const {screen, track} = useAnalytics()
146
+
const gate = useGate()
147
const {
148
data: labelerInfo,
149
error: labelerError,
···
317
// =
318
319
const renderHeader = React.useCallback(() => {
320
+
if (gate('new_profile_scroll_component')) {
321
return (
322
<ExpoScrollForwarderView scrollViewTag={scrollViewTag}>
323
<ProfileHeader
···
343
)
344
}
345
}, [
346
+
gate,
347
scrollViewTag,
348
profile,
349
labelerInfo,
+5
-5
src/view/screens/Search/Search.tsx
+5
-5
src/view/screens/Search/Search.tsx
···
210
211
function SearchScreenSuggestedFollows() {
212
const pal = usePalette('default')
213
-
const useSuggestedFollows = useGate('use_new_suggestions_endpoint')
214
? // Conditional hook call here is *only* OK because useGate()
215
// result won't change until a remount.
216
useSuggestedFollowsV2
···
406
const {isDesktop} = useWebMediaQueries()
407
const [activeTab, setActiveTab] = React.useState(0)
408
const {_} = useLingui()
409
-
410
-
const isNewSearch = useGate('new_search')
411
412
const onPageSelected = React.useCallback(
413
(index: number) => {
···
420
421
const sections = React.useMemo(() => {
422
if (!query) return []
423
-
if (isNewSearch) {
424
if (hasSession) {
425
return [
426
{
···
487
]
488
}
489
}
490
-
}, [hasSession, isNewSearch, _, query, activeTab])
491
492
if (hasSession) {
493
return query ? (
···
210
211
function SearchScreenSuggestedFollows() {
212
const pal = usePalette('default')
213
+
const gate = useGate()
214
+
const useSuggestedFollows = gate('use_new_suggestions_endpoint')
215
? // Conditional hook call here is *only* OK because useGate()
216
// result won't change until a remount.
217
useSuggestedFollowsV2
···
407
const {isDesktop} = useWebMediaQueries()
408
const [activeTab, setActiveTab] = React.useState(0)
409
const {_} = useLingui()
410
+
const gate = useGate()
411
412
const onPageSelected = React.useCallback(
413
(index: number) => {
···
420
421
const sections = React.useMemo(() => {
422
if (!query) return []
423
+
if (gate('new_search')) {
424
if (hasSession) {
425
return [
426
{
···
487
]
488
}
489
}
490
+
}, [hasSession, gate, _, query, activeTab])
491
492
if (hasSession) {
493
return query ? (