From 4de91234063dea8cc6f9a0d5ba8fdac05b8e2f51 Mon Sep 17 00:00:00 2001
From: Sid Vishnoi <8426945+sidvishnoi@users.noreply.github.com>
Date: Thu, 16 Jan 2025 16:48:58 +0530
Subject: [PATCH] fix(ConnectWalletForm): correctly render error from
 transientState

---
 src/pages/popup/components/ConnectWalletForm.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/pages/popup/components/ConnectWalletForm.tsx b/src/pages/popup/components/ConnectWalletForm.tsx
index 15e1c132..83431453 100644
--- a/src/pages/popup/components/ConnectWalletForm.tsx
+++ b/src/pages/popup/components/ConnectWalletForm.tsx
@@ -12,6 +12,7 @@ import {
 } from '@/pages/shared/components/InputAmount';
 import { toWalletAddressUrl } from '@/pages/shared/lib/utils';
 import { useTranslation } from '@/popup/lib/context';
+import { deepClone } from 'valtio/utils';
 import {
   cn,
   errorWithKey,
@@ -104,8 +105,12 @@ export const ConnectWalletForm = ({
   const [errors, setErrors] = React.useState<Errors>({
     walletAddressUrl: null,
     amount: null,
-    keyPair: state?.status === 'error:key' ? toErrorInfo(state.error) : null,
-    connect: state?.status === 'error' ? toErrorInfo(state.error) : null,
+    keyPair:
+      state?.status === 'error:key'
+        ? toErrorInfo(deepClone(state.error))
+        : null,
+    connect:
+      state?.status === 'error' ? toErrorInfo(deepClone(state.error)) : null,
   });
   const [isValidating, setIsValidating] = React.useState({
     walletAddressUrl: false,