Introduce useEnsResolverInterfaces, abstract fallbackQuery, and Param…

…WithClients

packages/react/src/client.ts

@@ -0,0 +1,7 @@
+import type { ClientWithEns } from '@ensdomains/ensjs/contracts'
+import type { QueryClient } from '@tanstack/react-query'
+
+export type ParamWithClients<T> = T & {
+  client: ClientWithEns
+  queryClient?: QueryClient
+}

packages/react/src/hooks.ts

@@ -1,2 +1,3 @@
 export { useNamesForAddress } from './hooks/useNamesForAddress.js'
 export { useEnsAvailable } from './hooks/useEnsAvailable.js'
+export { useEnsResolverInterfaces } from './hooks/useEnsResolverInterfaces.js'

packages/react/src/hooks/useEnsAvailable.ts

@@ -1,19 +1,11 @@
-import {
-  QueryClient,
-  useQuery,
-  type UseQueryResult,
-} from '@tanstack/react-query'
-import type { ClientWithEns } from '@ensdomains/ensjs/contracts'
+import { useQuery, type UseQueryResult } from '@tanstack/react-query'
 import { getAvailable } from '@ensdomains/ensjs/public'
+import type { ParamWithClients } from '../client.js'
+import { fallbackQueryClient } from '../query.js'
 
-export type UseEnsAvailableParams = {
+export type UseEnsAvailableParams = ParamWithClients<{
   name: string
-  client: ClientWithEns
-  queryClient?: QueryClient
-}
-
-// TODO: figure out why not taking from provider
-const fallbackQueryClient = new QueryClient()
+}>
 
 /**
  * Returns a list of names for an address

packages/react/src/hooks/useEnsResolverInterfaces.ts

@@ -0,0 +1,52 @@
+import { useQuery, type UseQueryResult } from '@tanstack/react-query'
+import type { Address, Hex } from 'viem'
+import { getSupportedInterfaces } from '@ensdomains/ensjs/public'
+import type { ParamWithClients } from '../client.js'
+import { fallbackQueryClient } from '../query.js'
+
+export type UseEnsResolverInterfacesParams<
+  Interfaces extends readonly Hex[] = [Hex, Hex],
+> = ParamWithClients<{
+  resolver: Address
+  interfaces?: Interfaces
+}>
+
+export type UseEnsResolverInterfacesReturnType<
+  Interfaces extends readonly Hex[],
+> = {
+  [K in keyof Interfaces]: boolean
+}
+
+/**
+ * Returns a wether or not the interfaces are supported by the resolver
+ * You can find a list of interfaces at https://docs.ens.domains/resolvers/interfaces
+ *
+ * @param data - {@link UseEnsResolverInterfacesParams}
+ * @returns - {@link boolean[]}
+ */
+export const useEnsResolverInterfaces = <Interfaces extends readonly Hex[]>(
+  data: UseEnsResolverInterfacesParams<Interfaces>,
+): UseQueryResult<UseEnsResolverInterfacesReturnType<Interfaces>> => {
+  const {
+    resolver,
+    // default ['addr(node, coinType)', 'wildcard']
+    interfaces = ['0xf1cb7e06', '0x9061b923'],
+    client,
+    queryClient = fallbackQueryClient,
+  } = data
+
+  return useQuery(
+    {
+      queryKey: ['ensjs', 'resolver-interfaces', resolver],
+      queryFn: async () => {
+        const result = await getSupportedInterfaces(client, {
+          address: resolver,
+          interfaces,
+        })
+
+        return result
+      },
+    },
+    queryClient,
+  )
+}

packages/react/src/hooks/useNamesForAddress.ts

@@ -1,23 +1,15 @@
-import {
-  QueryClient,
-  useQuery,
-  type UseQueryResult,
-} from '@tanstack/react-query'
+import { useQuery, type UseQueryResult } from '@tanstack/react-query'
 import type { Address } from 'viem'
 import {
   getNamesForAddress,
   type GetNamesForAddressReturnType,
 } from '@ensdomains/ensjs/subgraph'
-import type { ClientWithEns } from '@ensdomains/ensjs/contracts'
+import { fallbackQueryClient } from '../query.js'
+import type { ParamWithClients } from '../client.js'
 
-export type UseNamesParams = {
+export type UseNamesParams = ParamWithClients<{
   address: Address
-  client: ClientWithEns
-  queryClient?: QueryClient
-}
-
-// TODO: figure out why not taking from provider
-const fallbackQueryClient = new QueryClient()
+}>
 
 /**
  * Returns a list of names for an address

packages/react/src/query.ts

@@ -0,0 +1,4 @@
+import { QueryClient } from '@tanstack/react-query'
+
+// TODO: figure out why not taking from provider
+export const fallbackQueryClient = new QueryClient()