diff --git a/src/components/Settings.tsx b/src/components/Settings.tsx index 36f5782..34f9980 100644 --- a/src/components/Settings.tsx +++ b/src/components/Settings.tsx @@ -1,8 +1,21 @@ -import { useRef, useEffect } from 'react'; +import { useRef, useEffect, useState } from 'react'; import { IoIosSettings } from "react-icons/io"; const Settings = () => { const settingsRef = useRef(null); + const [breakTimeMultiplier, setBreakTimeMultiplier] = useState(0.2); + const [autostartTimers, setAutostartTimers] = useState(false); + + useEffect(() => { + const savedBreakTimeMultiplier = localStorage.getItem('breakTimeMultiplier'); + const savedAutostartTimers = localStorage.getItem('autostartTimers'); + if (savedBreakTimeMultiplier) { + setBreakTimeMultiplier(parseFloat(savedBreakTimeMultiplier)); + } + if (savedAutostartTimers) { + setAutostartTimers(savedAutostartTimers === 'true'); + } + }, []); const handleOpen = () => { if (settingsRef.current) { @@ -10,6 +23,11 @@ const Settings = () => { } } + const handleSave = () => { + localStorage.setItem('breakTimeMultiplier', breakTimeMultiplier.toString()); + localStorage.setItem('autostartTimers', autostartTimers.toString()); + } + return (
@@ -21,13 +39,13 @@ const Settings = () => {

Flowtime

Break Time Multiplier

The number multiplied against focus time to get break time (Default: 0.2)

- + setBreakTimeMultiplier(parseFloat(e.target.value))} />

Autostart Timers

Autostart timer when switching between focus and break (Default: false)

- + setAutostartTimers(e.target.checked)} />
- +