diff --git a/src/components/app/app.tsx b/src/components/app/app.tsx index 00be925..713e24a 100644 --- a/src/components/app/app.tsx +++ b/src/components/app/app.tsx @@ -1,4 +1,4 @@ -import { useMemo, useEffect, useRef } from 'react'; +import { useMemo, useEffect } from 'react'; import { useShallow } from 'zustand/react/shallow'; import { BiSolidHeart } from 'react-icons/bi/index'; import { Howler } from 'howler'; @@ -85,63 +85,18 @@ export function App() { return [...favorites, ...categories]; }, [favoriteSounds, categories]); - const audioElement = useRef(null); - - const play = useSoundStore(state => state.play); - const isPlaying = useSoundStore(state => state.isPlaying); - - useEffect(() => { - const dest = Howler.ctx.createMediaStreamDestination(); - - Howler.masterGain.connect(dest); - - if (audioElement.current) { - audioElement.current.volume = 0; - audioElement.current.srcObject = dest.stream; - } - }, []); - - useEffect(() => { - try { - navigator.mediaSession.setActionHandler('play', play); - navigator.mediaSession.setActionHandler('pause', pause); - navigator.mediaSession.setActionHandler('stop', pause); - } catch (error) { - console.log('Media session is no supported yet'); - } - }, [play, pause]); - - useEffect(() => { - if (isPlaying) { - audioElement.current?.play().then(() => { - navigator.mediaSession.metadata = new MediaMetadata({ - title: 'Moodist', - }); - - navigator.mediaSession.playbackState = 'playing'; - }); - } else { - audioElement.current?.pause(); - navigator.mediaSession.playbackState = 'paused'; - } - }, [isPlaying]); - return ( - <> - - - -
- - - + + + +
+ + + - - - - - -