diff --git a/src/components/play-button/play-button.tsx b/src/components/play-button/play-button.tsx index 121b669..fe5243c 100644 --- a/src/components/play-button/play-button.tsx +++ b/src/components/play-button/play-button.tsx @@ -1,14 +1,27 @@ +import { useEffect } from 'react'; import { BiPause, BiPlay } from 'react-icons/bi/index'; +import { useSoundStore } from '@/store'; import { usePlay } from '@/contexts/play'; import styles from './play-button.module.css'; export function PlayButton() { - const { isPlaying, toggle } = usePlay(); + const { isPlaying, pause, toggle } = usePlay(); + const noSelected = useSoundStore(state => state.noSelected()); + + const handleClick = () => { + if (noSelected) return pause(); + + toggle(); + }; + + useEffect(() => { + if (isPlaying && noSelected) pause(); + }, [isPlaying, pause, noSelected]); return ( -