fix: changing email and convert from dialog to normal textfields

src/components/CountDownTimer.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { toLocaleDigits } from '@/utils/persianDigit';
 
@@ -14,27 +14,34 @@ export function CountDownTimer({
   const { i18n } = useTranslation();
   const [secondsLeft, setSecondsLeft] = useState(initialSeconds);
 
+  const onCompleteRef = useRef(onComplete);
+  useEffect(() => {
+    onCompleteRef.current = onComplete;
+  }, [onComplete]);
+
   useEffect(() => {
     setSecondsLeft(initialSeconds);
+  }, [initialSeconds]);
 
-    const timer = setInterval(() => {
+  useEffect(() => {
+    if (secondsLeft <= 0) return;
+    const id = setInterval(() => {
       setSecondsLeft((prev) => {
         if (prev <= 1) {
-          clearInterval(timer);
-          onComplete?.();
+          clearInterval(id);
+          onCompleteRef.current?.();
           return 0;
         }
         return prev - 1;
       });
     }, 1000);
-
-    return () => clearInterval(timer);
-  }, [initialSeconds, onComplete]);
+    return () => clearInterval(id);
+  }, [secondsLeft]);
 
   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);
+    const m = String(Math.floor(totalSeconds / 60)).padStart(2, '0');
+    const s = String(totalSeconds % 60).padStart(2, '0');
+    return toLocaleDigits(`${m}:${s}`, i18n.language);
   };
 
   return <span>{formatTime(secondsLeft)}</span>;