useQuery()
A suspensful hook to run a GraphQL query
Not to be confused with the popular TanStack
useQuery()
of
Apollo
useQuery()
hooks; this hook is custom to the Attio runtime for running GraphQL queries against the Attio
GraphQL Schema.
While the query is running, the component that uses this hook will “suspend”.
You MUST wrap the component in a
<React.Suspense/>
component
and give it a fallback
component to render until the query has completed.
If you use more than one useQuery()
hook in a component, they will be executed in sequence,
not parallel! Sometimes this is desired, but sometimes you might want to
run them in parallel.
Parameters
query : string
A GraphQL query string.
If you’re using TypeScript and [default] import
this value from a .graphql
or .gql
file,
the variables and return value with be strongly typed.
variables? : Record<string, any>
The named variables your query accepts. If your query has no variables, you needn’t pass any.
Returns
Record<string, any>
The structured JSON as defined by your query.
Running in parallel
If you need to run multiple GraphQL queries in parallel, this can be accomplished with a combination
of runQuery()
and useAsyncCache()
like so: