[QA-955] Dismiss keyboard when clicking external link (#8375)

AudiusProject · May 7, 2024 · 32746d6 · 32746d6
1 parent ba93306
commit 32746d6
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 4 deletions.
diff --git a/packages/mobile/src/components/core/Hyperlink.tsx b/packages/mobile/src/components/core/Hyperlink.tsx
@@ -58,6 +58,7 @@ export const Hyperlink = (props: HyperlinkProps) => {
     source,
     styles: stylesProp,
     style,
+    onPress,
     ...other
   } = props
   const styles = useStyles()
@@ -104,7 +105,8 @@ export const Hyperlink = (props: HyperlinkProps) => {
   const { onOpen: openLeavingAudiusModal } = useLeavingAudiusModal()
 
   const handlePress = useCallback(
-    (url: string) => {
+    (url: string, _match: Match) => {
+      onPress?.(url, _match)
       if (isInteralAudiusUrl(url)) {
         const path = getPathFromAudiusUrl(url)
         if (path) {
@@ -116,7 +118,7 @@ export const Hyperlink = (props: HyperlinkProps) => {
         openLeavingAudiusModal({ link: url })
       }
     },
-    [linkTo, openLink, openLeavingAudiusModal]
+    [onPress, linkTo, openLink, openLeavingAudiusModal]
   )
 
   const renderLink = useCallback(
@@ -182,7 +184,7 @@ export const Hyperlink = (props: HyperlinkProps) => {
                   left: linkLayout.x - linkContainerLayout.x
                 }
               ]}
-              onPress={() => handlePress(match.getAnchorHref())}
+              onPress={() => handlePress(match.getAnchorHref(), match)}
             >
               {text}
             </Text>

diff --git a/packages/mobile/src/harmony-native/components/input/TextInput/types.ts b/packages/mobile/src/harmony-native/components/input/TextInput/types.ts
@@ -31,6 +31,7 @@ type InternalProps = {
 }
 
 export type TextInputProps = RNTextInputProps & {
+  id?: string
   /**
    * Input sizes. NOTE: small inputs will not show the label
    * @default default

diff --git a/packages/mobile/src/screens/chat-screen/ChatMessageListItem.tsx b/packages/mobile/src/screens/chat-screen/ChatMessageListItem.tsx
@@ -12,7 +12,7 @@ import {
 import type { ChatMessageReaction } from '@audius/sdk'
 import { find } from 'linkifyjs'
 import type { ViewStyle, StyleProp } from 'react-native'
-import { Dimensions, View } from 'react-native'
+import { Dimensions, Keyboard, View } from 'react-native'
 import { useSelector } from 'react-redux'
 
 import ChatTail from 'app/assets/images/ChatTail.svg'
@@ -322,6 +322,7 @@ export const ChatMessageListItem = memo(function ChatMessageListItem(
                       ]}
                     >
                       <Hyperlink
+                        onPress={Keyboard.dismiss}
                         text={message.message}
                         styles={{
                           root: [