[React] add props for button title to change the text (#422)

Co-authored-by: Jonas Daniels <jonas.daniels@outlook.com>
thirdweb-dev · Dec 8, 2022 · 08d04fe · 08d04fe
1 parent cbf5508
commit 08d04fe
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/.changeset/sharp-ducks-attack.md b/.changeset/sharp-ducks-attack.md
@@ -0,0 +1,5 @@
+---
+"@thirdweb-dev/react": patch
+---
+
+Add `btnTitle` prop to the `ConnectWallet` component. Now you can set customized string or child component to the connect button.
diff --git a/packages/react/src/evm/components/ConnectWallet/index.tsx b/packages/react/src/evm/components/ConnectWallet/index.tsx
@@ -63,6 +63,7 @@ interface ConnectWalletProps extends ThemeProviderProps {
     loginOptional?: boolean;
   };
   className?: string;
+  btnTitle?: JSX.Element | string;
 }
 
 let connecting = false;
@@ -120,6 +121,7 @@ const chainIdToCurrencyMap: Record<
 export const ConnectWallet: React.FC<ConnectWalletProps> = ({
   auth,
   className,
+  btnTitle,
   ...themeProps
 }) => {
   const id = useId();
@@ -248,7 +250,9 @@ export const ConnectWallet: React.FC<ConnectWalletProps> = ({
               </span>
             )
           ) : (
-            <span style={{ whiteSpace: "nowrap" }}>Connect Wallet</span>
+            <span style={{ whiteSpace: "nowrap" }}>
+              {btnTitle || "Connect Wallet"}
+            </span>
           )}
         </Button>