dependent react hooks

how do I wait for the sessionData to resolve before using the useUserPlaylists hook

const { data: sessionData } = useSession();
  const { isLoading, serverError, playlists } = useUserPlaylists(
    sessionData?.user.token
  );

const { data: sessionData } = useSession();
  const { isLoading, serverError, playlists } = useUserPlaylists(
    sessionData?.user.token
  );

2 Replies

jingleberry•2y ago

A few options depending on the underlying implementation of your custom hook. 1. Set a flag “isEnabled” and set it to true when the session exists. This should control whether the custom hook returns data or not 2. Alternatively separate the hooks into different components. When the session is null return a fallback. When it exists then render the user playlists component which calls your hook 3. Use suspense. A bit more advanced but you should suspend the component of the session is still loading. Then when it does exist you will always be guaranteed to have the session data to call the custom hook

thatloudmango•2y ago

Thank you, I went with the second approach and it works well!

Gaming

Programming

dependent react hooks