mobile: improve animation for fluid panels

apps/mobile/app/components/fluid-panels/index.tsx

@@ -31,6 +31,7 @@ import { Gesture, GestureDetector } from "react-native-gesture-handler";
 import Animated, {
   runOnJS,
   SharedValue,
+  SnappySpringConfig,
   useAnimatedReaction,
   useAnimatedStyle,
   useSharedValue,
@@ -354,13 +355,9 @@ export const FluidPanels = forwardRef<TabsRef, TabProps>(function FluidTabs(
       const finalValue = isSwipeLeft
         ? translateX.value - velocityX / 40.0
         : translateX.value + velocityX / 40.0;
-
       const animationConfig: WithSpringConfig = {
-        velocity: velocityX,
-        mass: 0.5,
-        overshootClamping: true,
-        damping: 800,
-        stiffness: 800
+        velocity: velocityX / 10,
+        ...SnappySpringConfig
       };
 
       if (finalValue < homePosition) {

apps/mobile/app/components/side-menu/menu-item.tsx

@@ -110,9 +110,9 @@ function _MenuItem({
         canGoBack: false
       });
     }
-    setImmediate(() => {
+    setTimeout(() => {
       Navigation.closeDrawer();
-    });
+    }, 32);
   };
 
   return (
@@ -154,8 +154,8 @@ function _MenuItem({
               item.icon === "crown"
                 ? colors.static.yellow
                 : isFocused
-                ? colors.selected.icon
-                : colors.secondary.icon
+                  ? colors.selected.icon
+                  : colors.secondary.icon
             }
             size={AppFontSize.md}
           />

apps/mobile/app/components/ui/sheet/index.jsx

@@ -42,7 +42,7 @@ const SheetWrapper = ({
   closeOnTouchBackdrop = true,
   onHasReachedTop,
   overlay,
-  overlayOpacity = 0.3,
+  overlayOpacity = 0.7,
   enableGesturesInScrollView = false,
   bottomPadding = true,
   keyboardHandlerDisabled

apps/mobile/app/utils/menu-items.ts

@@ -72,8 +72,10 @@ export const MenuItemsList: SideMenuItem[] = [
     title: "Monographs",
     icon: "text-box-multiple-outline",
     onPress: () => {
-      Navigation.closeDrawer();
       Monographs.navigate();
+      setTimeout(() => {
+        Navigation.closeDrawer();
+      }, 32);
     },
     type: "side-menu-item"
   },