Best way to query "sub-queries"

I'm attempting to query more data for each item in the "parent" query and have something like this:

const { data, status } = useQuery(['foobars', id], async () => {
  const foobars = await foobars.query({ id })

  await Promise.all(
    foobars.map(async foobar => {
      // eslint-disable-next-line require-atomic-updates
      foobar.messages = await foobarMessages.query({ id: foobar.id })
    })
  )

  return { foobars }
})

const { data, status } = useQuery(['foobars', id], async () => {
  const foobars = await foobars.query({ id })

  await Promise.all(
    foobars.map(async foobar => {
      // eslint-disable-next-line require-atomic-updates
      foobar.messages = await foobarMessages.query({ id: foobar.id })
    })
  )

  return { foobars }
})

My question is, is there a better way to do this? Perhaps with

useQuery

useQuery

and

useQueries

useQueries

? While what I have works it feels like I might be misusing react-query, not to mention eslint complains of atomic updates.

TanStack•3y ago•

22 replies

sad-indigo

Best way to query "sub-queries"

I'm attempting to query more data for each item in the "parent" query and have something like this:

const { data, status } = useQuery(['foobars', id], async () => {
  const foobars = await foobars.query({ id })

  await Promise.all(
    foobars.map(async foobar => {
      // eslint-disable-next-line require-atomic-updates
      foobar.messages = await foobarMessages.query({ id: foobar.id })
    })
  )

  return { foobars }
})

const { data, status } = useQuery(['foobars', id], async () => {
  const foobars = await foobars.query({ id })

  await Promise.all(
    foobars.map(async foobar => {
      // eslint-disable-next-line require-atomic-updates
      foobar.messages = await foobarMessages.query({ id: foobar.id })
    })
  )

  return { foobars }
})

My question is, is there a better way to do this? Perhaps with

useQuery

useQuery

and

useQueries

useQueries

? While what I have works it feels like I might be misusing react-query, not to mention eslint complains of atomic updates.

Best way to query "sub-queries"

Similar Threads

Best way to query "sub-queries"

Similar Threads

Similar Threads

Similar Threads