feat: add hideDisconnect prop to ConnectWallet

.changeset/empty-pillows-itch.md

@@ -0,0 +1,9 @@
+---
+"@thirdweb-dev/react": patch
+---
+
+Add `hideDisconnect` prop on `ConnectWallet` component to hide the "Disconnect Wallet" option from the ConnectWallet dropdown
+
+```tsx
+<ConnectWallet hideDisconnect={true} />
+```

packages/react/src/wallet/ConnectWallet/ConnectWallet.tsx

@@ -308,6 +308,18 @@ export type ConnectWalletProps = {
    * ```
    */
   hideSwitchToPersonalWallet?: boolean;
+
+  /**
+   * Hide the "Disconnect Wallet" button in the ConnectWallet Dropdown.
+   *
+   * By default it is `false`
+   *
+   * @example
+   * ```tsx
+   * <ConnectWallet hideDisconnect={true} />
+   * ```
+   */
+  hideDisconnect?: boolean;
 };
 
 const TW_CONNECT_WALLET = "tw-connect-wallet";
@@ -535,6 +547,14 @@ const TW_CONNECT_WALLET = "tw-connect-wallet";
  * <ConnectWallet hideSwitchToPersonalWallet={true} />
  * ```
  *
+ * ### hideDisconnect
+ * Hide the "Disconnect Wallet" button in the ConnectWallet dropdown
+ *
+ * By default it is `false`
+ *
+ * ```tsx
+ * <ConnectWallet hideDisconnect={true} />
+ * ```
  */
 export function ConnectWallet(props: ConnectWalletProps) {
   const activeWallet = useWallet();
@@ -732,6 +752,7 @@ export function ConnectWallet(props: ConnectWalletProps) {
               }
             }}
             hideSwitchToPersonalWallet={props.hideSwitchToPersonalWallet}
+            hideDisconnect={props.hideDisconnect}
           />
         );
       })()}

packages/react/src/wallet/ConnectWallet/Details.tsx

@@ -97,6 +97,7 @@ export const ConnectedWalletDetails: React.FC<{
   supportedTokens: SupportedTokens;
   displayBalanceToken?: Record<number, string>;
   hideSwitchToPersonalWallet?: boolean;
+  hideDisconnect?: boolean;
 }> = (props) => {
   const locale = useTWLocale().connectWallet;
   const chain = useChain();
@@ -331,22 +332,24 @@ export const ConnectedWalletDetails: React.FC<{
               </IconButton>
             </div>
 
-            <ToolTip
-              tip={locale.disconnectWallet}
-              side="bottom"
-              align={"end"}
-              sideOffset={10}
-            >
-              <DisconnectIconButton
-                type="button"
-                onClick={() => {
-                  disconnect();
-                  props.onDisconnect();
-                }}
+            {!props.hideDisconnect && (
+              <ToolTip
+                tip={locale.disconnectWallet}
+                side="bottom"
+                align={"end"}
+                sideOffset={10}
               >
-                <ExitIcon size={iconSize.md} />
-              </DisconnectIconButton>
-            </ToolTip>
+                <DisconnectIconButton
+                  type="button"
+                  onClick={() => {
+                    disconnect();
+                    props.onDisconnect();
+                  }}
+                >
+                  <ExitIcon size={iconSize.md} />
+                </DisconnectIconButton>
+              </ToolTip>
+            )}
           </Container>
 
           {/* row 2 */}

packages/react/src/wallet/ConnectWallet/Modal/ConnectModalInline.tsx

@@ -39,6 +39,7 @@ export const ConnectModalInline = (
     | "switchToActiveChain"
     | "supportedTokens"
     | "hideSwitchToPersonalWallet"
+    | "hideDisconnect"
   > & {
     onModalHide?: () => void;
   },