[Experiment] Always show bottom bar (#4946)

zio/stable
dan 2024-08-16 20:06:55 +01:00 committed by GitHub
parent a5af24b53b
commit 40ab67fc4b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 26 additions and 1 deletions

View File

@ -2,6 +2,7 @@ import {interpolate, useAnimatedStyle} from 'react-native-reanimated'
import {useMinimalShellMode} from '#/state/shell/minimal-mode' import {useMinimalShellMode} from '#/state/shell/minimal-mode'
import {useShellLayout} from '#/state/shell/shell-layout' import {useShellLayout} from '#/state/shell/shell-layout'
import {useGate} from '../statsig/statsig'
// Keep these separated so that we only pay for useAnimatedStyle that gets used. // Keep these separated so that we only pay for useAnimatedStyle that gets used.
@ -27,8 +28,13 @@ export function useMinimalShellHeaderTransform() {
export function useMinimalShellFooterTransform() { export function useMinimalShellFooterTransform() {
const mode = useMinimalShellMode() const mode = useMinimalShellMode()
const {footerHeight} = useShellLayout() const {footerHeight} = useShellLayout()
const gate = useGate()
const isFixedBottomBar = gate('fixed_bottom_bar')
const footerTransform = useAnimatedStyle(() => { const footerTransform = useAnimatedStyle(() => {
if (isFixedBottomBar) {
return {}
}
return { return {
pointerEvents: mode.value === 0 ? 'auto' : 'none', pointerEvents: mode.value === 0 ? 'auto' : 'none',
opacity: Math.pow(1 - mode.value, 2), opacity: Math.pow(1 - mode.value, 2),
@ -39,13 +45,25 @@ export function useMinimalShellFooterTransform() {
], ],
} }
}) })
return footerTransform return footerTransform
} }
export function useMinimalShellFabTransform() { export function useMinimalShellFabTransform() {
const mode = useMinimalShellMode() const mode = useMinimalShellMode()
const gate = useGate()
const isFixedBottomBar = gate('fixed_bottom_bar')
const fabTransform = useAnimatedStyle(() => { const fabTransform = useAnimatedStyle(() => {
if (isFixedBottomBar) {
return {
transform: [
{
translateY: -44,
},
],
}
}
return { return {
transform: [ transform: [
{ {

View File

@ -1,6 +1,7 @@
export type Gate = export type Gate =
// Keep this alphabetic please. // Keep this alphabetic please.
| 'debug_show_feedcontext' | 'debug_show_feedcontext'
| 'fixed_bottom_bar'
| 'new_user_guided_tour' | 'new_user_guided_tour'
| 'onboarding_minimum_interests' | 'onboarding_minimum_interests'
| 'show_follow_back_label_v2' | 'show_follow_back_label_v2'

View File

@ -7,6 +7,7 @@ import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
import {useSetTitle} from '#/lib/hooks/useSetTitle' import {useSetTitle} from '#/lib/hooks/useSetTitle'
import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
import {logEvent, LogEvents} from '#/lib/statsig/statsig' import {logEvent, LogEvents} from '#/lib/statsig/statsig'
import {useGate} from '#/lib/statsig/statsig'
import {emitSoftReset} from '#/state/events' import {emitSoftReset} from '#/state/events'
import {SavedFeedSourceInfo, usePinnedFeedsInfos} from '#/state/queries/feed' import {SavedFeedSourceInfo, usePinnedFeedsInfos} from '#/state/queries/feed'
import {FeedDescriptor, FeedParams} from '#/state/queries/post-feed' import {FeedDescriptor, FeedParams} from '#/state/queries/post-feed'
@ -88,6 +89,7 @@ function HomeScreenReady({
const selectedFeed = allFeeds[selectedIndex] const selectedFeed = allFeeds[selectedIndex]
const requestNotificationsPermission = useRequestNotificationsPermission() const requestNotificationsPermission = useRequestNotificationsPermission()
const triggerTourIfQueued = useTriggerTourIfQueued(TOURS.HOME) const triggerTourIfQueued = useTriggerTourIfQueued(TOURS.HOME)
const gate = useGate()
useSetTitle(pinnedFeedInfos[selectedIndex]?.displayName) useSetTitle(pinnedFeedInfos[selectedIndex]?.displayName)
useOTAUpdates() useOTAUpdates()
@ -169,6 +171,10 @@ function HomeScreenReady({
const {isMobile} = useWebMediaQueries() const {isMobile} = useWebMediaQueries()
useFocusEffect( useFocusEffect(
React.useCallback(() => { React.useCallback(() => {
if (gate('fixed_bottom_bar')) {
// Unnecessary because it's always there.
return
}
const listener = AppState.addEventListener('change', nextAppState => { const listener = AppState.addEventListener('change', nextAppState => {
if (nextAppState === 'active') { if (nextAppState === 'active') {
if (isMobile && mode.value === 1) { if (isMobile && mode.value === 1) {
@ -181,7 +187,7 @@ function HomeScreenReady({
return () => { return () => {
listener.remove() listener.remove()
} }
}, [setMinimalShellMode, mode, isMobile]), }, [setMinimalShellMode, mode, isMobile, gate]),
) )
const onPageSelected = React.useCallback( const onPageSelected = React.useCallback(