From ecf134bd415932e1fc38160bfe1dcdb786c257e1 Mon Sep 17 00:00:00 2001
From: Arjun Porwal <65214523+ap211unitech@users.noreply.github.com>
Date: Wed, 19 Mar 2025 22:01:52 +0530
Subject: [PATCH] refactor: remove unused useEffect and clean up fee asset
 handling (#11397)

---
 packages/react-hooks/src/ctx/PayWithAsset.tsx |  6 +-----
 packages/react-signer/src/PayWithAsset.tsx    | 21 +++++++++++--------
 2 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/packages/react-hooks/src/ctx/PayWithAsset.tsx b/packages/react-hooks/src/ctx/PayWithAsset.tsx
index a588cc9ad0..864d296bf9 100644
--- a/packages/react-hooks/src/ctx/PayWithAsset.tsx
+++ b/packages/react-hooks/src/ctx/PayWithAsset.tsx
@@ -5,7 +5,7 @@ import type { BN } from '@polkadot/util';
 import type { AssetInfoComplete } from '../types.js';
 import type { PayWithAsset } from './types.js';
 
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 
 import { useApi, useAssetIds, useAssetInfos } from '@polkadot/react-hooks';
 
@@ -75,10 +75,6 @@ function PayWithAssetProvider ({ children }: Props): React.ReactElement<Props> {
   [api.call.assetConversionApi, api.registry.metadata.extrinsic.signedExtensions, api.tx.assetConversion, completeAssetInfos.length]
   );
 
-  useEffect(() => {
-    return () => setSelectedFeeAsset(null);
-  });
-
   const values: PayWithAsset = useMemo(() => {
     return {
       assetOptions,
diff --git a/packages/react-signer/src/PayWithAsset.tsx b/packages/react-signer/src/PayWithAsset.tsx
index d823dc8655..548befbfca 100644
--- a/packages/react-signer/src/PayWithAsset.tsx
+++ b/packages/react-signer/src/PayWithAsset.tsx
@@ -53,17 +53,20 @@ const PayWithAsset = ({ onChangeFeeAsset }: Props) => {
   }, [assetOptions, selectedAssetValue, nativeAsset]);
 
   useEffect(() => {
-    if (selectedFeeAsset) {
-      onChangeFeeAsset((e) =>
-        ({
-          ...e,
-          assetId: getFeeAssetLocation(api, selectedFeeAsset),
-          feeAsset: selectedFeeAsset
-        })
-      );
-    }
+    onChangeFeeAsset((e) =>
+      ({
+        ...e,
+        assetId: getFeeAssetLocation(api, selectedFeeAsset),
+        feeAsset: selectedFeeAsset
+      })
+    );
   }, [api, onChangeFeeAsset, selectedFeeAsset]);
 
+  useEffect(() => {
+    // Reselect native asset on component unmount
+    return () => onSelect(nativeAsset);
+  }, [nativeAsset, onSelect]);
+
   return (
     <Modal.Columns hint={t('By selecting this option, the transaction fee will be automatically deducted from the specified asset, ensuring a seamless and efficient payment process.')}>
       <Dropdown