Conditional fetching

[cdedreuille]

How do you handle conditional fetching?
In my case, I'm using Nextjs and with Next router queries are asynchronous so you first get null when you use something like router.query.id

I'm using this for now but it first makes a query that results in a 404. It works but I guess it's not the most efficient as it creates 2 queries.

const [{ data: vendor, error }] = useSelect('vendors', {
    filter: useFilter((query) => query.eq('id', router.query.id).single(), [router.query])
  });

[tmm]

Would adding a pause option work for your case? When pause is true, requests are frozen and the result does not change.

const filter = useFilter(
  (query) => query.eq('id', router.query.id).single(),
  [router.query],
)
const [{ data: vendor, error }] = useSelect('vendors', {
  filter,
  pause: router.query.id === null
});

If so, this should be a quick feature to add. You are also welcome to open a PR with this change too.

[cdedreuille]

I was actually working on a similar hook and this is indeed how I worked it out. I called it wait but pause works too. 🙂