I'm performing a firebase login using email and password taken from useState hook. Whenever I login, I get this error:

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

Here is my code:

1. Login Hook

const login = async (email, password) => {
        setError(null)
        setLoading(true)
        const unsub = await signInWithEmailAndPassword(auth, email, password)
            .then(res => {
                dispatch({ type: "LOGIN", payload: res.user })
                console.log(res.user)
            }).catch(error => {
                console.log(error)
                setError(error.message)
            })
        
        setLoading(false)
        return () => unsub()
    }

    return { error, loading, login }

2. Login Component

export default function Login() {
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const {login, error, loading} = useLogin();

  const handleSubmit = (e) => {
    e.preventDefault();
    login(email,password)
  }

In console, it is showing error in Login component here: const [email, setEmail] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)("");