fix(ios): recording resume after an interruption

apps/CLAUDE.md

@@ -281,6 +281,10 @@ if (status !== 'Granted') return;
 
 ### Interruption handling
 
+Enable emission with `AudioManager.observeAudioInterruptions(true)`, then listen.
+
+**Playback:** pause on `began` (native does not resume players). The AudioFile example resumes on `ended` when it had been playing.
+
 ```tsx
 useEffect(() => {
   const sub = AudioManager.addSystemEventListener('interruption', (event) => {
@@ -290,6 +294,8 @@ useEffect(() => {
 }, []);
 ```
 
+**Recording:** native always resumes the engine. Do not `Recorder.pause()` on `began`. iOS has already stopped I/O; the engine is `Interrupted`, not `Paused`. Only `Interrupted` is retried on `ended` / foreground — `Recorder.pause()` would move the engine to `Paused` and disable that retry. JS only freezes UI that still looks live (the Record demo's scrolling waveform). Unfreeze only on `ended` (failed resume does not emit `ended`).
+
 ## Shared UI Components
 
 All in `apps/common-app/src/components/`:

apps/common-app/src/demos/Record/Record.tsx

@@ -32,11 +32,13 @@ const Record: FC = () => {
       : RecordingState.Recording;
   });
   const [hasPermissions, setHasPermissions] = useState<boolean>(false);
+  const [isInterrupted, setIsInterrupted] = useState(false);
   const [recordedBuffer, setRecordedBuffer] = useState<AudioBuffer | null>(
     null
   );
   const currentPositionSV = useSharedValue(0);
   const playbackSourceRef = useRef<AudioBufferSourceNode | null>(null);
+  const stateRef = useRef(state);
 
   const stopPlayback = useCallback(() => {
     const source = playbackSourceRef.current;
@@ -88,7 +90,7 @@ const Record: FC = () => {
     AudioManager.setAudioSessionOptions({
       iosCategory: 'playAndRecord',
       iosMode: 'default',
-      iosOptions: ['defaultToSpeaker', 'allowBluetoothA2DP'],
+      iosOptions: ['defaultToSpeaker', 'allowBluetoothA2DP', 'mixWithOthers'],
     });
 
     try {
@@ -107,6 +109,7 @@ const Record: FC = () => {
     setupNotification(false);
 
     if (result.status === 'success') {
+      setIsInterrupted(false);
       setState(RecordingState.Recording);
       return;
     }
@@ -119,6 +122,7 @@ const Record: FC = () => {
   const onPauseRecording = useCallback(() => {
     Recorder.pause();
     updateNotification(true);
+    setIsInterrupted(false);
     setState(RecordingState.Paused);
   }, []);
 
@@ -152,6 +156,7 @@ const Record: FC = () => {
   const onStopRecording = useCallback(async () => {
     const info = await Recorder.stop();
     RecordingNotificationManager.hide();
+    setIsInterrupted(false);
     setState(RecordingState.Loading);
 
     if (info.status !== 'success') {
@@ -263,6 +268,10 @@ const Record: FC = () => {
     ]
   );
 
+  useEffect(() => {
+    stateRef.current = state;
+  }, [state]);
+
   useEffect(() => {
     (async () => {
       const recordingPermissionStatus =
@@ -283,6 +292,31 @@ const Record: FC = () => {
     })();
   }, []);
 
+  useEffect(() => {
+    AudioManager.observeAudioInterruptions(true);
+
+    const interruptionSubscription = AudioManager.addSystemEventListener(
+      'interruption',
+      (event) => {
+        if (event.type === 'began') {
+          if (stateRef.current === RecordingState.Recording) {
+            setIsInterrupted(true);
+          }
+          return;
+        }
+
+        if (event.type === 'ended') {
+          setIsInterrupted(false);
+        }
+      }
+    );
+
+    return () => {
+      interruptionSubscription.remove();
+      AudioManager.observeAudioInterruptions(false);
+    };
+  }, []);
+
   useEffect(() => {
     const pauseListener = RecordingNotificationManager.addEventListener(
       'recordingNotificationPause',
@@ -357,7 +391,7 @@ const Record: FC = () => {
         <>
           <RecordingTime state={state} />
           <View style={styles.spacerS} />
-          <RecordingVisualization state={state} />
+          <RecordingVisualization state={state} isInterrupted={isInterrupted} />
         </>
       )}
       <View style={styles.spacerM} />