I am using the useAsync hook, as described in https://usehooks.com/useAsync/ The existing code works well, something like this:

const useAsync = (asyncFunction, immediate = true) => {
    const execute = useCallback(() => {
      return asyncFunction()
        .then((response) => {
          console.log('SUCCESS', resposne)
        })
    }, [asyncFunction]);

    return { execute};
}

const Component = () => {
    const getFile = async () => {
        const payload = { fileId };
        return getFileInfo(payload);
    };

    const { execute  } = useAsync(getFile, false);
    useEffect(() => {execute()}, []);
}

But, I need to modify useAsync such that it adds a Token as an additional parameter to the asyncFunction it is given. Something like:

const useAsync = (asyncFunction, immediate = true) => {
    const execute = useCallback(() => {

        // GET THE TOKEN
        getAccessToken().then((token) => { 
            return asyncFunction()  // ADD token AS A PARAM HERE SOMEHOW?
              .then((response) => {
                console.log('SUCCESS', resposne)
              })
        }

    }, [asyncFunction]);

    return { execute};
}

I suspect that I might need to bind() (MDN-Bind) the token to the given asyncFunction as an extra parameter but I can't make it work. Any suggestions?