useQuery is not retrying

[matepaiva]

I am probably doing something wrong, but I can't figure what.

I want to refetch the data everytime my user log in or log out. So I have a hook that tells me if the user is logged in:

  const isLoggedUser = useIsLoggedUser();

What I thought I could do is to useEffect to retry the query when isLoggedUser changes:

  useEffect(() => {
    retry();
  }, [isLoggedUser, retry]);

That didn't help. The network tab is not showing any new requests.

So I thought another possible way would add a fetchKey:

const { data, retry } = useQuery(
    query,
    { subscriptionId },
    {
      skip: !subscriptionId,
      fetchKey: Number(isLoggedUser), // 0 if not logged, 1 if logged
      fetchPolicy: 'network-only', // tried adding this to force the re-fetch, but made no difference
      onComplete: console.log // prints null from file QueryFetcher.js?d24e:136
    }
);

But that didn't re-fetch either ─ I looked into the network tab.

I logged my data on my component:

console.log({ viewer: data.viewer, isLoggedUser: Number(isLoggedUser) });

/*** Results when start logged out and then log in: ***/
// index.js?3a66:94 {viewer: null, isLoggedUser: 0}
// QueryFetcher.js?d24e:136 null
// index.js?3a66:94 {viewer: null, isLoggedUser: 1}

/*** Results when start logged in and then log out: ***/
// index.js?3a66:97 {viewer: {…}, isLoggedUser: 1}
// QueryFetcher.js?d24e:136 null
// index.js?3a66:97 {viewer: {…}, isLoggedUser: 0}

So, the first load happens ok, but even if I try to retry it never happens again. I didn't find any information that could help me in the documentation. Do you have any clue about what I am doing wrongly?

Dependencies:

"dependencies": {
    "next": "canary",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-relay": "^11.0.2",
    "react-relay-network-modern": "^6.0.0",
    "react-relay-network-modern-ssr": "^1.4.0",
    "relay-hooks": "^4.2",
    "relay-runtime": "^11.0.2"
},

Thank you!

[matepaiva]

I converted it to a refetchable fragment and now it works.

So, to close this subject: what I understand is that useQuery(query, vars, config).retry() should not be used, as the response could be a cached one.

What I also understand is that we should use useRefetchable(frag, prop).refresh() when we want a cache-free response.

Thank you