Minor fixes based on feedback

components/Accounts.tsx

@@ -469,7 +469,7 @@ const Accounts: FC<AccountProps> = (props) => {
                       e.stopPropagation();
                     }}
                   >
-                    <SetHookDialog accountIndex={index} />
+                    <SetHookDialog accountAddress={account.address} />
                   </div>
                 )}
               </Flex>

components/SetHookDialog.tsx

@@ -53,10 +53,11 @@ export type SetHookData = {
   // }[];
 };
 
-export const SetHookDialog: React.FC<{ accountIndex: number }> = React.memo(
-  ({ accountIndex }) => {
+export const SetHookDialog: React.FC<{ accountAddress: string }> = React.memo(
+  ({ accountAddress }) => {
     const snap = useSnapshot(state);
-    const account = snap.accounts[accountIndex];
+    const account = snap.accounts.find((acc) => acc.address === accountAddress);
+
     const [isSetHookDialogOpen, setIsSetHookDialogOpen] = useState(false);
     const {
       register,
@@ -88,22 +89,6 @@ export const SetHookDialog: React.FC<{ accountIndex: number }> = React.memo(
       );
       setFormInitialized(true);
     }, [snap.activeWat, snap.files, setValue]);
-    // Calcucate initial fee estimate when modal opens
-    useEffect(() => {
-      if (formInitialized) {
-        (async () => {
-          const formValues = getValues();
-          const tx = await prepareDeployHookTx(account, formValues);
-          if (!tx) {
-            return;
-          }
-          const res = await estimateFee(tx, account);
-          if (res && res.base_fee) {
-            setValue("Fee", res.base_fee);
-          }
-        })();
-      }
-    }, [formInitialized]);
     // const {
     //   fields: grantFields,
     //   append: grantAppend,
@@ -125,6 +110,24 @@ export const SetHookDialog: React.FC<{ accountIndex: number }> = React.memo(
       calculateHashedValue();
     }, [namespace, calculateHashedValue]);
 
+    // Calcucate initial fee estimate when modal opens
+    useEffect(() => {
+      if (formInitialized && account) {
+        (async () => {
+          const formValues = getValues();
+          const tx = await prepareDeployHookTx(account, formValues);
+          if (!tx) {
+            return;
+          }
+          const res = await estimateFee(tx, account);
+          if (res && res.base_fee) {
+            setValue("Fee", res.base_fee);
+          }
+        })();
+      }
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [formInitialized]);
+
     if (!account) {
       return null;
     }
@@ -392,4 +395,6 @@ export const SetHookDialog: React.FC<{ accountIndex: number }> = React.memo(
   }
 );
 
+SetHookDialog.displayName = "SetHookDialog";
+
 export default SetHookDialog;

utils/estimateFee.ts

@@ -3,7 +3,6 @@ import state, { IAccount } from "../state"
 
 const estimateFee = async (tx: Record<string, unknown>, account: IAccount): Promise<null | { base_fee: string, median_fee: string; minimum_fee: string; open_ledger_fee: string; }> => {
   const copyTx = JSON.parse(JSON.stringify(tx))
-  console.log(tx)
   delete copyTx['SigningPubKey']
   if (!copyTx.Fee) {
     copyTx.Fee = '1000'