useTypedApi
The descriptor-typed PAPI api for a configured chain
useTypedApi returns the PAPI typed api of a configured chain: the object
behind api.query, api.tx, api.constants, api.event and api.apis,
typed by the chain's descriptor. The underlying client connection is created
once and shared with every other chain hook.
Most of the time you don't need it directly: the build, read and select
callbacks of useTx,
useChainQuery and
useChainSubscription already hand you
the typed api. Reach for useTypedApi when you need the api object itself:
imperative calls from event handlers, passing it to helpers, runtime-api
calls that don't fit a declarative hook.
The result is typed per chain: useTypedApi({ chain: "people" }) autocompletes
that chain's pallets and calls.
Usage
import { useTypedApi } from "@use-truapi/react";
function DepositCheck() {
const { data: api, isPending, error } = useTypedApi();
async function logDeposit() {
if (!api) return;
const existentialDeposit = await api.constants.Balances.ExistentialDeposit();
console.log("existential deposit:", existentialDeposit);
}
if (isPending) return <p>Connecting…</p>;
if (error) return <p>Failed to connect: {error.message}</p>;
return (
<button type="button" onClick={logDeposit}>
Check existential deposit
</button>
);
}<script setup lang="ts">
import { useTypedApi } from "@use-truapi/vue";
const { data: api, isPending, error } = useTypedApi();
async function logDeposit() {
if (!api.value) return;
const existentialDeposit = await api.value.constants.Balances.ExistentialDeposit();
console.log("existential deposit:", existentialDeposit);
}
</script>
<template>
<p v-if="isPending">Connecting…</p>
<p v-else-if="error">Failed to connect: {{ error.message }}</p>
<button v-else type="button" @click="logDeposit">
Check existential deposit
</button>
</template>For values you want to render, wrap the read in
useChainQuery instead of awaiting the api
yourself; you get caching, enabled gating and error states for free:
const deposit = useChainQuery(
(api) => api.constants.Balances.ExistentialDeposit(),
[],
);See also
useChainQueryruns declarative one-shot reads against this api.useChainSubscriptionsubscribes to api observables.useChainClientis the raw client underneath.
API reference
React
function useTypedApi<K>(options?): UseQueryResult<TypedApiOf<AnyChains, K>, Error>;The descriptor-typed PAPI api for a configured chain.
Type Parameters
| Type Parameter |
|---|
K extends string |
Parameters
| Parameter | Type |
|---|---|
options? | ChainScope<K> & object |
Returns
UseQueryResult<TypedApiOf<AnyChains, K>, Error>
Vue
function useTypedApi<K>(options?): QueryResult<TypedApiOf<AnyChains, K>>;The descriptor-typed PAPI api for a configured chain.
Type Parameters
| Type Parameter |
|---|
K extends string |
Parameters
| Parameter | Type |
|---|---|
options? | ChainScope<K> & object |
Returns
QueryResult<TypedApiOf<AnyChains, K>>