useHNS()

Use it to retrieve your HNS domain names info.

When a connector is passed to <HWBridgeProvider>, it can take a hnsResolver property as its own config.

TIP

The HashpackConnector comes with a built-in HNS Resolver based on hashpack user profiles, which means it will not require to pass a hnsResolver config for it.

But, the same HNS Resolver can be used for the rest of the connectors.

import { HWBridgeProvider } from "@buidlerlabs/hashgraph-react-wallets";
import {
  HashpackConnector,
  KabilaConnector
} from "@buidlerlabs/hashgraph-react-wallets/connectors";
import { HashpackHNSResolver } from "@buidlerlabs/hashgraph-react-wallets/hns-resolvers"; 

return (
  <HWBridgeProvider
    ...
    connectors={[
      HashpackConnector,
      [KabilaConnector, { hnsResolver: HashpackHNSResolver }] 
    ]}
  />
)

Usage

When parameter multiSession={false}:

import { useHNS } from '@buidlerlabs/hashgraph-react-wallets'

const App = () => {
  const { data: hnsData } = useHNS()

  return <span>{hnsData?.hnsName ?? '-'}</span>
}

Parameters

interface IUseHNSProps<Connector> {
  connector?: Connector | null
  autoFetch?: boolean
}

- connector

• Type: HWBridgeConnector
• Required: false

Request the HNS data for a specific wallet when multiSession={true}

import { HashpackConnector } from '@buidlerlabs/hashgraph-react-wallets/connectors'
import { useHNS } from '@buidlerlabs/hashgraph-react-wallets'

const App = () => {
  const { data: hnsData } = useHNS({ connector: HashpackConnector }) 

  return <span>{hnsData.hnsName ?? '-'}</span>
}

---

- autoFetch

• Type: boolean
• Required: false

import { useWallet, useHNS } from '@buidlerlabs/hashgraph-react-wallets'

const App = () => {
  const { isConnected } = useWallet() 
  const { data: hnsData } = useHNS({ autoFetch: isConnected }) 

  return <span>{hnsData.hnsName ?? '-'}</span>
}

Return Type

type HNSResult = {
  hnsName: string
  avatar: string
  tokenId: string
  serial: number
}