Enoki Docs

Register Enoki Wallets

Initializing

To register Enoki wallets using the wallet-standard, you can use the registerEnokiWallets function. This will add a wallet for each of the configured auth providers. These wallets implement all the standard wallet standard features, and can be interacted with like any other Sui wallet.

Register one client for each supported network and use getCurrentNetwork to select the active network. The clients below use gRPC.

import { registerEnokiWallets } from '@mysten/enoki';
import { SuiGrpcClient } from '@mysten/sui/grpc';

const suiClient = new SuiGrpcClient({
	baseUrl: 'https://fullnode.testnet.sui.io:443',
	network: 'testnet',
});

registerEnokiWallets({
	clients: [suiClient],
	getCurrentNetwork: () => 'testnet',
	apiKey: 'YOUR_PUBLIC_ENOKI_API_KEY',
	providers: {
		google: {
			clientId: 'YOUR_GOOGLE_CLIENT_ID',
		},
		facebook: {
			clientId: 'YOUR_FACEBOOK_CLIENT_ID',
		},
		twitch: {
			clientId: 'YOUR_TWITCH_CLIENT_ID',
		},
	},
});

When the standard:connect feature is called, the Enoki SDK will open a pop-up window to handle the OAuth flow. Once the Oauth flow has completed, the wallet will now be connected, and can be used to sign transactions or personal messages.

React integration

Create the dapp-kit instance and register Enoki wallets for its supported networks. Wrap your app in DAppKitProvider so wallet hooks use that instance.

import { createDAppKit, DAppKitProvider } from '@mysten/dapp-kit-react';
import { registerEnokiWallets } from '@mysten/enoki';
import { SuiGrpcClient } from '@mysten/sui/grpc';

const clients = {
	testnet: new SuiGrpcClient({
		baseUrl: 'https://fullnode.testnet.sui.io:443',
		network: 'testnet',
	}),
	mainnet: new SuiGrpcClient({
		baseUrl: 'https://fullnode.mainnet.sui.io:443',
		network: 'mainnet',
	}),
};

const dAppKit = createDAppKit({
	networks: ['testnet', 'mainnet'] as const,
	defaultNetwork: 'testnet',
	createClient: (network) => clients[network],
});

registerEnokiWallets({
	apiKey: 'YOUR_PUBLIC_ENOKI_API_KEY',
	clients: Object.values(clients),
	getCurrentNetwork: () => dAppKit.stores.$currentNetwork.get(),
	providers: {
		google: { clientId: 'YOUR_GOOGLE_CLIENT_ID' },
		facebook: { clientId: 'YOUR_FACEBOOK_CLIENT_ID' },
		twitch: { clientId: 'YOUR_TWITCH_CLIENT_ID' },
	},
});

function App() {
	return (
		<DAppKitProvider dAppKit={dAppKit}>
			<YourApp />
		</DAppKitProvider>
	);
}