I'm building forgot functionality in my app using @apollo/client useLazyQuery hooks. for the first time when I click the button, it sends the email and calling the backend API, but as clicking the second time and so on.. it would just return the previous response made from the backend, mean not hitting the backend API.
export const Form: React.FC<Props> = ({ setStatus }) => {
const [getResetLink, { loading, data }] = useLazyQuery(FORGOT_PASSWORD)
console.log(data, loading, " => Query")
const onSubmit = (data: any) => {
const email = data[" "]
getResetLink({ variables: { email } })
}
return (
<form onSubmit={handleSubmit(onSubmit)}>
<Input
label=" "
placeholder="eg. alex@gmail.com"
register={register}
required={true}
/>
<Button btnType={true} type="primary" width="100%">
Submit
</Button>
</form>
)
}
don't worry about the form, I'm using react hook form. just need to fix the issue. let's suppose, a user forgot a password and he rests it with an email. unfortunately, he didn't receive an email for the first try. he would try again, but now he takes the previous response, wouldn't make another request to the backend. I'm pretty sure there is a problem with apollo useLazyQuery. how can we bypass the cache? basically, it returns data from the caches.
Thanks in advance for your valuable answers!