current play plause

Signed-off-by: ale <ale@manalejandro.com>

src/App.js

@@ -13,9 +13,7 @@ const App = () => {
     [title, setTitle] = useState('Stream Radio'),
     [currentListeners, setCurrentListeners] = useState(0),
     [maxListeners, setMaxListeners] = useState(0),
-    [playPause, setPlayPause] = useState(false),
     audioElmRef = useRef(null),
-    once = useRef(false),
     audioAnalyzer = () => {
       const audioCtx = new (window.AudioContext || window.webkitAudioContext)(),
         analyzer = audioCtx.createAnalyser()
@@ -30,18 +28,6 @@ const App = () => {
       }
       setAnalyzerData({ analyzer, bufferLength, dataArray })
     },
-    play = () => {
-      if (audioElmRef.current) {
-        audioElmRef.current.play()
-        setPlayPause(true)
-      }
-    },
-    pause = () => {
-      if (audioElmRef.current) {
-        audioElmRef.current.pause()
-        setPlayPause(false)
-      }
-    },
     loadData = () => {
       fetch('/stream.json').then(response => response.json()).then(json => {
         setJson(json)
@@ -115,9 +101,9 @@ const App = () => {
       <h4><p className="bounce"><a href={link} target="_blank" title={title} alt={title}>{bounce}</a></p></h4>
       <div>
         <h2>Audio Controls</h2>
-        {!playPause ?
+        {audioElmRef.current?.paused ?
-          <button onClick={play}>Play ⏯️</button> :
+          <button onClick={() => audioElmRef.current?.play()}>Play ⏯️</button> :
-          <button onClick={pause}>Pause ⏯️</button>
+          <button onClick={() => audioElmRef.current?.pause()}>Pause ⏯️</button>
         }
         <br /><br />
         <button onClick={() => setCurrentVolume(currentVolume >= 0 && currentVolume <= 0.9 ? currentVolume + 0.1 : currentVolume)}>Volume Up 🔊</button>