Make shell hide/show animation smoother

src/lib/hooks/useMinimalShellMode.tsx

@@ -7,21 +7,22 @@ export function useMinimalShellMode() {
   const store = useStores()
   const minimalShellInterp = useAnimatedValue(0)
   const footerMinimalShellTransform = {
-    transform: [{translateY: Animated.multiply(minimalShellInterp, 100)}],
+    opacity: Animated.subtract(1, minimalShellInterp),
+    transform: [{translateY: Animated.multiply(minimalShellInterp, 50)}],
   }
 
   React.useEffect(() => {
     if (store.shell.minimalShellMode) {
       Animated.timing(minimalShellInterp, {
         toValue: 1,
-        duration: 100,
+        duration: 150,
         useNativeDriver: true,
         isInteraction: false,
       }).start()
     } else {
       Animated.timing(minimalShellInterp, {
         toValue: 0,
-        duration: 100,
+        duration: 150,
         useNativeDriver: true,
         isInteraction: false,
       }).start()

src/view/com/pager/FeedsTabBarMobile.tsx

@@ -24,13 +24,14 @@ export const FeedsTabBar = observer(function FeedsTabBarImpl(
   React.useEffect(() => {
     Animated.timing(interp, {
       toValue: store.shell.minimalShellMode ? 1 : 0,
-      duration: 100,
+      duration: 150,
       useNativeDriver: true,
       isInteraction: false,
     }).start()
   }, [interp, store.shell.minimalShellMode])
   const transform = {
-    transform: [{translateY: Animated.multiply(interp, -100)}],
+    opacity: Animated.subtract(1, interp),
+    transform: [{translateY: Animated.multiply(interp, -50)}],
   }
 
   const brandBlue = useColorSchemeStyle(s.brandBlue, s.blue3)