42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import { useState, useEffect } from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { toLocaleDigits } from '@/utils/persianDigit';
|
|
|
|
interface CountdownTimerProps {
|
|
initialSeconds: number;
|
|
onComplete?: () => void;
|
|
}
|
|
|
|
export function CountDownTimer({
|
|
initialSeconds,
|
|
onComplete,
|
|
}: CountdownTimerProps) {
|
|
const { i18n } = useTranslation();
|
|
const [secondsLeft, setSecondsLeft] = useState(initialSeconds);
|
|
|
|
useEffect(() => {
|
|
setSecondsLeft(initialSeconds);
|
|
|
|
const timer = setInterval(() => {
|
|
setSecondsLeft((prev) => {
|
|
if (prev <= 1) {
|
|
clearInterval(timer);
|
|
onComplete?.();
|
|
return 0;
|
|
}
|
|
return prev - 1;
|
|
});
|
|
}, 1000);
|
|
|
|
return () => clearInterval(timer);
|
|
}, [initialSeconds, onComplete]);
|
|
|
|
const formatTime = (totalSeconds: number) => {
|
|
const minutes = String(Math.floor(totalSeconds / 60)).padStart(2, '0');
|
|
const seconds = String(totalSeconds % 60).padStart(2, '0');
|
|
return toLocaleDigits(`${minutes}:${seconds}`, i18n.language);
|
|
};
|
|
|
|
return <span>{formatTime(secondsLeft)}</span>;
|
|
}
|