From d1ba0862d4a64d1ae053c1a0c32d2db60862b104 Mon Sep 17 00:00:00 2001
From: sieu-db <159281348+sieu-db@users.noreply.github.com>
Date: Sun, 11 Aug 2024 22:51:11 +0700
Subject: [PATCH] Support isLooping for audio player (#925)

* support isLooping for audio player

* update test

* resolve comment feedback

* clean up
---
 example/src/AudioPlayerExample.tsx                        | 8 ++++++++
 .../core/src/__tests__/components/AudioPlayer.test.tsx    | 2 ++
 .../MediaPlayer/AudioPlayer/AudioPlayerCommon.ts          | 1 +
 .../MediaPlayer/AudioPlayer/HeadlessAudioPlayer.tsx       | 8 ++++++++
 4 files changed, 19 insertions(+)

diff --git a/example/src/AudioPlayerExample.tsx b/example/src/AudioPlayerExample.tsx
index 0ff0c71ac..70b3badea 100644
--- a/example/src/AudioPlayerExample.tsx
+++ b/example/src/AudioPlayerExample.tsx
@@ -17,6 +17,14 @@ export default function AudioPlayerExample() {
           interruptionMode="stop"
         />
       </Section>
+      <Section style={{}} title="Loop">
+        <AudioPlayer
+          source={require("./assets/loop.wav")}
+          playsInBackground
+          interruptionMode="stop"
+          isLooping
+        />
+      </Section>
       <Section style={{}} title="Custom styling">
         <AudioPlayer
           style={{
diff --git a/packages/core/src/__tests__/components/AudioPlayer.test.tsx b/packages/core/src/__tests__/components/AudioPlayer.test.tsx
index e96f89ec4..ad57a9512 100644
--- a/packages/core/src/__tests__/components/AudioPlayer.test.tsx
+++ b/packages/core/src/__tests__/components/AudioPlayer.test.tsx
@@ -12,6 +12,7 @@ const mockAudioSource = {
 const mockPlayAsync = jest.fn();
 const mockPauseAsync = jest.fn();
 const mockUnloadAsync = jest.fn();
+const mockSetIsLoopAsync = jest.fn();
 
 // To ignore the warning: 'When testing, code that causes React state updates should be wrapped into act'
 // This is caused because state is updated in the useEffect, this is intentional and not an issue, so we can ignore it
@@ -44,6 +45,7 @@ jest.mock("expo-av", () => {
                 positionMillis: position,
               });
             },
+            setIsLoopingAsync: mockSetIsLoopAsync,
           },
         };
       },
diff --git a/packages/core/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.ts b/packages/core/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.ts
index ad2a1c51d..7a5762b24 100644
--- a/packages/core/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.ts
+++ b/packages/core/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.ts
@@ -8,6 +8,7 @@ export interface HeadlessAudioPlayerProps extends MediaPlayerProps {
   playsInBackground?: boolean;
   playsInSilentModeIOS?: boolean;
   playThroughEarpieceAndroid?: boolean;
+  isLooping?: boolean;
 }
 
 export interface AudioPlayerInterfaceProps {
diff --git a/packages/core/src/components/MediaPlayer/AudioPlayer/HeadlessAudioPlayer.tsx b/packages/core/src/components/MediaPlayer/AudioPlayer/HeadlessAudioPlayer.tsx
index 48c27bc65..121cf197f 100644
--- a/packages/core/src/components/MediaPlayer/AudioPlayer/HeadlessAudioPlayer.tsx
+++ b/packages/core/src/components/MediaPlayer/AudioPlayer/HeadlessAudioPlayer.tsx
@@ -31,12 +31,17 @@ const HeadlessAudioPlayer = React.forwardRef<
       playThroughEarpieceAndroid = false,
       onPlaybackStatusUpdate: onPlaybackStatusUpdateProp,
       onPlaybackFinish,
+      isLooping = false,
     },
     ref
   ) => {
     const [currentSound, setCurrentSound] = React.useState<Audio.Sound>();
     const [isPlaying, setIsPlaying] = React.useState(false);
 
+    React.useEffect(() => {
+      currentSound?.setIsLoopingAsync(isLooping);
+    }, [currentSound, isLooping]);
+
     const updateAudioMode = React.useCallback(async () => {
       try {
         await Audio.setAudioModeAsync({
@@ -71,6 +76,9 @@ const HeadlessAudioPlayer = React.forwardRef<
 
       if (status.isLoaded) {
         if (status.didJustFinish) {
+          if (isLooping) {
+            return;
+          }
           onPlaybackFinish?.();
         }
         setIsPlaying(status.isPlaying);