mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
1import {interpolate, useAnimatedStyle} from 'react-native-reanimated'
2import {useMinimalShellMode as useMinimalShellModeState} from '#/state/shell/minimal-mode'
3import {useShellLayout} from '#/state/shell/shell-layout'
4
5export function useMinimalShellMode() {
6 const mode = useMinimalShellModeState()
7 const {footerHeight, headerHeight} = useShellLayout()
8
9 const footerMinimalShellTransform = useAnimatedStyle(() => {
10 return {
11 pointerEvents: mode.value === 0 ? 'auto' : 'none',
12 opacity: Math.pow(1 - mode.value, 2),
13 transform: [
14 {
15 translateY: interpolate(mode.value, [0, 1], [0, footerHeight.value]),
16 },
17 ],
18 }
19 })
20 const headerMinimalShellTransform = useAnimatedStyle(() => {
21 return {
22 pointerEvents: mode.value === 0 ? 'auto' : 'none',
23 opacity: Math.pow(1 - mode.value, 2),
24 transform: [
25 {
26 translateY: interpolate(mode.value, [0, 1], [0, -headerHeight.value]),
27 },
28 ],
29 }
30 })
31 const fabMinimalShellTransform = useAnimatedStyle(() => {
32 return {
33 transform: [
34 {
35 translateY: interpolate(mode.value, [0, 1], [-44, 0]),
36 },
37 ],
38 }
39 })
40 return {
41 footerMinimalShellTransform,
42 headerMinimalShellTransform,
43 fabMinimalShellTransform,
44 }
45}