diff --git a/src/components/Timer/Timer.tsx b/src/components/Timer/Timer.tsx index c026b81..b2f4c6a 100644 --- a/src/components/Timer/Timer.tsx +++ b/src/components/Timer/Timer.tsx @@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'; import TimeManager from '../../helpers/TimeManager'; import Button from '../Button/Button'; import styles from './Timer.module.css' +import { formatTime } from '../../helpers/Formatters'; const Timer = () => { const [timeManager, recreateTimeManager] = useState(() => new TimeManager(0)) @@ -9,19 +10,15 @@ const Timer = () => { const [startDate, setStartDate] = useState('00:00'); const [endDate, setEndDate] = useState('00:00'); - const formatTime = (date: Date) => { - const hours = String(date.getHours()).padStart(2, '0'); - const minutes = String(date.getMinutes()).padStart(2, '0'); - return `${hours}:${minutes}`; - }; + useEffect(() => { timeManager.start() console.log("timer started") const interval = setInterval(() => { setRemainingTime(timeManager.getRemainingTime()); - let startString = formatTime(timeManager.getStartDate()); - let endString = formatTime(timeManager.getEndDate()); + const startString = formatTime(timeManager.getStartDate()); + const endString = formatTime(timeManager.getEndDate()); if (startString === endString) { setStartDate('00:00'); setEndDate('00:00'); diff --git a/src/helpers/Formatters.ts b/src/helpers/Formatters.ts new file mode 100644 index 0000000..94aea7f --- /dev/null +++ b/src/helpers/Formatters.ts @@ -0,0 +1,12 @@ +export const formatFullTime = (date: Date) => { + const hours = String(date.getHours()).padStart(2, '0'); + const minutes = String(date.getMinutes()).padStart(2, '0'); + const seconds = String(date.getSeconds()).padStart(2, '0'); + return `${hours}:${minutes}:${seconds}`; +}; + +export const formatTime = (date: Date) => { + const hours = String(date.getHours()).padStart(2, '0'); + const minutes = String(date.getMinutes()).padStart(2, '0'); + return `${hours}:${minutes}`; +}; \ No newline at end of file diff --git a/src/pages/Timers/Timers.tsx b/src/pages/Timers/Timers.tsx index e41ed1c..6bcf596 100644 --- a/src/pages/Timers/Timers.tsx +++ b/src/pages/Timers/Timers.tsx @@ -1,6 +1,7 @@ -import { useEffect, useState } from 'react'; +import {useEffect, useState} from 'react'; import Timer from '../../components/Timer/Timer'; import styles from './Timers.module.css'; +import {formatFullTime} from "../../helpers/Formatters.ts"; const Timers = () => { const [time, setTime] = useState(new Date()); @@ -13,18 +14,12 @@ const Timers = () => { return () => clearInterval(intervalId); }, []) - const formatTime = (date: Date) => { - const hours = String(date.getHours()).padStart(2, '0'); - const minutes = String(date.getMinutes()).padStart(2, '0'); - const seconds = String(date.getSeconds()).padStart(2, '0'); - return `${hours}:${minutes}:${seconds}`; - }; return (