Show sign in button if user address and active wallet address are mis…

…-matched (#1886)
thirdweb-dev · Nov 1, 2023 · 6fcd09d · 6fcd09d
1 parent a9d32f3
commit 6fcd09d
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/.changeset/smart-pens-tap.md b/.changeset/smart-pens-tap.md
@@ -0,0 +1,5 @@
+---
+"@thirdweb-dev/react": patch
+---
+
+Fix for user address and active wallet address out of sync
diff --git a/packages/react/src/wallet/ConnectWallet/ConnectWallet.tsx b/packages/react/src/wallet/ConnectWallet/ConnectWallet.tsx
@@ -169,9 +169,12 @@ export const ConnectWallet: React.FC<ConnectWalletProps> = (props) => {
   const { user } = useUser();
   const disconnect = useDisconnect();
 
+  const shouldSignIn = !!authConfig?.authUrl && !!address && !user?.address;
+  const addressAndUserAddressMismatched = address !== user?.address;
+
   const requiresSignIn = props.auth?.loginOptional
     ? false
-    : !!authConfig?.authUrl && !!address && !user?.address;
+    : shouldSignIn || addressAndUserAddressMismatched;
 
   const supportedTokens = useMemo(() => {
     if (!props.supportedTokens) {
@@ -192,10 +195,10 @@ export const ConnectWallet: React.FC<ConnectWalletProps> = (props) => {
 
   // if wallet gets disconnected, close the signature modal
   useEffect(() => {
-    if (!activeWallet) {
+    if (!activeWallet && !addressAndUserAddressMismatched) {
       setShowSignatureModal(false);
     }
-  }, [activeWallet]);
+  }, [activeWallet, addressAndUserAddressMismatched]);
 
   return (
     <CustomThemeProvider theme={theme}>