Dependent SWR hooks & Dependency Collection

[tjelvar-chromaway]

TL;DR is a way for a custom hook that depends two SWR calls and have the last one take into account the response form the first one (except data and mutate) without breaking dependency collection features, deduplication or caching?

Consider this fictional scenario: I have a hook called useGetBook() however to get the book i need to call a async function getBooks on an author so i have to pass an authorId and a bookId.

const useGetBook(authorId: string, bookId:string) = () => {
  const author = useGetAuthor(authorId) // Another SWR call returning an object containing an async function `getBook`

  const fetcher = async () => {
    return  author.data?.getBook(bookId)
  }
  const book = useSWRImmutable(authorId + bookId, fetcher) // Now this does not take into account `author.isLoading` 
  
  return book
}

In the code example above i could read the isLoading from author and then return a newly constructed object that returns isLoading: author.isLoading || book.isLoading but then i would forcefully cause a re-render by accessing author.isLoading. Another way i could see doing this is to move the async operations of useGetAuthor into fetcher but then i loose caching and deduplication.