fix(mobile): Remove useAnimatedKeyboard hook (#860)

tonkeeper · May 15, 2024 · d2523f5 · d2523f5
1 parent 893dc52
commit d2523f5
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 23 deletions.
diff --git a/packages/mobile/src/core/BatterySend/BatterySend.tsx b/packages/mobile/src/core/BatterySend/BatterySend.tsx
@@ -41,7 +41,7 @@ import { compareAddresses } from '$utils/address';
 import { AnimatedScrollView } from 'react-native-reanimated/lib/typescript/reanimated2/component/ScrollView';
 import { BatteryPackItem } from '$core/BatterySend/components';
 import { t } from '@tonkeeper/shared/i18n';
-import { Keyboard } from 'react-native';
+import { Keyboard, Platform } from 'react-native';
 
 let dnsAbortController: null | AbortController = null;
 
@@ -174,7 +174,7 @@ export const BatterySend: React.FC<BatterySendProps> = ({ route }) => {
   const scrollRef = useRef<AnimatedScrollView>();
 
   const handleAmountInputFocus = async () => {
-    await delay(100);
+    await delay(250);
     scrollRef.current?.scrollToEnd();
   };
 
@@ -353,7 +353,7 @@ export const BatterySend: React.FC<BatterySendProps> = ({ route }) => {
               </TouchableOpacity>
             </View>
           }
-          isModal
+          isModal={Platform.OS === 'ios'}
           title={t('battery.recharge_by_crypto.title')}
         />
         <Screen.ScrollView

diff --git a/packages/uikit/src/components/KeyboardSpacer.tsx b/packages/uikit/src/components/KeyboardSpacer.tsx
@@ -1,11 +1,12 @@
 import { memo } from 'react';
 
-import Animated, { useAnimatedKeyboard, useAnimatedStyle } from 'react-native-reanimated';
+import Animated, { useAnimatedStyle } from 'react-native-reanimated';
+import { useReanimatedKeyboardHeight } from '../utils/keyboard';
 
 interface KeyboardSpacerProps {}
 
 export const KeyboardSpacer = memo<KeyboardSpacerProps>((props) => {
-  const { height } = useAnimatedKeyboard();
+  const { height } = useReanimatedKeyboardHeight();
 
   const style = useAnimatedStyle(() => ({
     height: height.value,

diff --git a/packages/uikit/src/containers/Screen/ScreenScrollView.tsx b/packages/uikit/src/containers/Screen/ScreenScrollView.tsx
@@ -4,15 +4,13 @@ import { forwardRef, memo, useEffect, useMemo } from 'react';
 import { useBottomTabBarHeight } from '@tonkeeper/router';
 import { useScrollToTop } from '@react-navigation/native';
 import { ns, useMergeRefs } from '../../utils';
-import Animated, { useAnimatedKeyboard, useAnimatedStyle } from 'react-native-reanimated';
+import Animated from 'react-native-reanimated';
 import { useScreenScroll } from './hooks';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { safeAreaInsets } from '@tonkeeper/mobile/src/utils';
 
 interface ScreenScrollView extends ScrollViewProps {
   hideBottomSeparator?: boolean;
   indent?: boolean;
-  keyboardAvoiding?: boolean;
   withBottomInset?: boolean;
 }
 
@@ -24,7 +22,6 @@ export const ScreenScrollView = memo(
       withBottomInset,
       indent,
       hideBottomSeparator,
-      keyboardAvoiding,
       contentContainerStyle,
       ...other
     } = props;
@@ -39,7 +36,6 @@ export const ScreenScrollView = memo(
     } = useScreenScroll();
     const tabBarHeight = useBottomTabBarHeight();
     const setRef = useMergeRefs(scrollRef, ref);
-    const keyboard = useAnimatedKeyboard();
     const bottomInset = useSafeAreaInsets().bottom;
 
     useScrollToTop(scrollRef as any);
@@ -51,13 +47,6 @@ export const ScreenScrollView = memo(
       };
     }, []);
 
-    const animatedKeyboardAvoidingContentStyle = useAnimatedStyle(() => ({
-      marginTop: -Math.max(
-        keyboard.height.value - (withBottomInset ? bottomInset * 2 : 0),
-        0,
-      ),
-    }));
-
     const contentStyle = useMemo(() => {
       return [
         { paddingBottom: tabBarHeight },
@@ -79,12 +68,7 @@ export const ScreenScrollView = memo(
           ref={setRef}
           {...other}
         >
-          <Animated.View
-            style={[
-              headerOffsetStyle,
-              keyboardAvoiding && animatedKeyboardAvoidingContentStyle,
-            ]}
-          />
+          <Animated.View style={[headerOffsetStyle]} />
           {props.children}
         </Animated.ScrollView>
         {!hideBottomSeparator && <ScreenBottomSeparator />}