# Xai Connect

### Prerequisites

To use the Xai Connect Ecosystem Wallet, you will need to:

* Create a thirdweb account ([link](https://thirdweb.com/dashboard))
  * Navigate to the **Settings** page and create an API key to get your **Client ID**
* Get your ecosystem partner ID from Xai

You can integrate to the Xai Connect Ecosystem Wallet in two different ways:

### Login with Xai Connect only

You can install the thirdweb SDK and use thirdweb’s [ConnectButton](https://portal.thirdweb.com/typescript/v5/react/components/ConnectButton) alongside the Partner ID Xai created for you to display only the Xai branded sign in flow.

```tsx
import { ecosystemWallet } from "thirdweb/wallets";

const restrictedWallet = ecosystemWallet("ecosystem.xai-connect", {
	partnerId: "..." // partner ID provided to you by XAI
});
```

In the React SDK, you may provide the wallet as the only option to restrict user logins to the ecosystem.

```tsx
<ConnectButton
	client={THIRDWEB_CLIENT} /* your own thirdweb API key */
	wallets={[wallet]}
	{...props}
/>
```

### Adding Xai Connect with Other Login Options

You can add Xai Connect as a wallet connector option amongst other wallet options in your existing sign in flow on any domains whitelisted under the ecosystem.

In this example, a partner game might be using thirdweb’s in-app wallet and wants to include Xai Connect as another login option for users.

```tsx
<ConnectButton
	client={THIRDWEB_CLIENT} /* your own thirdweb API key */
	wallets={[inAppWallet(), createWallet("io.metamask"), createWallet("ecosystem.xai.connect")]}
	{...props}
/>
```