[✨feat]: playSoundEffect 함수분리

src/pages/GamePage/GameCode/GameCode.tsx

@@ -1,8 +1,7 @@
-import { Howl } from 'howler';
 import { useCallback, useMemo, useRef } from 'react';
-import soundEffect from '@/assets/audio/soundEffect.mp3';
 import IngameHeader from '@/common/Ingame/IngameHeader';
 import IngameRank from '@/common/Ingame/IngameRank';
+import playSoundEffect from '@/pages/GamePage/common/playSoundEffect';
 import useIngameStore from '@/store/useIngameStore';
 import CanvasTrack from '../common/CanvasTrack';
 import TrackLine from '../common/TrackLine';
@@ -91,11 +90,9 @@ const GameCode = ({ publishIngame, userId }: GameCodeProps) => {
   );
 
   const handleUpdateScore = useCallback(() => {
-    const sound = new Howl({
-      src: [soundEffect],
-    });
     const newScore = currentScore + scorePerSubmit;
     publishIngame('/info', { currentScore: newScore });
+    const sound = playSoundEffect();
     sound.play();
   }, [currentScore, scorePerSubmit]);
 

src/pages/GamePage/GameSentence/GameSentence.tsx

@@ -1,10 +1,9 @@
-import { Howl } from 'howler';
 import { useCallback, useMemo, useRef, useState } from 'react';
-import soundEffect from '@/assets/audio/soundEffect.mp3';
 import Dashboard from '@/common/Ingame/Dashboard';
 import IngameHeader from '@/common/Ingame/IngameHeader';
 import IngameRank from '@/common/Ingame/IngameRank';
 import { SentenceNext } from '@/common/Ingame/SentenceBlocks';
+import playSoundEffect from '@/pages/GamePage/common/playSoundEffect';
 import useIngameStore from '@/store/useIngameStore';
 import CanvasTrack from '../common/CanvasTrack';
 import TrackLine from '../common/TrackLine';
@@ -89,15 +88,12 @@ const GameSentence = ({ publishIngame, userId }: GameSentenceProps) => {
   );
 
   const scorePerTrankLength = Math.ceil((1 / TotalSpacedWord) * 100);
-
   const handleUpdateScore: UpdateScoreType = useCallback(() => {
-    const sound = new Howl({
-      src: [soundEffect],
-    });
     const newScore = currentScore + scorePerTrankLength;
     publishIngame('/info', {
       currentScore: newScore,
     });
+    const sound = playSoundEffect();
     sound.play();
   }, [currentScore, scorePerTrankLength]);
 

src/pages/GamePage/common/playSoundEffect.ts

@@ -0,0 +1,10 @@
+import { Howl } from 'howler';
+import soundEffect from '@/assets/audio/soundEffect.mp3';
+
+const playSoundEffect = () => {
+  const sound = new Howl({
+    src: [soundEffect],
+  });
+  return sound;
+};
+export default playSoundEffect;