fix js variable reference error on loading the audio player component

jam-ui/src/components/jamtracks/JKAudioPlayer.js

@@ -23,7 +23,7 @@ const JKAudioPlayer = ({ audioUrl }) => {
 
   useEffect(() => {
     if (!audio || !audioPlayer) return;
-    if(audio){
+    if (audio) {
       stopAudio();
     }
     const audioLoadedDataEventListener = audio.addEventListener("loadeddata", () => {
@@ -44,7 +44,7 @@ const JKAudioPlayer = ({ audioUrl }) => {
     //audio.play();
 
     return () => {
-      if(audio){
+      if (audio) {
         stopAudio();
         audio.removeEventListener("loadeddata", audioLoadedDataEventListener);
         clearInterval(audioPercentageCheckInterval);
@@ -110,7 +110,6 @@ const JKAudioPlayer = ({ audioUrl }) => {
     audioPlayer.current.querySelector(".controls .volume-percentage").style.width = volume * 100 + '%';
   }
 
-  
   function getTimeCodeFromNum(num) {
     let seconds = parseInt(num);
     let minutes = parseInt(seconds / 60);
@@ -125,6 +124,7 @@ const JKAudioPlayer = ({ audioUrl }) => {
   }
 
   return (
+    audioUrl && audio && (
       <div className="audio-player" ref={audioPlayer}>
 
         <div className="controls">
@@ -132,7 +132,6 @@ const JKAudioPlayer = ({ audioUrl }) => {
             <button
               onClick={togglePlayPause}
               className="play-pause-button"
-
             >
               {isPlaying ? (
                 <img src={pauseIcon} alt="Pause" width="30" />
@@ -168,6 +167,8 @@ const JKAudioPlayer = ({ audioUrl }) => {
         </div>
       </div>
     )
+  );
+
 }
 
 export default JKAudioPlayer