useProductContext
The canonical product id the host derives your accounts and permissions from
useProductContext returns the product context the host bound this runtime
to (System.get_product_context): data.productId is the full canonical
dotNS identifier including its network TLD, such as my-app.dot,
my-app.paseo, or localhost:3000 under a local development host. This is
the exact string the host uses for authorization and product-account
derivation, so use it wherever an API needs a dotNsIdentifier or a
ProductProofContext instead of hard-coding a suffix or inspecting the URL.
The runtime already uses it: when productAccount.dotNsIdentifier is not set
in the config, connect() derives the product account from the host's
product context and only falls back to <dappName>.dot on hosts that predate
the method. data is null standalone and on those legacy hosts.
Usage
import { useProductContext, useRingVrfKeys } from "@use-truapi/react";
function ProofContext() {
const { data: context } = useProductContext();
const keys = useRingVrfKeys(context?.productId);
const proofContext = context
? { productId: context.productId, suffix: { tag: "Index" as const, value: 0 } }
: undefined;
// pass proofContext to useAccountAlias / useCreateAccountProof
return <span>{context?.productId ?? "standalone"} · {keys.data?.length ?? 0} keys</span>;
}<script setup lang="ts">
import { useProductContext } from "@use-truapi/vue";
import { computed } from "vue";
const { data: context } = useProductContext();
const proofContext = computed(() =>
context.value
? { productId: context.value.productId, suffix: { tag: "Index" as const, value: 0 } }
: undefined,
);
</script>
<template>
<span>{{ context?.productId ?? "standalone" }}</span>
</template>See also
useAccountAliasanduseCreateAccountProoftake aProductProofContextbuilt from this id.- Provider & runtime explains the
productAccountconfig the runtime derives from it.
API reference
React
function useProductContext(options?): UseQueryResult<ProductContext | null, Error>;The canonical product id the host bound this app to; null standalone or on legacy hosts.
Parameters
| Parameter | Type |
|---|---|
options? | { query?: QueryOptions<ProductContext | null>; } |
options.query? | QueryOptions<ProductContext | null> |
Returns
UseQueryResult<ProductContext | null, Error>
Vue
function useProductContext(options?): QueryResult<ProductContext | null>;The canonical product id the host bound this app to; null standalone or on legacy hosts.
Parameters
| Parameter | Type |
|---|---|
options? | { query?: QueryOptions<ProductContext | null>; } |
options.query? | QueryOptions<ProductContext | null> |
Returns
QueryResult<ProductContext | null>