import { useEffect } from "react";

export const isIPhone = () => {
  const isIphoneCache = /iPhone/i.test(navigator.userAgent || navigator.vendor);
  return isIphoneCache;
};
// temporary fix for iPhone input focus issue
// https://github.com/TelegramMessenger/Telegram-iOS/issues/1410
export default function useIphoneFocusFix(keepScrolling: boolean) {
  useEffect(() => {
    if (!isIPhone()) {
      return () => {};
    }
    document.documentElement.classList.remove("global-focus-safe");
    // console.log('temporary fix for iPhone input focus issue')
    let oldFocus = false;
    const fn = () => {
      const activeElement = document.activeElement;
      const isFocus = activeElement?.nodeName === "INPUT";

      if (isFocus !== oldFocus) {
        oldFocus = isFocus;
        if (isFocus) {
          document.documentElement.classList.add("global-focus");
        } else {
          document.documentElement.classList.remove("global-focus");
        }
      }

      if (window.scrollY !== 0 && !isFocus) {
        window.scrollTo({ top: 0, left: 0, behavior: "auto" });
      }
    };
    if (keepScrolling) {
      console.log("keep scrolling");
      const timeout = setInterval(fn, 100);

      return () => {
        console.log("stop scrolling");
        clearInterval(timeout);
      };
    } else return () => {};
  }, [keepScrolling]);
}