// import { createSignal, onCleanup } from "solid-js";
import { onCleanup } from "solid-js";
import { removethething } from "./utils.tsx";

function getName(): string{
  return Math.random() < 0.2? "EHCO" : "ECHO"
}

function HoverComponent() {
  let timerId: number|null;

  // const [name, setname] = createSignal(true)

  // const startTimer = () => {
  //   timerId = setTimeout(() => {
  //     setname(!name())
  //   }, 3000);
  // };

  const clearTimer = () => {
    if (timerId) {
      clearTimeout(timerId);
      timerId = null;
    }
  };
  
  // const handleMouseEnter = () => {
  //   startTimer();
  // };

  onCleanup(() => {
    clearTimer();
  });

  return (
    <h1
      class="removethisinstantly"
      onMouseEnter={(e)=> {
        removethething()
        if (e.target.textContent !== "ECHO") {
          e.target.textContent = "ECHO"
        }
      }} 
      // onMouseLeave={clearTimer} 
    >
      {getName()}
    </h1>
  );
}

export default HoverComponent;