diff options
Diffstat (limited to 'src/lib')
-rw-r--r-- | src/lib/hooks/useMinimalShellTransform.ts | 45 |
1 files changed, 18 insertions, 27 deletions
diff --git a/src/lib/hooks/useMinimalShellTransform.ts b/src/lib/hooks/useMinimalShellTransform.ts index 17fe058e9..678776755 100644 --- a/src/lib/hooks/useMinimalShellTransform.ts +++ b/src/lib/hooks/useMinimalShellTransform.ts @@ -2,21 +2,24 @@ import {interpolate, useAnimatedStyle} from 'react-native-reanimated' import {useMinimalShellMode} from '#/state/shell/minimal-mode' 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. export function useMinimalShellHeaderTransform() { - const mode = useMinimalShellMode() + const {headerMode} = useMinimalShellMode() const {headerHeight} = useShellLayout() const headerTransform = useAnimatedStyle(() => { return { - pointerEvents: mode.value === 0 ? 'auto' : 'none', - opacity: Math.pow(1 - mode.value, 2), + pointerEvents: headerMode.value === 0 ? 'auto' : 'none', + opacity: Math.pow(1 - headerMode.value, 2), transform: [ { - translateY: interpolate(mode.value, [0, 1], [0, -headerHeight.value]), + translateY: interpolate( + headerMode.value, + [0, 1], + [0, -headerHeight.value], + ), }, ], } @@ -26,21 +29,20 @@ export function useMinimalShellHeaderTransform() { } export function useMinimalShellFooterTransform() { - const mode = useMinimalShellMode() + const {footerMode} = useMinimalShellMode() const {footerHeight} = useShellLayout() - const gate = useGate() - const isFixedBottomBar = gate('fixed_bottom_bar') const footerTransform = useAnimatedStyle(() => { - if (isFixedBottomBar) { - return {} - } return { - pointerEvents: mode.value === 0 ? 'auto' : 'none', - opacity: Math.pow(1 - mode.value, 2), + pointerEvents: footerMode.value === 0 ? 'auto' : 'none', + opacity: Math.pow(1 - footerMode.value, 2), transform: [ { - translateY: interpolate(mode.value, [0, 1], [0, footerHeight.value]), + translateY: interpolate( + footerMode.value, + [0, 1], + [0, footerHeight.value], + ), }, ], } @@ -50,24 +52,13 @@ export function useMinimalShellFooterTransform() { } export function useMinimalShellFabTransform() { - const mode = useMinimalShellMode() - const gate = useGate() - const isFixedBottomBar = gate('fixed_bottom_bar') + const {footerMode} = useMinimalShellMode() const fabTransform = useAnimatedStyle(() => { - if (isFixedBottomBar) { - return { - transform: [ - { - translateY: -44, - }, - ], - } - } return { transform: [ { - translateY: interpolate(mode.value, [0, 1], [-44, 0]), + translateY: interpolate(footerMode.value, [0, 1], [-44, 0]), }, ], } |