[APP-1782] Analytics migration (#9734)
* WIP * Clean up growthbook code, integrate into init and sessions * Move everything out of React * Add metrics client * Move to separate file * Shared metadata cache * Ensure we update metadata when session ID changes * Ensure userMetadata is cleared when logging out * WIP revamp * Integrate feature gates into analytics context * Clean up old code * Fix useMeta util * Some comments and cleanup * Add logger to base analytics context * Refactor current route handling * Rip out LogEvent from navigation * Update tracking endpoint * Migrate toClout * Clear out statsig client * Add todo, reset logger readme * Ope fix statsig noop * Refactor logging in feed-feedback, add debug logging to metrics client * Remove LogEvents alias for Metrics * Prefer root package export * Remove Metrics alias from logger * [APP-1782] Migrate to new analytics APIs (#9735) * Migrate logEvent to useAnalytics * Migrate logger.metric to useAnalytics * Migrate tricky spot, fix types * Migrate remaining tricky spot * Missed one * Remove metric() from logger * Migrate useGate to useAnalytics * Remove all other StatSig mentions * Update event payload * Update logger tests * Mock expo method * Fix session ID bug * Add session ID test * Add test for metrics client * Clarify intent * Clean up core analytics file * Clean up the call once utils * Fix TODO * Fix TODO * Fix TODO * Fix TODO * Fix TODO * Remove debug code * Fix navigation context * OK nav context is not working, todo * Checkpoint: works but feels hacky * Fix navigation context issue * Improve feature API * Improve metric logging * Update logger tests
This commit is contained in:
@@ -20,8 +20,9 @@ import {Divider} from '#/components/Divider'
|
||||
import {createStaticClick, InlineLinkText} from '#/components/Link'
|
||||
import * as Toast from '#/components/Toast'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {logger, useAgeAssurance} from '#/ageAssurance'
|
||||
import {useAgeAssurance} from '#/ageAssurance'
|
||||
import {useComputeAgeAssuranceRegionAccess} from '#/ageAssurance/useComputeAgeAssuranceRegionAccess'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
import {IS_NATIVE} from '#/env'
|
||||
import {useDeviceGeolocationApi} from '#/geolocation'
|
||||
|
||||
@@ -41,6 +42,7 @@ export function AgeAssuranceAccountCard({style}: ViewStyleProp & {}) {
|
||||
function Inner({style}: ViewStyleProp & {}) {
|
||||
const t = useTheme()
|
||||
const {_, i18n} = useLingui()
|
||||
const ax = useAnalytics()
|
||||
const control = useDialogControl()
|
||||
const appealControl = Dialog.useDialogControl()
|
||||
const locationControl = Dialog.useDialogControl()
|
||||
@@ -138,7 +140,7 @@ function Inner({style}: ViewStyleProp & {}) {
|
||||
label={_(msg`Contact our moderation team`)}
|
||||
{...createStaticClick(() => {
|
||||
appealControl.open()
|
||||
logger.metric('ageAssurance:appealDialogOpen', {})
|
||||
ax.metric('ageAssurance:appealDialogOpen', {})
|
||||
})}>
|
||||
contact our moderation team
|
||||
</InlineLinkText>{' '}
|
||||
@@ -167,7 +169,7 @@ function Inner({style}: ViewStyleProp & {}) {
|
||||
color={hasInitiated ? 'secondary' : 'primary'}
|
||||
onPress={() => {
|
||||
control.open()
|
||||
logger.metric('ageAssurance:initDialogOpen', {
|
||||
ax.metric('ageAssurance:initDialogOpen', {
|
||||
hasInitiatedPreviously: hasInitiated,
|
||||
})
|
||||
}}>
|
||||
|
||||
@@ -10,7 +10,7 @@ import {ShieldCheck_Stroke2_Corner0_Rounded as Shield} from '#/components/icons/
|
||||
import {InlineLinkText} from '#/components/Link'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {useAgeAssurance} from '#/ageAssurance'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
|
||||
export function AgeAssuranceAdmonition({
|
||||
children,
|
||||
@@ -40,6 +40,7 @@ function Inner({
|
||||
}) {
|
||||
const t = useTheme()
|
||||
const {_} = useLingui()
|
||||
const ax = useAnalytics()
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -92,7 +93,7 @@ function Inner({
|
||||
to={'/settings/account'}
|
||||
style={[a.text_sm, a.leading_snug, a.font_semi_bold]}
|
||||
onPress={() => {
|
||||
logger.metric('ageAssurance:navigateToSettings', {})
|
||||
ax.metric('ageAssurance:navigateToSettings', {})
|
||||
}}>
|
||||
account settings.
|
||||
</InlineLinkText>
|
||||
|
||||
@@ -15,6 +15,7 @@ import * as Dialog from '#/components/Dialog'
|
||||
import {Loader} from '#/components/Loader'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
|
||||
export function AgeAssuranceAppealDialog({
|
||||
control,
|
||||
@@ -37,6 +38,7 @@ export function AgeAssuranceAppealDialog({
|
||||
|
||||
function Inner({control}: {control: Dialog.DialogControlProps}) {
|
||||
const {_} = useLingui()
|
||||
const ax = useAnalytics()
|
||||
const {currentAccount} = useSession()
|
||||
const {gtPhone} = useBreakpoints()
|
||||
const agent = useAgent()
|
||||
@@ -46,7 +48,7 @@ function Inner({control}: {control: Dialog.DialogControlProps}) {
|
||||
|
||||
const {mutate, isPending} = useMutation({
|
||||
mutationFn: async () => {
|
||||
logger.metric('ageAssurance:appealDialogSubmit', {})
|
||||
ax.metric('ageAssurance:appealDialogSubmit', {})
|
||||
|
||||
await agent.createModerationReport(
|
||||
{
|
||||
|
||||
@@ -12,7 +12,7 @@ import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times'
|
||||
import {Link} from '#/components/Link'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {useAgeAssurance} from '#/ageAssurance'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
|
||||
export function useInternalState() {
|
||||
const aa = useAgeAssurance()
|
||||
@@ -42,6 +42,7 @@ export function useInternalState() {
|
||||
|
||||
export function AgeAssuranceDismissibleFeedBanner() {
|
||||
const t = useTheme()
|
||||
const ax = useAnalytics()
|
||||
const {_} = useLingui()
|
||||
const {visible, close} = useInternalState()
|
||||
const copy = useAgeAssuranceCopy()
|
||||
@@ -66,7 +67,7 @@ export function AgeAssuranceDismissibleFeedBanner() {
|
||||
to="/settings/account"
|
||||
onPress={() => {
|
||||
close()
|
||||
logger.metric('ageAssurance:navigateToSettings', {})
|
||||
ax.metric('ageAssurance:navigateToSettings', {})
|
||||
}}
|
||||
style={[a.w_full, a.justify_between, a.align_center, a.gap_md]}>
|
||||
<View
|
||||
@@ -105,7 +106,7 @@ export function AgeAssuranceDismissibleFeedBanner() {
|
||||
size="small"
|
||||
onPress={() => {
|
||||
close()
|
||||
logger.metric('ageAssurance:dismissFeedBanner', {})
|
||||
ax.metric('ageAssurance:dismissFeedBanner', {})
|
||||
}}
|
||||
style={[
|
||||
a.absolute,
|
||||
|
||||
@@ -10,10 +10,11 @@ import {useAgeAssuranceCopy} from '#/components/ageAssurance/useAgeAssuranceCopy
|
||||
import {Button, ButtonIcon} from '#/components/Button'
|
||||
import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times'
|
||||
import {useAgeAssurance} from '#/ageAssurance'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
|
||||
export function AgeAssuranceDismissibleNotice({style}: ViewStyleProp & {}) {
|
||||
const {_} = useLingui()
|
||||
const ax = useAnalytics()
|
||||
const aa = useAgeAssurance()
|
||||
const {nux} = useNux(Nux.AgeAssuranceDismissibleNotice)
|
||||
const copy = useAgeAssuranceCopy()
|
||||
@@ -45,7 +46,7 @@ export function AgeAssuranceDismissibleNotice({style}: ViewStyleProp & {}) {
|
||||
completed: true,
|
||||
data: undefined,
|
||||
})
|
||||
logger.metric('ageAssurance:dismissSettingsNotice', {})
|
||||
ax.metric('ageAssurance:dismissSettingsNotice', {})
|
||||
}}
|
||||
style={[
|
||||
a.absolute,
|
||||
|
||||
@@ -19,8 +19,7 @@ import {useSession} from '#/state/session'
|
||||
import {atoms as a, web} from '#/alf'
|
||||
import {Admonition} from '#/components/Admonition'
|
||||
import {AgeAssuranceBadge} from '#/components/ageAssurance/AgeAssuranceBadge'
|
||||
import {urls} from '#/components/ageAssurance/const'
|
||||
import {KWS_SUPPORTED_LANGS} from '#/components/ageAssurance/const'
|
||||
import {KWS_SUPPORTED_LANGS, urls} from '#/components/ageAssurance/const'
|
||||
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
||||
import * as Dialog from '#/components/Dialog'
|
||||
import {Divider} from '#/components/Divider'
|
||||
@@ -30,9 +29,9 @@ import {LanguageSelect} from '#/components/LanguageSelect'
|
||||
import {SimpleInlineLinkText} from '#/components/Link'
|
||||
import {Loader} from '#/components/Loader'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAgeAssurance} from '#/ageAssurance'
|
||||
import {useBeginAgeAssurance} from '#/ageAssurance/useBeginAgeAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
|
||||
export {useDialogControl} from '#/components/Dialog/context'
|
||||
|
||||
@@ -64,6 +63,7 @@ export function AgeAssuranceInitDialog({
|
||||
|
||||
function Inner() {
|
||||
const {_} = useLingui()
|
||||
const ax = useAnalytics()
|
||||
const {currentAccount} = useSession()
|
||||
const langPrefs = useLanguagePrefs()
|
||||
const cleanError = useCleanError()
|
||||
@@ -116,7 +116,7 @@ function Inner() {
|
||||
const onSubmit = async () => {
|
||||
setLanguageError(false)
|
||||
|
||||
logger.metric('ageAssurance:initDialogSubmit', {})
|
||||
ax.metric('ageAssurance:initDialogSubmit', {})
|
||||
|
||||
try {
|
||||
const {status} = runEmailValidation()
|
||||
@@ -143,7 +143,7 @@ function Inner() {
|
||||
error = _(
|
||||
msg`Please enter a valid, non-temporary email address. You may need to access this email in the future.`,
|
||||
)
|
||||
logger.metric('ageAssurance:initDialogError', {code: 'InvalidEmail'})
|
||||
ax.metric('ageAssurance:initDialogError', {code: 'InvalidEmail'})
|
||||
} else if (e.error === 'DidTooLong') {
|
||||
error = (
|
||||
<>
|
||||
@@ -159,14 +159,14 @@ function Inner() {
|
||||
</Trans>
|
||||
</>
|
||||
)
|
||||
logger.metric('ageAssurance:initDialogError', {code: 'DidTooLong'})
|
||||
ax.metric('ageAssurance:initDialogError', {code: 'DidTooLong'})
|
||||
} else {
|
||||
logger.metric('ageAssurance:initDialogError', {code: 'other'})
|
||||
ax.metric('ageAssurance:initDialogError', {code: 'other'})
|
||||
}
|
||||
} else {
|
||||
const {clean, raw} = cleanError(e)
|
||||
error = clean || raw || error
|
||||
logger.metric('ageAssurance:initDialogError', {code: 'other'})
|
||||
ax.metric('ageAssurance:initDialogError', {code: 'other'})
|
||||
}
|
||||
|
||||
setError(error)
|
||||
|
||||
@@ -16,7 +16,7 @@ import {CircleInfo_Stroke2_Corner0_Rounded as ErrorIcon} from '#/components/icon
|
||||
import {Loader} from '#/components/Loader'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {refetchAgeAssuranceServerState} from '#/ageAssurance'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
import {IS_NATIVE} from '#/env'
|
||||
|
||||
export type AgeAssuranceRedirectDialogState = {
|
||||
@@ -81,6 +81,7 @@ export function AgeAssuranceRedirectDialog() {
|
||||
|
||||
export function Inner({}: {optimisticState?: AgeAssuranceRedirectDialogState}) {
|
||||
const t = useTheme()
|
||||
const ax = useAnalytics()
|
||||
const {_} = useLingui()
|
||||
const agent = useAgent()
|
||||
const polling = useRef(false)
|
||||
@@ -94,7 +95,7 @@ export function Inner({}: {optimisticState?: AgeAssuranceRedirectDialogState}) {
|
||||
|
||||
polling.current = true
|
||||
|
||||
logger.metric('ageAssurance:redirectDialogOpen', {})
|
||||
ax.metric('ageAssurance:redirectDialogOpen', {})
|
||||
|
||||
wait(
|
||||
3e3,
|
||||
@@ -125,18 +126,18 @@ export function Inner({}: {optimisticState?: AgeAssuranceRedirectDialogState}) {
|
||||
|
||||
setSuccess(true)
|
||||
|
||||
logger.metric('ageAssurance:redirectDialogSuccess', {})
|
||||
ax.metric('ageAssurance:redirectDialogSuccess', {})
|
||||
})
|
||||
.catch(() => {
|
||||
if (unmounted.current) return
|
||||
setError(true)
|
||||
logger.metric('ageAssurance:redirectDialogFail', {})
|
||||
ax.metric('ageAssurance:redirectDialogFail', {})
|
||||
})
|
||||
|
||||
return () => {
|
||||
unmounted.current = true
|
||||
}
|
||||
}, [agent, control])
|
||||
}, [ax, agent, control])
|
||||
|
||||
if (success) {
|
||||
return (
|
||||
|
||||
@@ -13,7 +13,7 @@ import * as Layout from '#/components/Layout'
|
||||
import {Link} from '#/components/Link'
|
||||
import {Text} from '#/components/Typography'
|
||||
import {useAgeAssurance} from '#/ageAssurance'
|
||||
import {logger} from '#/ageAssurance'
|
||||
import {useAnalytics} from '#/analytics'
|
||||
|
||||
export function AgeRestrictedScreen({
|
||||
children,
|
||||
@@ -27,6 +27,7 @@ export function AgeRestrictedScreen({
|
||||
rightHeaderSlot?: React.ReactNode
|
||||
}) {
|
||||
const {_} = useLingui()
|
||||
const ax = useAnalytics()
|
||||
const copy = useAgeAssuranceCopy()
|
||||
const aa = useAgeAssurance()
|
||||
|
||||
@@ -74,7 +75,7 @@ export function AgeRestrictedScreen({
|
||||
variant="solid"
|
||||
color="primary"
|
||||
onPress={() => {
|
||||
logger.metric('ageAssurance:navigateToSettings', {})
|
||||
ax.metric('ageAssurance:navigateToSettings', {})
|
||||
}}>
|
||||
<ButtonText>
|
||||
<Trans>Go to account settings</Trans>
|
||||
|
||||
Reference in New Issue
Block a user