fix: upsert folder sheet crash fix, reanimated version fix, type errors fix

Author: tfomkin

apps/mobile/babel.config.js

@@ -12,7 +12,6 @@ module.exports = function (api) {
       'nativewind/babel',
     ],
     plugins: [
-      'react-native-reanimated/plugin',
       [
         'module-resolver',
         {
@@ -23,6 +22,7 @@ module.exports = function (api) {
           },
         },
       ],
+      'react-native-worklets/plugin',
     ],
   };
 };

apps/mobile/package.json

@@ -73,7 +73,7 @@
     "react-native-keyboard-controller": "1.18.5",
     "react-native-mmkv": "^3.2.0",
     "react-native-modal": "^14.0.0-rc.1",
-    "react-native-reanimated": "^4.1.6",
+    "react-native-reanimated": "~4.1.1",
     "react-native-safe-area-context": "~5.6.0",
     "react-native-screens": "~4.16.0",
     "react-native-svg": "15.12.1",

libs/mobile/shared/features/use-swipe-to-close/src/use-swipe-to-close.ts

@@ -1,12 +1,6 @@
 import { Gesture } from 'react-native-gesture-handler';
-import {
-  Extrapolation,
-  interpolate,
-  runOnJS,
-  useAnimatedStyle,
-  useSharedValue,
-  withTiming,
-} from 'react-native-reanimated';
+import { Extrapolation, interpolate, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
+import { scheduleOnRN } from 'react-native-worklets';
 import { screenHeight } from '@open-webui-react-native/mobile/shared/ui/styles';
 
 interface UseSwipeToCloseParams {
@@ -55,7 +49,7 @@ export const useSwipeToClose = ({ onReachDistance, scrollDirection = 'all' }: Us
     })
     .onEnd(() => {
       if (Math.abs(translateY.value) > 125) {
-        runOnJS(onReachDistance)();
+        scheduleOnRN(onReachDistance);
         translateY.value = withTiming(0, { duration: 750 });
       } else {
         translateY.value = withTiming(0, { duration: 350 });

libs/mobile/shared/ui/ui-kit/src/floated-label-input/component.tsx

@@ -1,5 +1,5 @@
 import { ReactElement, Ref, useState, useEffect } from 'react';
-import { NativeSyntheticEvent, Platform, TextInput, TextInputFocusEventData, TextInputProps } from 'react-native';
+import { Platform, TextInput, TextInputProps } from 'react-native';
 import { useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
 import { cn } from '@open-webui-react-native/mobile/shared/ui/styles';
 import { IconButton } from '../icon-button';
@@ -55,7 +55,6 @@ export const FloatedLabelInput = ({
     top: labelTop.value,
     left: labelLeft.value,
     transform: [{ scale: labelScale.value }],
-    transformOrigin: 'left',
   }));
 
   const accessoryRightComponent = isPassword ? (
@@ -64,12 +63,12 @@ export const FloatedLabelInput = ({
     accessoryRight
   );
 
-  const handleFocus = (e: NativeSyntheticEvent<TextInputFocusEventData>): void => {
+  const handleFocus: TextInputProps['onFocus'] = (e): void => {
     setIsFocused(true);
     onFocus?.(e);
   };
 
-  const handleBlur = (e: NativeSyntheticEvent<TextInputFocusEventData>): void => {
+  const handleBlur: TextInputProps['onBlur'] = (e): void => {
     setIsFocused(false);
     onBlur?.(e);
   };
@@ -85,7 +84,7 @@ export const FloatedLabelInput = ({
       {label && (
         <AnimatedView
           className={cn('absolute z-10 pl-12')}
-          style={labelAnimatedStyle}
+          style={[labelAnimatedStyle, { transformOrigin: 'left' }]}
           pointerEvents='none'>
           <AppText
             pointerEvents='none'