[Statsig] Add test gates and events (#3659)

* [Statsig] Add test gates and events

* Better types

src/lib/statsig/events.ts

@@ -113,4 +113,14 @@ export type LogEvents = {
       | 'ProfileMenu'
       | 'ProfileHoverCard'
   }
+
+  'test:all:always': {}
+  'test:all:sometimes': {}
+  'test:all:boosted_by_gate1': {reason: 'base' | 'gate1'}
+  'test:all:boosted_by_gate2': {reason: 'base' | 'gate2'}
+  'test:all:boosted_by_both': {reason: 'base' | 'gate1' | 'gate2'}
+  'test:gate1:always': {}
+  'test:gate1:sometimes': {}
+  'test:gate2:always': {}
+  'test:gate2:sometimes': {}
 }

src/lib/statsig/gates.ts

@@ -6,4 +6,6 @@ export type Gate =
   | 'hide_vertical_scroll_indicators'
   | 'show_follow_back_label_v2'
   | 'start_session_with_following_v2'
+  | 'test_gate_1'
+  | 'test_gate_2'
   | 'use_new_suggestions_endpoint'

src/view/screens/Profile.tsx

@@ -1,4 +1,4 @@
-import React, {useMemo} from 'react'
+import React, {useEffect, useMemo} from 'react'
 import {StyleSheet} from 'react-native'
 import {
   AppBskyActorDefs,
@@ -11,6 +11,7 @@ import {useLingui} from '@lingui/react'
 import {useFocusEffect} from '@react-navigation/native'
 import {useQueryClient} from '@tanstack/react-query'
 
+import {logEvent, useGate} from '#/lib/statsig/statsig'
 import {cleanError} from '#/lib/strings/errors'
 import {useProfileShadow} from '#/state/cache/profile-shadow'
 import {useLabelerInfoQuery} from '#/state/queries/labeler'
@@ -465,6 +466,7 @@ function ProfileScreenLoaded({
           accessibilityHint=""
         />
       )}
+      <TestGates />
     </ScreenHider>
   )
 }
@@ -522,3 +524,77 @@ const styles = StyleSheet.create({
     textAlign: 'center',
   },
 })
+
+const shouldExposeToGate2 = Math.random() < 0.2
+
+// --- Temporary: we're testing our Statsig setup ---
+let TestGates = React.memo(function TestGates() {
+  const gate = useGate()
+
+  useEffect(() => {
+    logEvent('test:all:always', {})
+    if (Math.random() < 0.2) {
+      logEvent('test:all:sometimes', {})
+    }
+    if (Math.random() < 0.1) {
+      logEvent('test:all:boosted_by_gate1', {
+        reason: 'base',
+      })
+    }
+    if (Math.random() < 0.1) {
+      logEvent('test:all:boosted_by_gate2', {
+        reason: 'base',
+      })
+    }
+    if (Math.random() < 0.1) {
+      logEvent('test:all:boosted_by_both', {
+        reason: 'base',
+      })
+    }
+  }, [])
+
+  return [
+    gate('test_gate_1') ? <TestGate1 /> : null,
+    shouldExposeToGate2 && gate('test_gate_2') ? <TestGate2 /> : null,
+  ]
+})
+
+function TestGate1() {
+  useEffect(() => {
+    logEvent('test:gate1:always', {})
+    if (Math.random() < 0.2) {
+      logEvent('test:gate1:sometimes', {})
+    }
+    if (Math.random() < 0.5) {
+      logEvent('test:all:boosted_by_gate1', {
+        reason: 'gate1',
+      })
+    }
+    if (Math.random() < 0.5) {
+      logEvent('test:all:boosted_by_both', {
+        reason: 'gate1',
+      })
+    }
+  }, [])
+  return null
+}
+
+function TestGate2() {
+  useEffect(() => {
+    logEvent('test:gate2:always', {})
+    if (Math.random() < 0.2) {
+      logEvent('test:gate2:sometimes', {})
+    }
+    if (Math.random() < 0.5) {
+      logEvent('test:all:boosted_by_gate2', {
+        reason: 'gate2',
+      })
+    }
+    if (Math.random() < 0.5) {
+      logEvent('test:all:boosted_by_both', {
+        reason: 'gate2',
+      })
+    }
+  }, [])
+  return null
+}