diff --git a/components/01-atoms/ENSAvatar.tsx b/components/01-atoms/ENSAvatar.tsx
index d600e832..16b4d7bb 100644
--- a/components/01-atoms/ENSAvatar.tsx
+++ b/components/01-atoms/ENSAvatar.tsx
@@ -1,4 +1,24 @@
+/**
+ * @deprecated This component is deprecated because the searched Ethereum addresses
+ * are not always returning the relative ENS primary names, which negatively impacts the user experience
+ * in the application.
+ *
+ * The `ENSAvatar` component is responsible for displaying an Ethereum Name Service (ENS)
+ * avatar based on the provided Ethereum address. It supports two sizes: small and medium.
+ *
+ * The component uses the `useEnsData` hook to fetch the avatar data. Depending on the
+ * status of the query, it either shows a loading indicator, an error icon, or the
+ * fetched avatar image.
+ *
+ * @component
+ * @param {EthereumAddress} avatarETHAddress - The Ethereum address to fetch the avatar for.
+ * @param {ENSAvatarSize} ENSAvatarSize - The size of the avatar to display. Defaults to ENSAvatarSize.MEDIUM
+ *
+ * @returns {JSX.Element} The rendered ENS avatar component.
+ */
 /* eslint-disable react-hooks/exhaustive-deps */
+
+/**
 import { LoadingIndicator, PersonIcon } from "@/components/01-atoms";
 import {
   ENSAvatarQueryStatus,
@@ -101,3 +121,5 @@ export const ENSAvatar = ({
     </div>
   );
 };
+
+ */
diff --git a/components/01-atoms/SearchBar.tsx b/components/01-atoms/SearchBar.tsx
index f842edff..789f0d98 100644
--- a/components/01-atoms/SearchBar.tsx
+++ b/components/01-atoms/SearchBar.tsx
@@ -5,23 +5,36 @@ import { ForWhom } from "../03-organisms";
 import { MagnifyingGlassIcon } from "@/components/01-atoms";
 import { EthereumAddress } from "@/lib/shared/types";
 import { ADDRESS_ZERO } from "@/lib/client/constants";
-import { normalizeENSName } from "@/lib/client/blockchain-utils";
 import { SwapContext } from "@/lib/client/contexts";
 import { useContext, useEffect } from "react";
-import { ENS } from "web3-eth-ens";
-import Web3 from "web3";
 import toast from "react-hot-toast";
 
+/**
+ * @deprecated
+ * The Ethereum address related ENS primary name getter function is
+ * under refactoring, thus, this feature is currently commented out.
+ *
+ * import { normalizeENSName } from "@/lib/client/blockchain-utils";
+ * import { ENS } from "web3-eth-ens";
+ * import Web3 from "web3";
+ */
+
 export const SearchBar = () => {
   if (!process.env.NEXT_PUBLIC_ALCHEMY_ETHEREUM_HTTP) {
     throw new Error(
       "Cannot get the ENS primary name`s address without an Alchemy API Key",
     );
   }
-  const provider = new Web3.providers.HttpProvider(
-    process.env.NEXT_PUBLIC_ALCHEMY_ETHEREUM_HTTP,
-  );
-  const ens = new ENS(undefined, provider);
+  /**
+   * @deprecated
+   * The Ethereum address related ENS primary name getter function is
+   * under refactoring, thus, this feature is currently commented out.
+   *
+   * const provider = new Web3.providers.HttpProvider(
+   *  process.env.NEXT_PUBLIC_ALCHEMY_ETHEREUM_HTTP,
+   * );
+   * const ens = new ENS(undefined, provider);
+   */
 
   const {
     lastWalletConnected,
@@ -75,19 +88,32 @@ export const SearchBar = () => {
 
   const getUserAddress = async () => {
     if (lastWalletConnected && inputAddress.length > 2) {
-      const _inputAddress = inputAddress;
-      const formattedAddress = normalizeENSName(inputAddress);
+      /**
+       * @deprecated
+       * The Ethereum address related ENS primary name getter function is
+       * under refactoring, thus, this feature is currently commented out.
+       *
+       * const _inputAddress = inputAddress;
+       * const formattedAddress = normalizeENSName(inputAddress);
+       */
 
       try {
-        const address: unknown = await ens.getOwner(formattedAddress);
-        if (typeof address !== "string") {
-          toast.error(
-            "Wrong type of address returned by provider. Please contact the team",
-          );
-          return;
-        }
+        /**
+         * @deprecated
+         * The Ethereum address related ENS primary name getter function is
+         * under refactoring, thus, this feature is currently commented out.
+         *
+         * const address: unknown = await ens.getOwner(formattedAddress);
+         * if (typeof address !== "string") {
+         * toast.error(
+         *  "Wrong type of address returned by provider. Please contact the team",
+         * );
+         * return;
+         * }
+         */
+
         validateAddressToSwap(
-          address === ADDRESS_ZERO ? _inputAddress : address,
+          inputAddress !== ADDRESS_ZERO ? inputAddress : ADDRESS_ZERO,
         );
       } catch (error) {
         toast.error("Invalid Ethereum Address");
diff --git a/components/01-atoms/index.ts b/components/01-atoms/index.ts
index fe1f62e7..ba6a3d2d 100644
--- a/components/01-atoms/index.ts
+++ b/components/01-atoms/index.ts
@@ -3,7 +3,10 @@ export * from "./ApproveTokenCards";
 export * from "./BlockExplorerExternalLinkButton";
 export * from "./ConnectWallet";
 export * from "./DisconnectWallet";
-export * from "./ENSAvatar";
+/**
+*  This export is commented out from dApp's features for now.
+*  export * from "./ENSAvatar";
+*/
 export * from "./LoadingIndicator";
 export * from "./NetworkDropdown";
 export * from "./MobileNotSupported";
diff --git a/components/02-molecules/EnsNameAndAddressWallet.tsx b/components/02-molecules/EnsNameAndAddressWallet.tsx
index 6c4190db..698b2dcd 100644
--- a/components/02-molecules/EnsNameAndAddressWallet.tsx
+++ b/components/02-molecules/EnsNameAndAddressWallet.tsx
@@ -1,17 +1,34 @@
+/**
+ * Component that displays the authenticated user's ENS name and address wallet.
+ *
+ * This component utilizes the `useAuthenticatedUser` hook to retrieve the authenticated user's address.
+ * It also includes commented sections that are intended for future use with ENS (Ethereum Name Service) data.
+ *
+ * The commented sections include:
+ * - `useEnsData` hook: This hook is used to fetch ENS data, such as the primary name associated with an address.
+ * - `ENSAvatar` component: This component is used to display the ENS avatar for a given address.
+ *
+ * @deprecated
+ * These sections are currently commented out because the `ens-avatar-searched-address` has issues fetching the correct address.
+ *
+ * The component renders a copy address button and a block explorer external link button if the authenticated user's address is available.
+ *
+ * import { useEnsData } from "@/lib/client/hooks/useENSData";
+ * import { ENSAvatar  } from "@/components/01-atoms";
+ */
+
 import { CopyAdressButton } from "@/components/02-molecules";
-import {
-  BlockExplorerExternalLinkButton,
-  ENSAvatar,
-} from "@/components/01-atoms";
+import { BlockExplorerExternalLinkButton } from "@/components/01-atoms";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
-import { useEnsData } from "@/lib/client/hooks/useENSData";
 
 export const EnsNameAndAddressWallet = () => {
   const { authenticatedUserAddress } = useAuthenticatedUser();
 
+  /**
   const { primaryName } = useEnsData({
     ensAddress: authenticatedUserAddress,
   });
+  */
 
   if (!authenticatedUserAddress) return null;
 
@@ -21,17 +38,23 @@ export const EnsNameAndAddressWallet = () => {
     <div className="flex gap-3 pb-5">
       {authenticatedUserAddress && (
         <>
-          <ENSAvatar avatarENSAddress={authenticatedUserAddress} />
+          {/**
+           * @deprecated
+           * The Ethereum address related ENS primary name getter function is
+           * under refactoring, thus, this feature is currently commented out.
+           *
+           * <ENSAvatar avatarENSAddress={authenticatedUserAddress} />
+           */}
           <div className="flex flex-col">
             <div className="flex items-center justify-start gap-2">
-              {primaryName && (
+              {/* {primaryName && (
                 <>
                   <h3 className="text-sm ">{`${primaryName}`}</h3>
                   <h3 className="text-sm text-softGray dark:text-mediumGray">
                     |
                   </h3>
                 </>
-              )}
+              )} */}
               <CopyAdressButton
                 authenticatedUserAddress={authenticatedUserAddress.toString()}
                 displayAddress={displayAddress}
diff --git a/components/02-molecules/OfferSummary.tsx b/components/02-molecules/OfferSummary.tsx
index 5464c1d1..3d2efe17 100644
--- a/components/02-molecules/OfferSummary.tsx
+++ b/components/02-molecules/OfferSummary.tsx
@@ -1,5 +1,5 @@
 import { ForWhom } from "../03-organisms";
-import { ENSAvatar, ENSAvatarSize, PersonIcon } from "@/components/01-atoms";
+import { PersonIcon } from "@/components/01-atoms";
 import {
   EtherFieldAddition,
   TokenCardStyleType,
@@ -8,9 +8,35 @@ import {
 import { ADDRESS_ZERO } from "@/lib/client/constants";
 import { SwapContext } from "@/lib/client/contexts";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
-import { useEnsData } from "@/lib/client/hooks/useENSData";
+/**
+ *  @deprecated
+ *
+ *  import { useEnsData } from "@/lib/client/hooks/useENSData";
+ */
 import { useContext } from "react";
 
+/**
+ * OfferSummary component displays a summary of token offers for a given user.
+ *
+ * @param {ForWhom} variant - Specifies whether the summary is for the authenticated user or another user.
+ *
+ *
+ * @remarks
+ * This component uses the `SwapContext` to fetch the necessary data for rendering the token offers.
+ * It also utilizes the `useAuthenticatedUser` hook to get the authenticated user's address.
+ *
+ * The component conditionally renders different sections based on the `variant` prop:
+ * - If `variant` is `ForWhom.Yours`, it displays the authenticated user's token offers.
+ * - If `variant` is `ForWhom.Their`, it displays the searched user's token offers.
+ *
+ * The ENS-related sections are currently commented out due to issues with fetching the correct ENS address.
+ * These sections include:
+ * - Displaying the ENS avatar for the searched address.
+ * - Displaying the ENS name for the searched address.
+ *
+ * These sections are currently commented out because the `ens-avatar-searched-address` has issues fetching the correct address.
+ * Since the ENS are not working properly. We're commenting those sections.
+ */
 export const OfferSummary = ({ variant }: { variant: ForWhom }) => {
   const {
     validatedAddressToSwap,
@@ -24,12 +50,14 @@ export const OfferSummary = ({ variant }: { variant: ForWhom }) => {
       ? authenticatedUserTokensList
       : searchedUserTokensList;
 
-  const { primaryName: searchedENSName } = useEnsData({
-    ensAddress: validatedAddressToSwap,
-  });
-  const { primaryName: authenticatedUserENSName } = useEnsData({
-    ensAddress: authenticatedUserAddress,
-  });
+  /**
+   * const { primaryName: searchedENSName } = useEnsData({
+   *  ensAddress: validatedAddressToSwap,
+   * });
+   * const { primaryName: authenticatedUserENSName } = useEnsData({
+   *  ensAddress: authenticatedUserAddress,
+   * });
+   */
 
   return (
     <div className="w-full h-full dark:bg-darkGreen border dark:border-darkGray bg-[#F0EEEE] borderlightSilver rounded-lg ">
@@ -37,32 +65,36 @@ export const OfferSummary = ({ variant }: { variant: ForWhom }) => {
         <div className="flex justify-between items-center h-9 gap-2">
           <div className="flex space-x-2 items-center">
             <div className="flex items-center">
-              {variant === ForWhom.Their && validatedAddressToSwap ? (
-                <ENSAvatar
-                  avatarENSAddress={validatedAddressToSwap}
-                  size={ENSAvatarSize.SMALL}
+              {/* {variant === ForWhom.Their && validatedAddressToSwap ? (
+               *<ENSAvatar
+               *  avatarENSAddress={validatedAddressToSwap}
+               *  size={ENSAvatarSize.SMALL}
+               *  />
+               *) : variant === ForWhom.Yours && authenticatedUserAddress ? (
+               *  <ENSAvatar
+               *    avatarENSAddress={authenticatedUserAddress}
+               *    size={ENSAvatarSize.SMALL}
+               *  />
+               *) : ( */}
+              <div className="bg-lightSilver dark:bg-darkGray p-[5px] rounded-md">
+                <PersonIcon
+                  size="14"
+                  className="text-sageGray dark:text-mediumGray"
                 />
-              ) : variant === ForWhom.Yours && authenticatedUserAddress ? (
-                <ENSAvatar
-                  avatarENSAddress={authenticatedUserAddress}
-                  size={ENSAvatarSize.SMALL}
-                />
-              ) : (
-                <div className="bg-lightSilver dark:bg-darkGray p-[5px] rounded-md">
-                  <PersonIcon
-                    size="14"
-                    className="text-sageGray dark:text-mediumGray"
-                  />
-                </div>
-              )}
+              </div>
+              {/* )} */}
             </div>
             <div className="items-center">
               <p className="p-small-variant-black-3 dark:p-small-variant-light-2 contrast-50">
                 {variant === ForWhom.Their && validatedAddressToSwap
                   ? `${
-                      searchedENSName
-                        ? `${searchedENSName} offers`
-                        : validatedAddressToSwap
+                      /**
+                       * searchedENSName
+                       * ? `${searchedENSName} offers`
+                       *
+                       *
+                       */
+                      validatedAddressToSwap
                         ? `${
                             validatedAddressToSwap.address === ADDRESS_ZERO
                               ? "Any user offers"
@@ -75,9 +107,11 @@ export const OfferSummary = ({ variant }: { variant: ForWhom }) => {
                   ? "They offer"
                   : variant === ForWhom.Yours && authenticatedUserAddress
                   ? `${
-                      authenticatedUserENSName
-                        ? `${authenticatedUserENSName} offers`
-                        : authenticatedUserAddress
+                      /**
+                       * authenticatedUserENSName
+                       * ? `${authenticatedUserENSName} offers`
+                       */
+                      authenticatedUserAddress
                         ? `${authenticatedUserAddress.getEllipsedAddress()} offers`
                         : "Connect your wallet"
                     }`
diff --git a/components/02-molecules/TheHeader.tsx b/components/02-molecules/TheHeader.tsx
index 14cee868..1bc393ef 100644
--- a/components/02-molecules/TheHeader.tsx
+++ b/components/02-molecules/TheHeader.tsx
@@ -1,11 +1,12 @@
+/* import { ENSAvatar } from "@/components/01-atoms"; */
 import { useScreenSize } from "@/lib/client/hooks/useScreenSize";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
 import {
   ConnectWallet,
-  ENSAvatar,
   MoonIcon,
   NetworkDropdown,
   NetworkVariantPosition,
+  PersonIcon,
   SunIcon,
   SwaplaceIcon,
   SwappingIcons,
@@ -93,9 +94,13 @@ export const TheHeader = () => {
                 <Tooltip position={"left"} content={"Your wallet"}>
                   <button
                     onClick={() => toggleSidebar()}
-                    className="rounded-[10px] flex items-center justify-center"
+                    className="rounded-[10px] flex items-center justify-center w-full h-full"
                   >
-                    <ENSAvatar avatarENSAddress={authenticatedUserAddress} />
+                    {/* <ENSAvatar avatarENSAddress={authenticatedUserAddress} /> */}
+                    <PersonIcon
+                      size={"20"}
+                      className="h-full items-center justify-center flex w-full p-2 text-sageGray dark:text-mediumGray"
+                    />
                   </button>
                 </Tooltip>
               ) : (
diff --git a/components/02-molecules/UserOfferInfo.tsx b/components/02-molecules/UserOfferInfo.tsx
index 0322cd8a..637f2b18 100644
--- a/components/02-molecules/UserOfferInfo.tsx
+++ b/components/02-molecules/UserOfferInfo.tsx
@@ -1,8 +1,9 @@
-import { ENSAvatar, ENSAvatarSize } from "@/components/01-atoms";
+/* import { ENSAvatar, ENSAvatarSize } from "@/components/01-atoms";
+ * import { useEnsData } from "@/lib/client/hooks/useENSData"; */
+
 import { ADDRESS_ZERO } from "@/lib/client/constants";
 import { SwapContext } from "@/lib/client/contexts";
 import { useAuthenticatedUser } from "@/lib/client/hooks/useAuthenticatedUser";
-import { useEnsData } from "@/lib/client/hooks/useENSData";
 import { PopulatedSwapOfferCard } from "@/lib/client/offers-utils";
 import { SwapNativeEther } from "@/lib/client/swap-utils";
 import { isInRange } from "@/lib/client/utils";
@@ -12,11 +13,27 @@ import { formatEther } from "viem";
 import { useNetwork } from "wagmi";
 
 export enum UserOfferVariant {
-  NAME_ENS = "NAME_ENS", // only the name of the ENS and avatar
-  CREATING_SWAP = "CREATING_SWAP", // the name of the ENS and avatar with the amount of ether being sent ( etherValue )
-  SWAP_CREATED = "SWAP_CREATED", // the name of the ENS and avatar with the amount of ether in the swap already created
-  SWAP_CREATED_MARKETPLACE = "SWAP_CREATED_MARKETPLACE", // the name of the ENS and avatar with the amount of ether in the swap already created
+  /**
+   * Only the name of the ENS and avatar.
+   */
+  NAME_ENS = "NAME_ENS",
+
+  /**
+   * The name of the ENS and avatar with the amount of ether being sent (etherValue).
+   */
+  CREATING_SWAP = "CREATING_SWAP",
+
+  /**
+   * The name of the ENS and avatar with the amount of ether in the swap already created.
+   */
+  SWAP_CREATED = "SWAP_CREATED",
+
+  /**
+   * The name of the ENS and avatar with the amount of ether in the swap already created.
+   */
+  SWAP_CREATED_MARKETPLACE = "SWAP_CREATED_MARKETPLACE",
 }
+
 interface UserOfferInfoProps {
   address: EthereumAddress | null;
   variant?: UserOfferVariant;
@@ -29,6 +46,20 @@ interface UserOfferInfoProps {
  * The component will render the ENS name and avatar of the user.
  * The component variant will render the amount of ether being sent in the swap or the amount of ether in the swap already created.
  *
+ * @param {EthereumAddress | null} address - The Ethereum address of the user.
+ * @param {UserOfferVariant} variant - The variant of the user offer information to display. Defaults to UserOfferVariant.NAME_ENS
+ * @param {SwapNativeEther} nativeEther - The native ether details for the swap.
+ * @param {PopulatedSwapOfferCard} swap - The populated swap offer card details.
+ *
+ *
+ * @remarks
+ * The ENS name and avatar rendering sections are commented out due to issues with the ENS data retrieval.
+ * Specifically, the ENS avatar is not working properly because the searched address by ENS is not functioning correctly.
+ * For more details, refer to the `useENSData` file.
+ *
+ * @deprecated
+ * These sections are currently commented out because the `ens-avatar-searched-address` has issues fetching the correct address.
+ * Since the ENS are not working properly. We're commenting those sections.
  */
 export const UserOfferInfo = ({
   address,
@@ -36,9 +67,11 @@ export const UserOfferInfo = ({
   nativeEther,
   swap,
 }: UserOfferInfoProps) => {
+  /**
   const { primaryName } = useEnsData({
     ensAddress: address,
   });
+   */
   const { etherValue, etherRecipient } = useContext(SwapContext);
   const [isMounted, setIsMounted] = useState(false);
   const { chain } = useNetwork();
@@ -64,15 +97,16 @@ export const UserOfferInfo = ({
       <div>
         <div className="flex gap-2">
           <div>
-            {address && (
+            {/* {address && (
               <ENSAvatar
                 avatarENSAddress={address}
                 size={ENSAvatarSize.SMALL}
               />
-            )}
+            )} */}
           </div>
           <div className="flex ">
-            {primaryName ? <p>{primaryName}</p> : <p>{displayAddress}</p>}
+            {/* {primaryName ? <p>{primaryName}</p> :<p>{displayAddress}</p> } */}
+            <p>{displayAddress}</p>
           </div>
         </div>
       </div>
@@ -82,19 +116,19 @@ export const UserOfferInfo = ({
         <div className="flex justify-between">
           <div className="flex gap-2">
             <div>
-              {address && (
+              {/* {address && (
                 <ENSAvatar
                   avatarENSAddress={address}
                   size={ENSAvatarSize.SMALL}
                 />
-              )}
+              )} */}
             </div>
             <div className="flex ">
-              {primaryName ? (
+              {/* {primaryName ? (
                 <p>{primaryName} gets</p>
-              ) : (
-                <p>{displayAddress} gets</p>
-              )}
+              ) : ( */}
+              <p>{displayAddress} gets</p>
+              {/* )} */}
             </div>
           </div>
           {address?.address !== authenticatedUserAddress?.address &&
@@ -128,19 +162,19 @@ export const UserOfferInfo = ({
         <div className="flex justify-between">
           <div className="flex gap-2">
             <div>
-              {address && (
+              {/* {address && (
                 <ENSAvatar
                   avatarENSAddress={address}
                   size={ENSAvatarSize.SMALL}
                 />
-              )}
+              )} */}
             </div>
             <div className="flex ">
-              {primaryName ? (
+              {/* {primaryName ? (
                 <p>{primaryName} gets</p>
-              ) : (
-                <p>{displayAddress} gets</p>
-              )}
+              ) : ( */}
+              <p>{displayAddress} gets</p>
+              {/* )} */}
             </div>
           </div>
           {nativeEther &&
@@ -176,19 +210,19 @@ export const UserOfferInfo = ({
         <div className="flex justify-between">
           <div className="flex gap-2">
             <div>
-              {address && (
+              {/* {address && (
                 <ENSAvatar
                   avatarENSAddress={address}
                   size={ENSAvatarSize.SMALL}
                 />
-              )}
+              )} */}
             </div>
             <div className="flex">
-              {primaryName ? (
+              {/* {primaryName ? (
                 <p>{primaryName} gets</p>
-              ) : (
-                <p>{displayAddress} gets</p>
-              )}
+              ) : ( */}
+              <p>{displayAddress} gets</p>
+              {/* )} */}
             </div>
           </div>
           {address?.address !== ADDRESS_ZERO &&
diff --git a/lib/client/hooks/useENSData.tsx b/lib/client/hooks/useENSData.tsx
index e8429fbc..c4696f74 100644
--- a/lib/client/hooks/useENSData.tsx
+++ b/lib/client/hooks/useENSData.tsx
@@ -1,3 +1,20 @@
+/**
+ * This section is commented because the ENSAvatar is not working properly since the searched address by ens not working correctly. Check more about in useENSData file.
+ *
+ * The `useEnsData` hook is responsible for fetching and managing Ethereum Name Service (ENS)
+ * data based on the provided ENS address. It fetches the primary ENS name and avatar status
+ * for the given address.
+ *
+ * The hook uses the `useEffect` hook to trigger the data fetching process whenever the
+ * `ensAddress` changes. It updates the state variables `primaryName` and `avatarQueryStatus`
+ * based on the fetched data or any errors encountered during the fetch process.
+ *
+ * @deprecated
+ * These sections are currently commented out because the `ens-avatar-searched-address` has issues fetching the correct address.
+ * Since the ENS are not working properly. We're commenting those sections.
+ */
+
+/**
 import { EthereumAddress } from "@/lib/shared/types";
 import { useEffect, useState } from "react";
 
@@ -56,3 +73,4 @@ export const useEnsData = ({ ensAddress }: Props) => {
       : null,
   };
 };
+ */