[Video] More tweaks to `AVAudioSession` options (#4910)

2 files changed, 17 insertions, 7 deletions

diff --git a/src/App.native.tsx b/src/App.native.tsx
index 29a6a738c..71b53e7a3 100644
--- a/src/App.native.tsx
+++ b/src/App.native.tsx
@@ -61,7 +61,7 @@ import {Provider as PortalProvider} from '#/components/Portal'
 import {Splash} from '#/Splash'
 import {Provider as TourProvider} from '#/tours'
 import {BackgroundNotificationPreferencesProvider} from '../modules/expo-background-notification-handler/src/BackgroundNotificationHandlerProvider'
-import {PlatformInfo} from '../modules/expo-bluesky-swiss-army'
+import {AudioCategory, PlatformInfo} from '../modules/expo-bluesky-swiss-army'
 
 SplashScreen.preventAutoHideAsync()
 
@@ -158,6 +158,7 @@ function App() {
   const [isReady, setReady] = useState(false)
 
   React.useEffect(() => {
+    PlatformInfo.setAudioCategory(AudioCategory.Ambient)
     PlatformInfo.setAudioMixWithOthers(true)
     initPersistedState().then(() => setReady(true))
   }, [])
diff --git a/src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx b/src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx
index 576866260..83bb2f423 100644
--- a/src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx
+++ b/src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx
@@ -12,7 +12,10 @@ import {android, atoms as a, useTheme} from '#/alf'
 import {Mute_Stroke2_Corner0_Rounded as MuteIcon} from '#/components/icons/Mute'
 import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as UnmuteIcon} from '#/components/icons/Speaker'
 import {Text} from '#/components/Typography'
-import {PlatformInfo} from '../../../../../../modules/expo-bluesky-swiss-army'
+import {
+  AudioCategory,
+  PlatformInfo,
+} from '../../../../../../modules/expo-bluesky-swiss-army'
 
 export function VideoEmbedInnerNative() {
   const player = useVideoPlayer()
@@ -39,10 +42,12 @@ export function VideoEmbedInnerNative() {
         style={a.flex_1}
         nativeControls={true}
         onEnterFullscreen={() => {
+          PlatformInfo.setAudioCategory(AudioCategory.Playback)
           PlatformInfo.setAudioMixWithOthers(false)
           player.muted = false
         }}
         onExitFullscreen={() => {
+          PlatformInfo.setAudioCategory(AudioCategory.Ambient)
           PlatformInfo.setAudioMixWithOthers(true)
           player.muted = true
         }}
@@ -96,12 +101,16 @@ function Controls({
     }
   }, [player])
 
-  const toggleSound = useCallback(() => {
-    const newValue = !player.muted
+  const toggleMuted = useCallback(() => {
+    const muted = !player.muted
     // We want to set this to the _inverse_ of the new value, because we actually want for the audio to be mixed when
     // the video is muted, and vice versa.
-    PlatformInfo.setAudioMixWithOthers(!newValue)
-    player.muted = newValue
+    const mix = !muted
+    const category = muted ? AudioCategory.Ambient : AudioCategory.Playback
+
+    PlatformInfo.setAudioCategory(category)
+    PlatformInfo.setAudioMixWithOthers(mix)
+    player.muted = muted
   }, [player])
 
   return (
@@ -140,7 +149,7 @@ function Controls({
         accessibilityRole="button"
       />
       <Pressable
-        onPress={toggleSound}
+        onPress={toggleMuted}
         style={{
           backgroundColor: 'rgba(0, 0, 0, 0.75)',
           borderRadius: 6,