[Video] Toggle controls when entering fullscreen (#5113)

bluesky-social · Sep 3, 2024 · 7f26ad5 · 7f26ad5
1 parent 5d300be
commit 7f26ad5
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx b/src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx
@@ -26,6 +26,7 @@ export function VideoEmbedInnerNative({
   const {_} = useLingui()
   const {player} = useActiveVideoNative()
   const ref = useRef<VideoView>(null)
+  const [isFullscreen, setIsFullscreen] = useState(false)
 
   const enterFullscreen = useCallback(() => {
     ref.current?.enterFullscreen()
@@ -46,12 +47,13 @@ export function VideoEmbedInnerNative({
         player={player}
         style={[a.flex_1, a.rounded_sm]}
         contentFit="contain"
-        nativeControls={false}
+        nativeControls={isFullscreen}
         accessibilityIgnoresInvertColors
         onEnterFullscreen={() => {
           PlatformInfo.setAudioCategory(AudioCategory.Playback)
           PlatformInfo.setAudioActive(true)
           player.muted = false
+          setIsFullscreen(true)
         }}
         onExitFullscreen={() => {
           PlatformInfo.setAudioCategory(AudioCategory.Ambient)
@@ -60,6 +62,7 @@ export function VideoEmbedInnerNative({
           if (!player.playing) {
             player.play()
           }
+          setIsFullscreen(false)
         }}
         accessibilityLabel={
           embed.alt ? _(msg`Video: ${embed.alt}`) : _(msg`Video`)