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 });
+ },
+}));