Add moduleSuffixes to tsconfig (#11146)

Co-authored-by: Claude <noreply@anthropic.com>

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.native.tsx

@@ -1,3 +1,10 @@
-export function VideoEmbedInnerWeb() {
+import {type VideoEmbedInnerWebProps} from './VideoEmbedInnerWeb.shared'
+
+export {
+  HLSUnsupportedError,
+  VideoNotFoundError,
+} from './VideoEmbedInnerWeb.shared'
+
+export function VideoEmbedInnerWeb(_props: VideoEmbedInnerWebProps): never {
   throw new Error('VideoEmbedInnerWeb may not be used on native.')
 }

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.shared.ts

@@ -0,0 +1,21 @@
+import {type AppBskyEmbedVideo} from '@atproto/api'
+
+export type VideoEmbedInnerWebProps = {
+  embed: AppBskyEmbedVideo.View
+  active: boolean
+  setActive: () => void
+  onScreen: boolean
+  lastKnownTime: React.RefObject<number | undefined>
+}
+
+export class HLSUnsupportedError extends Error {
+  constructor() {
+    super('HLS is not supported')
+  }
+}
+
+export class VideoNotFoundError extends Error {
+  constructor() {
+    super('Video not found')
+  }
+}

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/VideoEmbedInnerWeb.tsx

@@ -1,6 +1,5 @@
 import {useCallback, useEffect, useId, useRef, useState} from 'react'
 import {View} from 'react-native'
-import {type AppBskyEmbedVideo} from '@atproto/api'
 import {msg} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
 import type * as HlsTypes from 'hls.js'
@@ -10,21 +9,25 @@ import {atoms as a} from '#/alf'
 import {AltBadgeWithDialog} from '#/components/AltBadgeWithDialog'
 import {useFullscreen} from '#/components/hooks/useFullscreen'
 import * as BandwidthEstimate from './bandwidth-estimate'
+import {
+  HLSUnsupportedError,
+  type VideoEmbedInnerWebProps,
+  VideoNotFoundError,
+} from './VideoEmbedInnerWeb.shared'
 import {Controls} from './web-controls/VideoControls'
 
+export {
+  HLSUnsupportedError,
+  VideoNotFoundError,
+} from './VideoEmbedInnerWeb.shared'
+
 export function VideoEmbedInnerWeb({
   embed,
   active,
   setActive,
   onScreen,
   lastKnownTime,
-}: {
-  embed: AppBskyEmbedVideo.View
-  active: boolean
-  setActive: () => void
-  onScreen: boolean
-  lastKnownTime: React.RefObject<number | undefined>
-}) {
+}: VideoEmbedInnerWebProps) {
   const containerRef = useRef<HTMLDivElement>(null)
   const videoRef = useRef<HTMLVideoElement>(null)
   const [focused, setFocused] = useState(false)
@@ -104,12 +107,6 @@ export function VideoEmbedInnerWeb({
   )
 }
 
-export class HLSUnsupportedError extends Error {
-  constructor() {
-    super('HLS is not supported')
-  }
-}
-
 // Bluesky serves HLS as MPEG-TS with H.264 + AAC. `Hls.isSupported()` is loose
 // (true if MSE supports *any* of {H.264, AV1, VP9} OR *any* of {AAC, FLAC}),
 // so on Linux boxes missing H.264 (e.g. no ubuntu-restricted-extras, sandboxed
@@ -138,12 +135,6 @@ function canPlayBskyVideoCodecs(): boolean {
   )
 }
 
-export class VideoNotFoundError extends Error {
-  constructor() {
-    super('Video not found')
-  }
-}
-
 type CachedPromise<T> = Promise<T> & {value: undefined | T}
 const promiseForHls = import(
   // @ts-ignore

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/web-controls/VideoControls.native.tsx

@@ -1,3 +1,5 @@
-export function Controls() {
+import {type ControlsProps} from './VideoControls.shared'
+
+export function Controls(_props: ControlsProps): never {
   throw new Error('VideoWebControls may not be used on native.')
 }

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/web-controls/VideoControls.shared.ts

@@ -0,0 +1,17 @@
+import type Hls from 'hls.js'
+
+export type ControlsProps = {
+  videoRef: React.RefObject<HTMLVideoElement | null>
+  hlsRef: React.RefObject<Hls | undefined | null>
+  active: boolean
+  setActive: () => void
+  focused: boolean
+  setFocused: (focused: boolean) => void
+  onScreen: boolean
+  fullscreenRef: React.RefObject<HTMLDivElement | null>
+  hlsLoading: boolean
+  hasSubtitleTrack: boolean
+  isGif: boolean
+  altText?: string
+  updateCuePositions: (controlsVisible?: boolean) => void
+}

src/components/Post/Embed/VideoEmbed/VideoEmbedInner/web-controls/VideoControls.tsx

@@ -3,7 +3,6 @@ import {Pressable, View} from 'react-native'
 import {msg} from '@lingui/core/macro'
 import {useLingui} from '@lingui/react'
 import {Trans} from '@lingui/react/macro'
-import type Hls from 'hls.js'
 
 import {clamp} from '#/lib/numbers'
 import {
@@ -33,6 +32,7 @@ import {TimeIndicator} from '../TimeIndicator'
 import {ControlButton} from './ControlButton'
 import {Scrubber} from './Scrubber'
 import {formatTime, useVideoElement} from './utils'
+import {type ControlsProps} from './VideoControls.shared'
 import {VolumeControl} from './VolumeControl'
 
 export function Controls({
@@ -49,21 +49,7 @@ export function Controls({
   isGif,
   altText,
   updateCuePositions,
-}: {
-  videoRef: React.RefObject<HTMLVideoElement | null>
-  hlsRef: React.RefObject<Hls | undefined | null>
-  active: boolean
-  setActive: () => void
-  focused: boolean
-  setFocused: (focused: boolean) => void
-  onScreen: boolean
-  fullscreenRef: React.RefObject<HTMLDivElement | null>
-  hlsLoading: boolean
-  hasSubtitleTrack: boolean
-  isGif: boolean
-  altText?: string
-  updateCuePositions: (controlsVisible?: boolean) => void
-}) {
+}: ControlsProps) {
   const {
     play,
     pause,