How do I create a react hook that sets up async listener?

How can I create a hook that needs to setup a async event listener. Essentially I'm using a library with a listen function that returns a promise to an function to unlisten to the event.

so I'm trying to setup a useEvent hook that takes eventName and callback to be called when the event happens.

what I want is something like this:

const useEvent = (eventName, callback) => {    useEffect(() => {      const unlisten = await listen(eventName, callback);      return unlisten    }  }  

but I cant easily wrap the await in an inner async function because I need the return value.

what do I do?

https://stackoverflow.com/questions/66996194/how-do-i-create-a-react-hook-that-sets-up-async-listener April 08, 2021 at 09:31AM