react query question

currently when fetching the current user im checking if the JWT has expired, and making a call to a route to refresh the JWT. I placed both of these in 1 query (which I think is bad practice), how can I split them up?
function useAuth() {
  return useQuery(
    ['user'],
    async () => {
      let expiresAt = localStorage.getItem('expires_at') || 0;
      let refreshToken = localStorage.getItem('refresh_token');
      if (new Date().getTime() > expiresAt) {
        const res = await axios.post(
          `${url}/api/auth/refresh`,
          {
            refreshToken: refreshToken,
          },
          {
            withCredentials: true,
          }
        );
        localStorage.setItem('refresh_token', res.data.refreshJwt);
        localStorage.setItem('expires_at', res.data.expiresAt);
      }
      const { data } = await axios.get(`${url}/api/auth/current`, {
        withCredentials: true,
      });
      return data.user.role;
    },
    {
      refetchOnReconnect: false,
      refetchOnWindowFocus: false,
      retry: 0,
    }
  );
}

I have tried multiple ways, but none of them seem like a good way of doing things, any help is appreciated thanks
Was this page helpful?