diff --git a/src/components/menu/items/sleep-timer.tsx b/src/components/menu/items/sleep-timer.tsx index 6af39ab..18fead6 100644 --- a/src/components/menu/items/sleep-timer.tsx +++ b/src/components/menu/items/sleep-timer.tsx @@ -1,5 +1,6 @@ import { IoMoonSharp } from 'react-icons/io5/index'; +import { useSleepTimerStore } from '@/stores/sleep-timer'; import { Item } from '../item'; interface SleepTimerProps { @@ -7,8 +8,11 @@ interface SleepTimerProps { } export function SleepTimer({ open }: SleepTimerProps) { + const active = useSleepTimerStore(state => state.active); + return ( } label="Sleep Timer" shortcut="Shift + T" diff --git a/src/components/modals/sleep-timer/sleep-timer.tsx b/src/components/modals/sleep-timer/sleep-timer.tsx index b3e44c7..9764cd5 100644 --- a/src/components/modals/sleep-timer/sleep-timer.tsx +++ b/src/components/modals/sleep-timer/sleep-timer.tsx @@ -6,6 +6,7 @@ import { dispatch } from '@/lib/event'; import { useSoundStore } from '@/stores/sound'; import { cn } from '@/helpers/styles'; import { FADE_OUT } from '@/constants/events'; +import { useSleepTimerStore } from '@/stores/sleep-timer'; import styles from './sleep-timer.module.css'; @@ -15,8 +16,12 @@ interface SleepTimerModalProps { } export function SleepTimerModal({ onClose, show }: SleepTimerModalProps) { + const setActive = useSleepTimerStore(state => state.set); + const [running, setRunning] = useState(false); + useEffect(() => setActive(running), [running, setActive]); + const [hours, setHours] = useState('0'); const [minutes, setMinutes] = useState('10'); diff --git a/src/stores/sleep-timer/index.ts b/src/stores/sleep-timer/index.ts new file mode 100644 index 0000000..244c212 --- /dev/null +++ b/src/stores/sleep-timer/index.ts @@ -0,0 +1,13 @@ +import { create } from 'zustand'; + +interface SleepTimerStore { + active: boolean; + set: (value: boolean) => void; +} + +export const useSleepTimerStore = create()(set => ({ + active: false, + set(value: boolean) { + set({ active: value }); + }, +}));