From 0c45d04ff05d2796b58ff3af6c743bdd9f6987fa Mon Sep 17 00:00:00 2001
From: EunSeo-Baek <bosk1914@gmail.com>
Date: Fri, 3 Mar 2023 12:14:36 +0900
Subject: [PATCH] Do not play voice message when VoiceRecorder is recording

---
 src/hooks/VoicePlayer/useVoicePlayer.tsx | 14 +++++++++-----
 src/hooks/VoiceRecorder/index.tsx        |  2 ++
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/hooks/VoicePlayer/useVoicePlayer.tsx b/src/hooks/VoicePlayer/useVoicePlayer.tsx
index e1b1f9c74..82d64efc5 100644
--- a/src/hooks/VoicePlayer/useVoicePlayer.tsx
+++ b/src/hooks/VoicePlayer/useVoicePlayer.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from "react";
 import { useVoicePlayerContext } from ".";
 import { VOICE_PLAYER_AUDIO_ID } from "../../utils/consts";
+import { useVoiceRecorderContext } from "../VoiceRecorder";
 
 import { AudioUnitDefaultValue, VoicePlayerStatus } from "./dux/initialState";
 import { generateGroupKey } from "./utils";
@@ -34,14 +35,17 @@ export const useVoicePlayer = ({
     stop,
     voicePlayerStore,
   } = useVoicePlayerContext();
+  const { isRecordable } = useVoiceRecorderContext();
   const currentAudioUnit = voicePlayerStore?.audioStorage?.[groupKey] || AudioUnitDefaultValue();
 
   const playVoicePlayer = () => {
-    play?.({
-      groupKey,
-      audioFile,
-      audioFileUrl,
-    });
+    if (!isRecordable) {
+      play?.({
+        groupKey,
+        audioFile,
+        audioFileUrl,
+      });
+    }
   };
 
   const pauseVoicePlayer = () => {
diff --git a/src/hooks/VoiceRecorder/index.tsx b/src/hooks/VoiceRecorder/index.tsx
index eb905cd3c..9039cf1c2 100644
--- a/src/hooks/VoiceRecorder/index.tsx
+++ b/src/hooks/VoiceRecorder/index.tsx
@@ -62,6 +62,7 @@ export const VoiceRecorderProvider = (props: VoiceRecorderProps): React.ReactEle
             eventHandler?.onRecordingEnded(convertedAudioFile);
           });
           stream?.getAudioTracks?.().forEach?.(track => track?.stop());
+          setIsRecordable(false);
         };
         mediaRecorder?.start();
         setMediaRecorder(mediaRecorder);
@@ -77,6 +78,7 @@ export const VoiceRecorderProvider = (props: VoiceRecorderProps): React.ReactEle
     // Stop recording
     mediaRecorder?.stop();
     setMediaRecorder(null);
+    setIsRecordable(false);
     // TODO: logger
   }, [mediaRecorder]);