[PAY-3522] Hides keyboard when opening purchase drawer from a DM (#10116

)

packages/mobile/src/components/drawer/Drawer.tsx

@@ -9,6 +9,7 @@ import type {
   ViewStyle
 } from 'react-native'
 import {
+  Keyboard,
   Animated,
   PanResponder,
   Platform,
@@ -157,6 +158,10 @@ export type DrawerProps = {
    * The NowPlayingDrawer exhibits this behavior.
    */
   initialOffsetPosition?: number
+  /**
+   * Dismiss the keyboard when this drawer opens. Defaults to `false`
+   */
+  dismissKeyboardOnOpen?: boolean
   /**
    * Whether or not the drawer should close to the initial offset. i.e.
    * has it been opened to the offset once?
@@ -280,7 +285,8 @@ export const Drawer: DrawerComponent = ({
   onPanResponderMove,
   onPanResponderRelease,
   translationAnim: providedTranslationAnim,
-  disableSafeAreaView
+  disableSafeAreaView,
+  dismissKeyboardOnOpen = false
 }: DrawerProps) => {
   const styles = useStyles()
   const insets = useSafeAreaInsets()
@@ -413,6 +419,13 @@ export const Drawer: DrawerComponent = ({
     ]
   )
 
+  // If keyboard was visible when a drawer opens, hide it.
+  useEffect(() => {
+    if (isOpen && dismissKeyboardOnOpen && Keyboard.isVisible()) {
+      Keyboard.dismiss()
+    }
+  }, [isOpen, dismissKeyboardOnOpen])
+
   useEffect(() => {
     if (isOpen) {
       isOpenIntent.current = true

packages/mobile/src/components/premium-content-purchase-drawer/PremiumContentPurchaseDrawer.tsx

@@ -521,6 +521,7 @@ export const PremiumContentPurchaseDrawer = () => {
       onClosed={handleClosed}
       isGestureSupported={false}
       isFullscreen
+      dismissKeyboardOnOpen
     >
       {isLoading ? (
         <View style={styles.spinnerContainer}>