diff --git a/src/lib/statsig/events.ts b/src/lib/statsig/events.ts index 76ba3257fa..8d684a4e7c 100644 --- a/src/lib/statsig/events.ts +++ b/src/lib/statsig/events.ts @@ -239,6 +239,10 @@ export type LogEvents = { 'trendingTopics:show': {} 'trendingTopics:hide': { - context: 'sidebar' | 'interstitial' | 'explore' + context: + | 'sidebar' + | 'interstitial' + | 'explore:trending' + | 'explore:recommendations' } } diff --git a/src/screens/Search/components/ExploreRecommendations.tsx b/src/screens/Search/components/ExploreRecommendations.tsx index e253cfb5ab..b7dd9f1331 100644 --- a/src/screens/Search/components/ExploreRecommendations.tsx +++ b/src/screens/Search/components/ExploreRecommendations.tsx @@ -1,15 +1,24 @@ +import React from 'react' import {View} from 'react-native' -import {Trans} from '@lingui/macro' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' +import {logEvent} from '#/lib/statsig/statsig' import {isWeb} from '#/platform/detection' -import {useTrendingSettings} from '#/state/preferences/trending' +import { + useTrendingSettings, + useTrendingSettingsApi, +} from '#/state/preferences/trending' import { DEFAULT_LIMIT as RECOMMENDATIONS_COUNT, useTrendingTopics, } from '#/state/queries/trending/useTrendingTopics' import {useTrendingConfig} from '#/state/trending-config' import {atoms as a, useGutters, useTheme} from '#/alf' +import {Button, ButtonIcon} from '#/components/Button' import {Hashtag_Stroke2_Corner0_Rounded} from '#/components/icons/Hashtag' +import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times' +import * as Prompt from '#/components/Prompt' import { TrendingTopic, TrendingTopicLink, @@ -25,17 +34,26 @@ export function ExploreRecommendations() { function Inner() { const t = useTheme() + const {_} = useLingui() const gutters = useGutters([0, 'compact']) const {data: trending, error, isLoading} = useTrendingTopics() const noRecs = !isLoading && !error && !trending?.suggested?.length + const {setTrendingDisabled} = useTrendingSettingsApi() + const trendingPrompt = Prompt.usePromptControl() + + const onConfirmHide = React.useCallback(() => { + logEvent('trendingTopics:hide', {context: 'explore:recommendations'}) + setTrendingDisabled(true) + }, [setTrendingDisabled]) return error || noRecs ? null : ( <> @@ -54,6 +72,15 @@ function Inner() { Feeds we think you might like. + @@ -90,6 +117,14 @@ function Inner() { )} + + ) } diff --git a/src/screens/Search/components/ExploreTrendingTopics.tsx b/src/screens/Search/components/ExploreTrendingTopics.tsx index a4766a0f41..ca4fa6e5ea 100644 --- a/src/screens/Search/components/ExploreTrendingTopics.tsx +++ b/src/screens/Search/components/ExploreTrendingTopics.tsx @@ -43,7 +43,7 @@ function Inner() { const trendingPrompt = Prompt.usePromptControl() const onConfirmHide = React.useCallback(() => { - logEvent('trendingTopics:hide', {context: 'explore'}) + logEvent('trendingTopics:hide', {context: 'explore:trending'}) setTrendingDisabled(true) }, [setTrendingDisabled]) @@ -51,9 +51,10 @@ function Inner() { <> @@ -78,9 +79,8 @@ function Inner() { What people are posting about. -