useReactorQuery

useReactorQuery is a React hook for fetching data from Internet Computer canisters using a Reactor instance. It is the raw version of useActorQuery that requires explicit reactor passing.

Import

import { useReactorQuery } from "@ic-reactor/react"

Usage

import { useReactorQuery } from "@ic-reactor/react"
import { backend } from "./reactor"

function UserProfile({ userId }: { userId: string }) {
  const { data, isPending, error } = useReactorQuery({
    reactor: backend, // 👈 Required
    functionName: "getUser",
    args: [userId],
  })

  if (isPending) return <div>Loading...</div>
  if (error) return <div>Error: {error.message}</div>

  return <div>{data?.name}</div>
}

Options

Required Options

Option	Type	Description
`reactor`	`Reactor<A, T>`	The Reactor instance to use
`functionName`	`string`	The canister method to call

Optional Options

Same as useActorQuery.

Return Value

Returns a TanStack Query result object, same as useActorQuery.

Examples

Basic Query

const { data } = useReactorQuery({
  reactor: backend,
  functionName: "greet",
  args: ["World"],
})

Type-Safe Queries

TypeScript infers types from the passed reactor instance:

const { data } = useReactorQuery({
  reactor: backend,
  functionName: "getUser", // ✅ Autocompletes valid methods
  args: ["user-123"], // ✅ Type-checked
})