use in app browser for translations when enabled (#2663)

1 files changed, 12 insertions, 5 deletions

diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx
index a27ee0a58..1cc2bb824 100644
--- a/src/view/com/post-thread/PostThreadItem.tsx
+++ b/src/view/com/post-thread/PostThreadItem.tsx
@@ -40,6 +40,7 @@ import {useLingui} from '@lingui/react'
 import {useLanguagePrefs} from '#/state/preferences'
 import {useComposerControls} from '#/state/shell/composer'
 import {useModerationOpts} from '#/state/queries/preferences'
+import {useOpenLink} from '#/state/preferences/in-app-browser'
 import {Shadow, usePostShadow, POST_TOMBSTONE} from '#/state/cache/post-shadow'
 import {ThreadPost} from '#/state/queries/post-thread'
 import {useSession} from '#/state/session'
@@ -701,17 +702,23 @@ function ExpandedPostDetails({
 }) {
   const pal = usePalette('default')
   const {_} = useLingui()
+  const openLink = useOpenLink()
+  const onTranslatePress = React.useCallback(
+    () => openLink(translatorUrl),
+    [openLink, translatorUrl],
+  )
   return (
     <View style={[s.flexRow, s.mt2, s.mb10]}>
       <Text style={pal.textLight}>{niceDate(post.indexedAt)}</Text>
       {needsTranslation && (
         <>
           <Text style={pal.textLight}> &middot; </Text>
-          <Link href={translatorUrl} title={_(msg`Translate`)}>
-            <Text style={pal.link}>
-              <Trans>Translate</Trans>
-            </Text>
-          </Link>
+          <Text
+            style={pal.link}
+            title={_(msg`Translate`)}
+            onPress={onTranslatePress}>
+            <Trans>Translate</Trans>
+          </Text>
         </>
       )}
     </View>