[React] Fix sign in button display logic (#1888)

thirdweb-dev · Nov 1, 2023 · 789700c · 789700c
1 parent 570d71e
commit 789700c
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/.changeset/fresh-toys-remember.md b/.changeset/fresh-toys-remember.md
@@ -0,0 +1,5 @@
+---
+"@thirdweb-dev/react": patch
+---
+
+Fix sign in connect button display logic
diff --git a/packages/react/src/wallet/ConnectWallet/ConnectWallet.tsx b/packages/react/src/wallet/ConnectWallet/ConnectWallet.tsx
@@ -169,12 +169,14 @@ 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 connectedButNotSignedIn =
+    !!authConfig?.authUrl &&
+    !!address &&
+    (!user?.address || address !== user?.address);
 
   const requiresSignIn = props.auth?.loginOptional
     ? false
-    : shouldSignIn || addressAndUserAddressMismatched;
+    : connectedButNotSignedIn;
 
   const supportedTokens = useMemo(() => {
     if (!props.supportedTokens) {
@@ -195,10 +197,10 @@ export const ConnectWallet: React.FC<ConnectWalletProps> = (props) => {
 
   // if wallet gets disconnected, close the signature modal
   useEffect(() => {
-    if (!activeWallet && !addressAndUserAddressMismatched) {
+    if (!activeWallet) {
       setShowSignatureModal(false);
     }
-  }, [activeWallet, addressAndUserAddressMismatched]);
+  }, [activeWallet]);
 
   return (
     <CustomThemeProvider theme={theme}>