add on-device translation to replies

src/screens/PostThread/components/ThreadItemPost.tsx

@@ -38,12 +38,14 @@ import {PostHider} from '#/components/moderation/PostHider'
 import {type AppModerationCause} from '#/components/Pills'
 import {Embed, PostEmbedViewContext} from '#/components/Post/Embed'
 import {ShowMoreTextButton} from '#/components/Post/ShowMoreTextButton'
+import {TranslatedPost} from '#/components/Post/Translated'
 import {PostControls, PostControlsSkeleton} from '#/components/PostControls'
 import {RichText} from '#/components/RichText'
 import * as Skele from '#/components/Skeleton'
 import {SubtleHover} from '#/components/SubtleHover'
 import {Text} from '#/components/Typography'
 import {useActorStatus} from '#/features/liveNow'
+import {Provider as OnDeviceTranslationProvider} from '#/translation'
 
 export type ThreadItemPostProps = {
   item: Extract<ThreadItem, {type: 'threadPost'}>
@@ -68,13 +70,15 @@ export function ThreadItemPost({
   }
 
   return (
-    <ThreadItemPostInner
+    <OnDeviceTranslationProvider>
-      item={item}
+      <ThreadItemPostInner
-      postShadow={postShadow}
+        item={item}
-      threadgateRecord={threadgateRecord}
+        postShadow={postShadow}
-      overrides={overrides}
+        threadgateRecord={threadgateRecord}
-      onPostSuccess={onPostSuccess}
+        overrides={overrides}
-    />
+        onPostSuccess={onPostSuccess}
+      />
+    </OnDeviceTranslationProvider>
   )
 }
 
@@ -318,6 +322,7 @@ const ThreadItemPostInner = memo(function ThreadItemPostInner({
                       onPress={onPressShowMore}
                     />
                   )}
+                  <TranslatedPost postText={richText.text} standalone />
                 </View>
               ) : undefined}
               {post.embed && (

src/screens/PostThread/components/ThreadItemTreePost.tsx

@@ -38,11 +38,13 @@ import {PostHider} from '#/components/moderation/PostHider'
 import {type AppModerationCause} from '#/components/Pills'
 import {Embed, PostEmbedViewContext} from '#/components/Post/Embed'
 import {ShowMoreTextButton} from '#/components/Post/ShowMoreTextButton'
+import {TranslatedPost} from '#/components/Post/Translated'
 import {PostControls, PostControlsSkeleton} from '#/components/PostControls'
 import {RichText} from '#/components/RichText'
 import * as Skele from '#/components/Skeleton'
 import {SubtleHover} from '#/components/SubtleHover'
 import {Text} from '#/components/Typography'
+import {Provider as OnDeviceTranslationProvider} from '#/translation'
 
 /**
  * Mimic the space in PostMeta
@@ -70,15 +72,17 @@ export function ThreadItemTreePost({
   }
 
   return (
-    <ThreadItemTreePostInner
+    <OnDeviceTranslationProvider>
-      // Safeguard from clobbering per-post state below:
+      <ThreadItemTreePostInner
-      key={postShadow.uri}
+        // Safeguard from clobbering per-post state below:
-      item={item}
+        key={postShadow.uri}
-      postShadow={postShadow}
+        item={item}
-      threadgateRecord={threadgateRecord}
+        postShadow={postShadow}
-      overrides={overrides}
+        threadgateRecord={threadgateRecord}
-      onPostSuccess={onPostSuccess}
+        overrides={overrides}
-    />
+        onPostSuccess={onPostSuccess}
+      />
+    </OnDeviceTranslationProvider>
   )
 }
 
@@ -358,6 +362,7 @@ const ThreadItemTreePostInner = memo(function ThreadItemTreePostInner({
                           onPress={onPressShowMore}
                         />
                       )}
+                      <TranslatedPost postText={richText.text} standalone />
                     </View>
                   ) : null}
                   {post.embed && (