skipToken is passed into my infiniteQuery as a queryArg

[soggybeef]

Language: Typescript
Version: "@reduxjs/toolkit": "^2.3.0",

I was trying to conditionally run an infinite query to prevent the first request from being made upon mounting of the component. The args will be taken from router which is from next/router

I have the args for queryArg as shouldSkip ? skipToken : args. But when shouldSkip === true and skipToken is passed in, the first request is still being made, and this is what i got from my console logs when forming the query in the services page where the endpoint is defined:

Since the logic of forming my queryParams doesn't and shouldn't take into account the skipToken, the request is still being sent in to fetch data that i don't want to fetch. This data is returned, but not returned or populated to my parent component. But I see it under the Responses in my Network Requests.

Would love any tips and corrections on how I can better handle the skipToken in my infiniteQuery, thank you!

EDIT: I see similar behavior when using skip: shouldSkip as part of the second argument in my useInfiniteQuery; the original args that I had became the queryArgs and the request is sent and returned, but not poulated.

[soggybeef]

Oddly, both issues I brought up seem to resolve themselves if I moved the infiniteQuery further down the file for the component.... The skipToken skips the query entirely, same for skip: shouldSkip when shouldSkip === true

[lucasfelixc]

Hi @soggybeef, can you provide a code example that mainly shows the shouldSkip condition? Considering your problem description, it seems that when you try to execute shouldSkip ? skipToken : args, this condition may be false at some time interval. One thing you can do is change the logic to something like this: args || skipToken (I don't know exactly what your args is, but I think it's a value that changes based on next/router). This way, you ensure that even though args is not a true value, skipToken will be passed.