Age assurance fast-follows (#8656)

* Add feed banner

* Comment

* Update nux name

* Handle did error

* Hide mod settings if underage or age restricted

* Add metrics

* Remove DEV override

* Copy suggestion

* Small copy edits

* useState

* Fix bug

* Update src/components/ageAssurance/useAgeAssuranceCopy.ts

Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>

* Get rid of debug button

---------

Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>
This commit is contained in:
Eric Bailey
2025-07-17 14:32:58 -05:00
committed by GitHub
parent 00b017804b
commit 964eed54ea
21 changed files with 462 additions and 262 deletions
+47
View File
@@ -43,11 +43,16 @@ import {
import {useLiveNowConfig} from '#/state/service-config'
import {useSession} from '#/state/session'
import {useProgressGuide} from '#/state/shell/progress-guide'
import {useSelectedFeed} from '#/state/shell/selected-feed'
import {List, type ListRef} from '#/view/com/util/List'
import {PostFeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
import {LoadMoreRetryBtn} from '#/view/com/util/LoadMoreRetryBtn'
import {type VideoFeedSourceContext} from '#/screens/VideoFeed/types'
import {useBreakpoints, useLayoutBreakpoints} from '#/alf'
import {
AgeAssuranceDismissibleFeedBanner,
useInternalState as useAgeAssuranceBannerState,
} from '#/components/ageAssurance/AgeAssuranceDismissibleFeedBanner'
import {ProgressGuide, SuggestedFollows} from '#/components/FeedInterstitials'
import {
PostFeedVideoGridRow,
@@ -131,6 +136,10 @@ type FeedRow =
type: 'showLessFollowup'
key: string
}
| {
type: 'ageAssuranceBanner'
key: string
}
export function getItemsForFeedback(feedRow: FeedRow): {
item: FeedPostSliceItem
@@ -335,6 +344,14 @@ let PostFeed = ({
const {trendingDisabled, trendingVideoDisabled} = useTrendingSettings()
const ageAssuranceBannerState = useAgeAssuranceBannerState()
const selectedFeed = useSelectedFeed()
/**
* Cached value of whether the current feed was selected at startup. We don't
* want this to update when user swipes.
*/
const [isCurrentFeedAtStartupSelected] = useState(selectedFeed === feed)
const feedItems: FeedRow[] = useMemo(() => {
// wraps a slice item, and replaces it with a showLessFollowup item
// if the user has pressed show less on it
@@ -450,6 +467,21 @@ let PostFeed = ({
type: 'interstitialProgressGuide',
key: 'interstitial-' + sliceIndex + '-' + lastFetchedAt,
})
} else {
/*
* Only insert if Discover was the last selected feed at
* startup, the progress guide isn't shown, and the
* banner is eligible to be shown.
*/
if (
isCurrentFeedAtStartupSelected &&
ageAssuranceBannerState.visible
) {
arr.push({
type: 'ageAssuranceBanner',
key: 'ageAssuranceBanner-' + sliceIndex,
})
}
}
if (!rightNavVisible && !trendingDisabled) {
arr.push({
@@ -478,6 +510,17 @@ let PostFeed = ({
key: 'interstitial-' + sliceIndex + '-' + lastFetchedAt,
})
}
} else {
/*
* Only insert if this feed was the last selected feed at
* startup and the banner is eligible to be shown.
*/
if (sliceIndex === 0 && isCurrentFeedAtStartupSelected) {
arr.push({
type: 'ageAssuranceBanner',
key: 'ageAssuranceBanner-' + sliceIndex,
})
}
}
}
@@ -580,6 +623,8 @@ let PostFeed = ({
isVideoFeed,
areVideoFeedsEnabled,
hasPressedShowLessUris,
ageAssuranceBannerState,
isCurrentFeedAtStartupSelected,
])
// events
@@ -666,6 +711,8 @@ let PostFeed = ({
return <SuggestedFollows feed={feed} />
} else if (row.type === 'interstitialProgressGuide') {
return <ProgressGuide />
} else if (row.type === 'ageAssuranceBanner') {
return <AgeAssuranceDismissibleFeedBanner />
} else if (row.type === 'interstitialTrending') {
return <TrendingInterstitial />
} else if (row.type === 'interstitialTrendingVideos') {