Why $query sends a request to server on component mount?

[mohesem]

I am trying to write a login form.

import { gql } from '@apollo/client';
const LOGIN_ADMIN = gql`
  query LoginAdmin(<STH>) {
    loginAdmin(<STH>) {
      <STH>
    }
  }
`;
const login = query(LOGIN_ADMIN, options);
const onSubmit = () => { 
   login.refetch(<STH>)
}

Until here everything is fine, and refetch query works totally as expected,

$: if ($login) {
   console.log($login.error, $login.loading, $login.data)
}

the problem is $login sends a query to the server when the component is mounting.

Am I missing something or this behavior is normal?

[MrDweebus]

I think this is why we'd need lazy queries; dev said in this comment that they'd investigate in the future, but I agree that missing the lazy queries makes you have to code in circles to keep from sending lots of random queries from things like search forms.

#53 (comment)