Mobile - useKeyboardOffset - Reset timeout when willShowSubscription …

…is called
WordPress · Apr 4, 2023 · 0572495 · 0572495
1 parent 3ff3fd4
commit 0572495
Showing 1 changed file with 18 additions and 2 deletions.
diff --git a/packages/components/src/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js b/packages/components/src/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js
@@ -35,19 +35,28 @@ export default function useKeyboardOffset(
 		clearTimeout( timeoutRef.current );
 		timeoutRef.current = setTimeout( () => {
 			setKeyboardOffset( 0 );
-		}, 500 );
+		}, 200 );
 	}, [ shouldPreventAutomaticScroll ] );
 
 	const onKeyboardDidShow = useCallback( ( { endCoordinates } ) => {
 		clearTimeout( timeoutRef.current );
 		setKeyboardOffset( endCoordinates.height );
 	}, [] );
 
+	const onKeyboardWillShow = useCallback( () => {
+		clearTimeout( timeoutRef.current );
+	}, [] );
+
 	useEffect( () => {
+		let willShowSubscription;
 		let showSubscription;
 		let hideSubscription;
 
 		if ( scrollEnabled ) {
+			willShowSubscription = Keyboard.addListener(
+				'keyboardWillShow',
+				onKeyboardWillShow
+			);
 			showSubscription = Keyboard.addListener(
 				'keyboardDidShow',
 				onKeyboardDidShow
@@ -57,15 +66,22 @@ export default function useKeyboardOffset(
 				onKeyboardDidHide
 			);
 		} else {
+			willShowSubscription?.remove();
 			showSubscription?.remove();
 			hideSubscription?.remove();
 		}
 
 		return () => {
 			clearTimeout( timeoutRef.current );
+			willShowSubscription?.remove();
 			showSubscription?.remove();
 			hideSubscription?.remove();
 		};
-	}, [ scrollEnabled, onKeyboardDidShow, onKeyboardDidHide ] );
+	}, [
+		onKeyboardDidHide,
+		onKeyboardDidShow,
+		onKeyboardWillShow,
+		scrollEnabled,
+	] );
 	return [ keyboardOffset ];
 }