# useEnsSubnames

A React hook for fetching ENS subnames with infinite scroll pagination support.

***

## Usage

```typescript
import { useEnsSubnames } from '@justaname.id/react'

function EnsSubnamesComponent() {
  const {
    data,
    isLoading,
    error,
    fetchNextPage,
    hasNextPage,
    isFetchingNextPage
  } = useEnsSubnames({
    ensDomain: 'justaname.eth',
    isClaimed: true,
    chainId: 1,
    limit: 20
  })
  
  if (isLoading) return <div>Loading subnames...</div>
  if (error) return <div>Error: {error.message}</div>
  
  const allSubnames = data?.pages.flatMap(page => page.data) || []
  
  return (
    <div>
      <h3>Subnames for justaname.eth ({allSubnames.length})</h3>
      {allSubnames.map((subname, index) => (
        <div key={index}>
          <p>ENS: {subname.ens}</p>
          <p>Is JAN: {subname.isJAN ? 'Yes' : 'No'}</p>
        </div>
      ))}
      {hasNextPage && (
        <button 
          onClick={() => fetchNextPage()} 
          disabled={isFetchingNextPage}
        >
          {isFetchingNextPage ? 'Loading more...' : 'Load More'}
        </button>
      )}
    </div>
  )
}
```

***

## Returns

An infinite query result containing:

* `data`: Paginated data with pages array containing Records objects
  * `pageParams`: Array of page parameters for pagination
  * `pages`: Array of page results
    * `data`: Array of Records objects (subnames)
    * `pagination`: Pagination metadata object
      * `totalCount`: Total number of records
      * `page`: Current page number
      * `limit`: Number of items per page
      * `totalPages`: Total number of pages
      * `nextPage`: Next page number (null if no more pages)
      * `prevPage`: Previous page number (null if on first page)
* `isLoading`: Boolean indicating if initial data is being fetched
* `error`: Error object if the operation failed
* `fetchNextPage`: Function to load the next page of subnames
* `hasNextPage`: Boolean indicating if more pages are available
* `isFetchingNextPage`: Boolean indicating if next page is being fetched
* `refetch`: Function to manually refetch all data

## Parameters

Required parameters:

* `ensDomain`: The ENS domain to fetch subnames for (e.g., 'justaname.eth')
* `isClaimed`: Boolean indicating whether to fetch claimed or unclaimed subnames

Optional parameters:

* `chainId?`: The chain ID to use (optional, defaults to provider chain ID)
* `page?`: Starting page number (optional, defaults to 1)
* `limit?`: Number of items per page (optional, defaults to 20)
* `initialLimit?`: Initial limit for first page (optional)
* `enabled?`: Boolean to enable/disable the query (optional, defaults to true)

## Defined in

[packages/@justaname.id/react/src/lib/hooks/ens/useEnsSubnames.ts:32](https://github.com/JustaName-id/JustaName-sdk/blob/dc845c10af242e3ca87d95ef392516ac0bfa8b95/packages/@justaname.id/react/src/lib/hooks/ens/useEnsSubnames.ts#L32)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.justaname.id/sdk-reference/justaname-react-sdk/functions/useenssubnames.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
