dmail-front/src/hooks/useNumberFont.ts

import { useEffect } from "react";

const useDetectLatinAndNumbers = () => {
  useEffect(() => {
    // تابعی برای اضافه کردن کلاس‌ها
    const addClassIfContainsLatinOrNumbers = (element: HTMLElement) => {
      element.childNodes.forEach((node) => {
        if (node.nodeType === Node.TEXT_NODE) {
          const textContent = node.nodeValue;
          if (textContent) {
            if (/\d/.test(textContent)) {
              element.classList.add("has-number");
            }
            if (/[a-zA-Z]/.test(textContent)) {
              element.classList.add("has-latin");
            }
          }
        } else if (node.nodeType === Node.ELEMENT_NODE) {
          const el = node as HTMLElement;

          // بررسی `input` و `textarea`
          if (
            el instanceof HTMLInputElement ||
            el instanceof HTMLTextAreaElement
          ) {
            const checkAndApplyClasses = () => {
              // با استفاده از requestAnimationFrame برای جلوگیری از به‌هم‌ریختگی در سافاری
              requestAnimationFrame(() => {
                if (/\d/.test(el.value)) {
                  el.classList.add("has-number");
                } else {
                  el.classList.remove("has-number");
                }

                if (/[a-zA-Z]/.test(el.value)) {
                  el.classList.add("has-latin");
                } else {
                  el.classList.remove("has-latin");
                }
              });
            };

            // مقدار اولیه را بررسی کنیم
            checkAndApplyClasses();

            // هر تغییری را بررسی کنیم
            el.addEventListener("input", checkAndApplyClasses);
          }

          // باز هم اضافه کردن کلاس به سایر عناصر
          addClassIfContainsLatinOrNumbers(el);
        }
      });
    };

    // استفاده از MutationObserver برای نظارت بر تغییرات DOM
    const observer = new MutationObserver((mutationsList) => {
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
      mutationsList.forEach((mutation: any) => {
        // تایپ دقیق‌تر برای جلوگیری از خطا در تایپ‌اسکریپت
        if (
          mutation.type === "childList" ||
          mutation.type === "subtree" ||
          mutation.type === "attributes"
        ) {
          addClassIfContainsLatinOrNumbers(mutation.target as HTMLElement);
        }
      });
    });

    // شروع به نظارت بر تمام تغییرات در بدنه صفحه
    observer.observe(document.body, { childList: true, subtree: true });

    // در نهایت، پاکسازی اثرات هنگام خروج از کامپوننت
    return () => {
      observer.disconnect();
    };
  }, []);
};

export default useDetectLatinAndNumbers;