diff --git a/.changeset/shy-scissors-work.md b/.changeset/shy-scissors-work.md
new file mode 100644
index 00000000000..db144848b73
--- /dev/null
+++ b/.changeset/shy-scissors-work.md
@@ -0,0 +1,5 @@
+---
+"thirdweb": patch
+---
+
+Only connect wallets on SIWE linking if not already connected
diff --git a/apps/playground-web/src/app/connect/sign-in/button/page.tsx b/apps/playground-web/src/app/connect/sign-in/button/page.tsx
index dd9302763f1..c51a74c0d53 100644
--- a/apps/playground-web/src/app/connect/sign-in/button/page.tsx
+++ b/apps/playground-web/src/app/connect/sign-in/button/page.tsx
@@ -65,7 +65,7 @@ export default function Page(props: {
description={
<>
A fully featured wallet connection component that allows to
- Connect to 350+ external wallets, connect via email, phone number,
+ Connect to 500+ external wallets, connect via email, phone number,
passkey or social logins, Convert any wallet to a ERC4337 smart
wallet for gasless transactions and provides SIWE (Sign In With
Ethereum)
diff --git a/apps/playground-web/src/app/connect/sign-in/components/WalletsSelection.tsx b/apps/playground-web/src/app/connect/sign-in/components/WalletsSelection.tsx
index 243b96b1365..61bd027cc93 100644
--- a/apps/playground-web/src/app/connect/sign-in/components/WalletsSelection.tsx
+++ b/apps/playground-web/src/app/connect/sign-in/components/WalletsSelection.tsx
@@ -61,7 +61,7 @@ export function WalletsSelection(props: {
setSearch(e.target.value)}
diff --git a/apps/playground-web/src/app/connect/sign-in/headless/page.tsx b/apps/playground-web/src/app/connect/sign-in/headless/page.tsx
index 5abb84becdd..fe90865f5d9 100644
--- a/apps/playground-web/src/app/connect/sign-in/headless/page.tsx
+++ b/apps/playground-web/src/app/connect/sign-in/headless/page.tsx
@@ -4,6 +4,7 @@ import { HooksPreview } from "@/components/sign-in/hooks";
import ThirdwebProvider from "@/components/thirdweb-provider";
import { metadataBase } from "@/lib/constants";
import type { Metadata } from "next";
+import { ModalPreview } from "../../../../components/sign-in/modal";
export const metadata: Metadata = {
metadataBase,
@@ -28,13 +29,44 @@ export default function Page() {
docsLink="https://portal.thirdweb.com/connect/sign-in/overview"
heroLink="/connectors.png"
/>
-
+
+
);
}
+function Modal() {
+ return (
+ <>
+
+ Open the connect modal from anywhere
+
+
+
+ You can open the connect modal from anywhere in your app.
+
+
+ }
+ code={`// Using your own UI
+ import { useConnectModal } from "thirdweb/react";
+
+ function App(){
+ const { connect } = useConnectModal();
+
+ return (
+ // pass modal configuration options here
+
+ );
+ };`}
+ lang="tsx"
+ />
+ >
+ );
+}
+
function Hooks() {
return (
<>
@@ -43,7 +75,7 @@ function Hooks() {
- Build your own connect UI using react hooks.
+ Full control over your UI using react hooks.
Wallet state management is all handled for you.
+ );
+}
diff --git a/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts b/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts
index c723ad6377c..e95c9d3394a 100644
--- a/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts
+++ b/packages/thirdweb/src/react/core/hooks/connection/ConnectButtonProps.ts
@@ -592,7 +592,7 @@ export type ConnectButtonProps = {
* ]
* ```
*
- * The `ConnectButton` also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 350+ wallets
+ * The `ConnectButton` also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 500+ wallets
*/
wallets?: Wallet[];
@@ -945,7 +945,7 @@ export type ConnectButtonProps = {
recommendedWallets?: Wallet[];
/**
- * By default, ConnectButton modal shows a "All Wallets" button that shows a list of 350+ wallets.
+ * By default, ConnectButton modal shows a "All Wallets" button that shows a list of 500+ wallets.
*
* You can disable this button by setting `showAllWallets` prop to `false`
*/
diff --git a/packages/thirdweb/src/react/core/hooks/connection/ConnectEmbedProps.ts b/packages/thirdweb/src/react/core/hooks/connection/ConnectEmbedProps.ts
index c3069097330..7756b720b6f 100644
--- a/packages/thirdweb/src/react/core/hooks/connection/ConnectEmbedProps.ts
+++ b/packages/thirdweb/src/react/core/hooks/connection/ConnectEmbedProps.ts
@@ -87,7 +87,7 @@ export type ConnectEmbedProps = {
* ]
* ```
*
- * The `ConnectEmbed` also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 350+ wallets
+ * The `ConnectEmbed` also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 500+ wallets
*/
wallets?: Wallet[];
@@ -266,7 +266,7 @@ export type ConnectEmbedProps = {
recommendedWallets?: Wallet[];
/**
- * By default, `ConnectEmbed` shows a "All Wallets" button that shows a list of 350+ wallets.
+ * By default, `ConnectEmbed` shows a "All Wallets" button that shows a list of 500+ wallets.
*
* You can disable this button by setting `showAllWallets` prop to `false`
*/
diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/ConnectButton.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/ConnectButton.tsx
index 31dcf7aa530..a2c6db1c5f9 100644
--- a/packages/thirdweb/src/react/web/ui/ConnectWallet/ConnectButton.tsx
+++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/ConnectButton.tsx
@@ -36,7 +36,7 @@ const TW_CONNECT_WALLET = "tw-connect-wallet";
/**
* A fully featured wallet connection component that allows to:
*
- * - Connect to 350+ external wallets
+ * - Connect to 500+ external wallets
* - Connect with email, phone, passkey or socials
* - Convert any wallet to a ERC4337 smart wallet for gasless transactions
* - Sign in with ethereum (Auth)
diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/Modal/ConnectEmbed.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/Modal/ConnectEmbed.tsx
index d11d1ae072d..3b6d88619f0 100644
--- a/packages/thirdweb/src/react/web/ui/ConnectWallet/Modal/ConnectEmbed.tsx
+++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/Modal/ConnectEmbed.tsx
@@ -42,7 +42,7 @@ import { useSetupScreen } from "./screen.js";
/**
* An inline wallet connection component that allows to:
*
- * - Connect to 350+ external wallets
+ * - Connect to 500+ external wallets
* - Connect with email, phone, passkey or socials
* - Convert any wallet to a ERC4337 smart wallet for gasless transactions
* - Sign in with ethereum (Auth)
diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/WalletSelector.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/WalletSelector.tsx
index 743e2412a1c..0a748379e0d 100644
--- a/packages/thirdweb/src/react/web/ui/ConnectWallet/WalletSelector.tsx
+++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/WalletSelector.tsx
@@ -667,7 +667,7 @@ const WalletSelection: React.FC<{
All Wallets
- 350+
+ 500+
diff --git a/packages/thirdweb/src/react/web/ui/ConnectWallet/useConnectModal.tsx b/packages/thirdweb/src/react/web/ui/ConnectWallet/useConnectModal.tsx
index 2bcb1376c2f..5b330adfb99 100644
--- a/packages/thirdweb/src/react/web/ui/ConnectWallet/useConnectModal.tsx
+++ b/packages/thirdweb/src/react/web/ui/ConnectWallet/useConnectModal.tsx
@@ -233,7 +233,7 @@ export type UseConnectModalOptions = {
* ]
* ```
*
- * Connect Modal also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 350+ wallets
+ * Connect Modal also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 500+ wallets
*/
wallets?: Wallet[];
@@ -357,7 +357,7 @@ export type UseConnectModalOptions = {
recommendedWallets?: Wallet[];
/**
- * By default, Connect modal shows a "All Wallets" button that shows a list of 350+ wallets.
+ * By default, Connect modal shows a "All Wallets" button that shows a list of 500+ wallets.
*
* You can disable this button by setting `showAllWallets` prop to `false`
*/
diff --git a/packages/thirdweb/src/react/web/ui/PayEmbed.tsx b/packages/thirdweb/src/react/web/ui/PayEmbed.tsx
index 323d77924c7..fb7caddf1c5 100644
--- a/packages/thirdweb/src/react/web/ui/PayEmbed.tsx
+++ b/packages/thirdweb/src/react/web/ui/PayEmbed.tsx
@@ -496,7 +496,7 @@ export type PayEmbedConnectOptions = {
recommendedWallets?: Wallet[];
/**
- * By default, ConnectButton modal shows a "All Wallets" button that shows a list of 350+ wallets.
+ * By default, ConnectButton modal shows a "All Wallets" button that shows a list of 500+ wallets.
*
* You can disable this button by setting `showAllWallets` prop to `false`
*/
diff --git a/packages/thirdweb/src/wallets/create-wallet.ts b/packages/thirdweb/src/wallets/create-wallet.ts
index 92e8bb4bd76..132244b006e 100644
--- a/packages/thirdweb/src/wallets/create-wallet.ts
+++ b/packages/thirdweb/src/wallets/create-wallet.ts
@@ -32,7 +32,7 @@ import { createWalletEmitter } from "./wallet-emitter.js";
/**
* Creates a wallet based on the provided ID and arguments.
*
- * - Supports 350+ wallets
+ * - Supports 500+ wallets
* - Handles both injected browser wallets and WalletConnect sessions
*
* [View all available wallets](https://portal.thirdweb.com/typescript/v5/supported-wallets)
diff --git a/packages/thirdweb/src/wallets/in-app/core/authentication/siwe.ts b/packages/thirdweb/src/wallets/in-app/core/authentication/siwe.ts
index c7710160dcf..354e845f467 100644
--- a/packages/thirdweb/src/wallets/in-app/core/authentication/siwe.ts
+++ b/packages/thirdweb/src/wallets/in-app/core/authentication/siwe.ts
@@ -19,7 +19,9 @@ export async function siweAuthenticate(args: {
ecosystem?: Ecosystem;
}): Promise {
const { wallet, chain } = args;
- const account = await wallet.connect({ client: args.client });
+ // only connect if the wallet doesn't already have an account
+ const account =
+ wallet.getAccount() || (await wallet.connect({ client: args.client }));
const clientFetch = getClientFetch(args.client, args.ecosystem);
const payload = await (async () => {