if user type existing email in the text field, button should be disabled in react js

import React, {
  useState
} from "react";
export default function DropDown() {
  const [mail, useEmail] = useState("");
  const [disabled, useDisabled] = useState(false)
  const handleChange = (e) => {
    useEmail(e.target.value)
  }
  if (mail.includes('s@gmail.com')) {

    React.useEffect(() => {
      setInterval(() => {
        useDisabled(true);
      }, 2000);
    })
  } else {
    useDisabled(false)
  }
  return (
    <>
      <input 
        value={ mail }
        onChange={ handleChange }
        maxLength="20" 
      />
      <button 
        disabled={ mail.length < 1 }
      > Submit </button>
    </>
  );
}

but at the time it throws error like "Too many re-renders. React limits the number of renders to prevent an infinite loop." how to resolve that error?

>Solution :

TL.DR:

import React, { useState } from "react";
export default function DropDown() {
    const [mail, setEmail] = useState("");

    const handleChange = (e) => {
        setEmail(e.target.value);
    };

    return (
        <>
            <input value={mail} onChange={handleChange} maxLength={20} />
            <button disabled={mail.includes("s@gmail.com") || mail.length < 1}> Submit </button>
        </>
    );
}

Let’s break it down:

1. Hooks (useState, useEffect, etc) cannot be conditionally rendered, so you cannot write them inside if else statements.
2. const [mail, setMail] = useState(""). The second attribute should be setSomething, not useSomething. The useSomething should be reserved to the declarations of new hooks. The setMail returned by the useState is not a hook, but a normal function (the useState itself is the hook).
3. setState (or setDisabled, in your example) should never be used directly inside the render of a component. A setState causes the component to re-render so, if when re-rendering a setState is encountered, it will trigger another re-render, that will trigger another setState, and so on (leading to the ""Too many re-renders." you had). Generally speaking, setState should only be used on event handlers (such as onClick, onKeyDown, onSomethingElseHapped, etc)

There are a few more minor issues with your code. I encourage you to go through the basics of react one more time.