How do I delay inital load until a parameter is given?

[Hultner]

Background

I currently have a project where I've written data fetching hooks, these work great for simple use-cases, however right now we're about to do some major rework on the API-backend side, and before expanding my hook I'm evaluating swr. One frequent pattern I have is that I want to wait and do the initial load until my context receives a callback containing a parameter used for data-fetching.

Problem

In my use-case, I sometimes want to do the following:

1. Mount swr in context
2. Use context hook in sub-components to gain access to callbacks
3. Call the callback function with an initial parameter
4. Receive do first backend request

However, swr doesn't fetch any data when changing the arguments or/and calling mutate if I use either option of initialData: [] or revalidateOnMount: false.

In my data-hook, I have an option called initialLoad which I can set to false to get the desired behaviour but, I can't seem to reproduce this behaviour using SWR.

I'm much grateful for any help I can get in regards to this matter.

[Hultner]

I've done the following after discussing this with a friend.

I've wrapped the useSWR hook with a hook similar to my previous one with an initialLoad parameter. I set the key/URL either to null or to the desired value based on this property.

It looks roughly like this. A bit simplified for brevity.

useData({..., initialLoad = true}){
  const [load, setLoad] = useState(initialLoad)
  const { data, mutate } = useSWR(
    load ? endpoint+args: null,
    fetcher,
  )

  const wrappedMutate = (...args) => {
    if (!load) setLoad(true)
    return mutate(...args)
  }
  return { data, mutate: wrappedMutate }
}

Is this approach the most reasonable way to go about this?