Add timestamp field to video report dialog (#11339)

src/screens/PostThread/components/ThreadItemAnchor.tsx

@@ -48,6 +48,7 @@ import {GalleryBleed} from '#/components/images/Gallery'
 import {Link} from '#/components/Link'
 import {ContentHider} from '#/components/moderation/ContentHider'
 import {PostAlerts} from '#/components/moderation/PostAlerts'
+import * as ReportDialogMetadataContext from '#/components/moderation/ReportDialog/ReportDialogMetadataContext'
 import {type AppModerationCause} from '#/components/Pills'
 import {Embed, PostEmbedViewContext} from '#/components/Post/Embed'
 import {TranslatedPost} from '#/components/Post/Translated'
@@ -84,16 +85,16 @@ export function ThreadItemAnchor({
   }
 
   return (
-    <ThreadItemAnchorInner
-      // Safeguard from clobbering per-post state below:
-      key={postShadow.uri}
-      item={item}
-      isRoot={isRoot}
-      postShadow={postShadow}
-      onPostSuccess={onPostSuccess}
-      threadgateRecord={threadgateRecord}
-      postSource={postSource}
-    />
+    <ReportDialogMetadataContext.Provider key={postShadow.uri}>
+      <ThreadItemAnchorInner
+        item={item}
+        isRoot={isRoot}
+        postShadow={postShadow}
+        onPostSuccess={onPostSuccess}
+        threadgateRecord={threadgateRecord}
+        postSource={postSource}
+      />
+    </ReportDialogMetadataContext.Provider>
   )
 }
 

src/screens/PostThread/components/ThreadItemPost.tsx

@@ -42,6 +42,7 @@ import {
 } from '#/components/images/Gallery'
 import {PostAlerts} from '#/components/moderation/PostAlerts'
 import {PostHider} from '#/components/moderation/PostHider'
+import * as ReportDialogMetadataContext from '#/components/moderation/ReportDialog/ReportDialogMetadataContext'
 import {type AppModerationCause} from '#/components/Pills'
 import {Embed, PostEmbedViewContext} from '#/components/Post/Embed'
 import {ShowMoreTextButton} from '#/components/Post/ShowMoreTextButton'
@@ -76,13 +77,15 @@ export function ThreadItemPost({
   }
 
   return (
-    <ThreadItemPostInner
-      item={item}
-      postShadow={postShadow}
-      threadgateRecord={threadgateRecord}
-      overrides={overrides}
-      onPostSuccess={onPostSuccess}
-    />
+    <ReportDialogMetadataContext.Provider key={postShadow.uri}>
+      <ThreadItemPostInner
+        item={item}
+        postShadow={postShadow}
+        threadgateRecord={threadgateRecord}
+        overrides={overrides}
+        onPostSuccess={onPostSuccess}
+      />
+    </ReportDialogMetadataContext.Provider>
   )
 }
 

src/screens/PostThread/components/ThreadItemTreePost.tsx

@@ -39,6 +39,7 @@ import {Trash_Stroke2_Corner0_Rounded as TrashIcon} from '#/components/icons/Tra
 import {GalleryBleed} from '#/components/images/Gallery'
 import {PostAlerts} from '#/components/moderation/PostAlerts'
 import {PostHider} from '#/components/moderation/PostHider'
+import * as ReportDialogMetadataContext from '#/components/moderation/ReportDialog/ReportDialogMetadataContext'
 import {type AppModerationCause} from '#/components/Pills'
 import {Embed, PostEmbedViewContext} from '#/components/Post/Embed'
 import {ShowMoreTextButton} from '#/components/Post/ShowMoreTextButton'
@@ -75,15 +76,15 @@ export function ThreadItemTreePost({
   }
 
   return (
-    <ThreadItemTreePostInner
-      // Safeguard from clobbering per-post state below:
-      key={postShadow.uri}
-      item={item}
-      postShadow={postShadow}
-      threadgateRecord={threadgateRecord}
-      overrides={overrides}
-      onPostSuccess={onPostSuccess}
-    />
+    <ReportDialogMetadataContext.Provider key={postShadow.uri}>
+      <ThreadItemTreePostInner
+        item={item}
+        postShadow={postShadow}
+        threadgateRecord={threadgateRecord}
+        overrides={overrides}
+        onPostSuccess={onPostSuccess}
+      />
+    </ReportDialogMetadataContext.Provider>
   )
 }
 

src/screens/VideoFeed/components/Scrubber.tsx

@@ -22,8 +22,8 @@ import {scheduleOnRN, scheduleOnUI} from 'react-native-worklets'
 import {useEventListener} from 'expo'
 import {type VideoPlayer} from 'expo-video'
 
+import {formatTime} from '#/lib/media/video/formatTime'
 import {atoms as a, tokens} from '#/alf'
-import {formatTime} from '#/components/Post/Embed/VideoEmbed/VideoEmbedInner/web-controls/utils'
 import {Text} from '#/components/Typography'
 
 // magic number that is roughly the min height of the write reply button

src/screens/VideoFeed/index.tsx

@@ -97,6 +97,7 @@ import * as Layout from '#/components/Layout'
 import {Link} from '#/components/Link'
 import {ListFooter} from '#/components/Lists'
 import * as Hider from '#/components/moderation/Hider'
+import * as ReportDialogMetadataContext from '#/components/moderation/ReportDialog/ReportDialogMetadataContext'
 import {PostControls} from '#/components/PostControls'
 import {RichText} from '#/components/RichText'
 import {Text} from '#/components/Typography'
@@ -112,7 +113,7 @@ function createThreeVideoPlayers(
   const eventInterval = platform({
     ios: 0.2,
     android: 0.5,
-    default: 0,
+    default: 0.2,
   })
   const p1 = createVideoPlayer(sources?.[0] ?? '')
   p1.loop = true
@@ -528,7 +529,7 @@ let VideoItem = ({
   // we can't distinguish between them
   const shouldRenderVideo = active || ios(adjacent)
 
-  return (
+  const content = (
     <View style={[a.relative, {height, width}]}>
       {postShadow === POST_TOMBSTONE ? (
         <View
@@ -573,6 +574,12 @@ let VideoItem = ({
       )}
     </View>
   )
+
+  return (
+    <ReportDialogMetadataContext.Provider key={post.uri}>
+      {content}
+    </ReportDialogMetadataContext.Provider>
+  )
 }
 VideoItem = memo(VideoItem)
 
@@ -587,6 +594,8 @@ function VideoItemInner({
 }) {
   const {bottom} = useSafeAreaInsets()
   const [isReady, setIsReady] = useState(!IS_ANDROID)
+  const reportDialogMetadata =
+    ReportDialogMetadataContext.useReportDialogMetadataContext()
 
   usePlaybackTelemetry({player, active, playlist: embed.playlist})
 
@@ -594,6 +603,19 @@ function VideoItemInner({
     if (IS_ANDROID && !isReady && evt.currentTime >= 0.05) {
       setIsReady(true)
     }
+    /*
+     * Players are pooled and reassigned as the user swipes. Only trust the item
+     * that's actually on screen.
+     */
+    if (
+      active &&
+      embed.presentation !== 'gif' &&
+      reportDialogMetadata &&
+      Number.isFinite(evt.currentTime) &&
+      evt.currentTime >= 0
+    ) {
+      reportDialogMetadata.current.videoTimestampSeconds = evt.currentTime
+    }
   })
 
   return (