feat(ens): add redux hooks

src/hooks/useSearchAddressBook.ts

@@ -3,16 +3,22 @@ import {ethers} from "ethers";
 import {networks} from "../redux/networks";
 import {useAppSelector} from "../redux/hooks";
 import {addressBookSelectors} from "../redux/slices/addressBook.slice";
+import {ensApi} from "../redux/slices/ensResolver.slice";
 
 export const useSearchAddressBook = (searchTerm: string) => {
   const isSearchTermAddress = useMemo(
     () => ethers.utils.isAddress(searchTerm),
     [searchTerm]
   );
 
+
+  const ensQuery = ensApi.useResolveNameQuery(
+    searchTerm
+  )
+
   return networks.map((network) => {
     const addressBookEntries = useAppSelector((state) =>
-      searchTerm !== "" && !isSearchTermAddress
+      searchTerm !== "" && !isSearchTermAddress && !ensQuery
         ? addressBookSelectors
           .selectAll(state)
           .filter((x) => x.chainId === network.chainId)

src/hooks/useSearchSubgraphByAddress.ts

@@ -2,6 +2,7 @@ import {useMemo} from "react";
 import {ethers} from "ethers";
 import {networks} from "../redux/networks";
 import {sfSubgraph} from "../redux/store";
+import {ensApi} from "../redux/slices/ensResolver.slice";
 import {skipToken} from "@reduxjs/toolkit/query";
 import {gql} from "graphql-request";
 
@@ -51,6 +52,10 @@ export const useSearchSubgraphByAddress = (searchTerm: string) => {
     [searchTerm]
   );
 
+  const ensQuery = ensApi.useResolveNameQuery(
+    searchTerm ? searchTerm : skipToken
+  )
+
   return networks.map((network) =>
     sfSubgraph.useCustomQuery(
       isSearchTermAddress
@@ -62,7 +67,15 @@ export const useSearchSubgraphByAddress = (searchTerm: string) => {
             addressBytes: searchTerm.toLowerCase(),
           },
         }
-        : skipToken
+        // : skipToken
+        : {
+          chainId: network.chainId,
+          document: searchByAddressDocument,
+          variables: {
+            addressId: ensQuery,
+            addressBytes: ensQuery
+          },
+        }
     )
   );
 };

src/pages/[_network]/supertokens/[_id].tsx

@@ -1,5 +1,5 @@
 import { useContext, useEffect, useState } from "react";
-import { sfSubgraph } from "../../../redux/store";
+import { sfSubgraph} from "../../../redux/store";
 import OpenInNewIcon from "@mui/icons-material/OpenInNew";
 import { TabContext, TabList, TabPanel } from "@mui/lab";
 import {

src/redux/slices/ensResolver.slice.ts

@@ -1,7 +1,6 @@
 import urlcat from 'urlcat'
-import { fakeBaseQuery } from "@reduxjs/toolkit/dist/query";
-import { createApi } from "@reduxjs/toolkit/dist/query/react";
 import { ethers } from "ethers";
+import { createApi, fetchBaseQuery, fakeBaseQuery } from "@reduxjs/toolkit/query/react";
 
 export interface NameInfo {
   rnsName: string
@@ -98,4 +97,3 @@ export const ensApi = createApi({
     };
   },
 });
-

src/redux/store.ts

@@ -57,18 +57,18 @@ export const makeStore = wrapMakeStore(() => {
     addressBookSlice.reducer
   );
 
-  // const ensReducer = persistReducer(
-  //   { key: "ens-address", version: 1, storage: storageLocal },
-  //   ensResolverSlice.reducer
-  // )
+  const ensReducer = persistReducer(
+    { key: "ens-lockup", version: 1, storage: storageLocal },
+    ensApi.reducer
+  )
 
   const store = configureStore({
     reducer: {
       [rpcApi.reducerPath]: rpcApi.reducer,
       [sfSubgraph.reducerPath]: sfSubgraph.reducer,
       [themePreferenceSlice.name]: themePreferenceSlice.reducer,
       [addressBookSlice.name]: addressBookReducer,
-      [ensApi.reducerPath]: ensApi.reducer,
+      [ensApi.reducerPath]: ensReducer,
     },
     middleware: (getDefaultMiddleware) =>
       getDefaultMiddleware({
@@ -84,6 +84,7 @@ export const makeStore = wrapMakeStore(() => {
           ], // Ignore redux-persist actions: https://stackoverflow.com/a/62610422
         },
       })
+
         .prepend(
           nextReduxCookieMiddleware({
             compress: true,
@@ -92,7 +93,8 @@ export const makeStore = wrapMakeStore(() => {
           })
         )
         .concat(rpcApi.middleware)
-        .concat(sfSubgraph.middleware),
+        .concat(sfSubgraph.middleware)
+        .concat(ensApi.middleware),
   });
 
   if (!isServer()) {