Skip to main content

Safe (Gnosis)

Prompt users to connect to your app with their Safe wallet.

To connect to a safe wallet, a personal wallet must first be connected.

Usage​

import { CoinbaseWallet, SafeWallet } from "@thirdweb-dev/wallets";
import { Ethereum } from "@thirdweb-dev/chains";

// First, connect the personal wallet
const personalWallet = new CoinbaseWallet();
await personalWallet.connect();

// Then, connect the Safe wallet
const wallet = new SafeWallet();
await wallet.connect({
  personalWallet: personalWallet,
  chain: Ethereum,
  safeAddress: "{{contract_address}}",
});

Configuration​

Optionally, provide a configuration object when instantiating the SafeWallet class.

clientId (recommended)

Provide clientId to use the thirdweb RPCs for given chains

You can create a client ID for your application from thirdweb dashboard.

chains

Provide an array of chains you want to support.

Must be an array of Chain objects, from the @thirdweb-dev/chains package.

Defaults to our default chains.

import { SafeWallet } from "@thirdweb-dev/wallets";
import { Ethereum } from "@thirdweb-dev/chains";

const walletWithOptions = new SafeWallet(
  {
    chains: [Ethereum],
  },
);
dappMetadata

Information about your app that the wallet will display when your app tries to connect to it.

Must be an object containing name, url, description and logoUrl properties.

import { SafeWallet } from "@thirdweb-dev/wallets";

const walletWithOptions = new SafeWallet({
  dappMetadata: {
    name: "thirdweb powered dApp",
    url: "https://thirdweb.com",
    description: "thirdweb powered dApp",
    logoUrl: "https://thirdweb.com/favicon.ico",
  },
});
walletStorage

Some wallets need to store data in persistent storage. This is the storage that will be used for that.

Must be an object conforming to the AsyncStorage interface:

export interface AsyncStorage {
  getItem(key: string): Promise<string | null>;
  setItem(key: string, value: string): Promise<void>;
  removeItem(key: string): Promise<void>;
}

Example:

import { SafeWallet } from "@thirdweb-dev/wallets";

const walletWithOptions = new SafeWallet(
  {
    walletStorage: {
      getItem: (key) => {
        // Implement your own storage logic here
      },
      removeItem: (key) => {
        // Implement your own storage logic here
      },
      setItem: (key, value) => {
        // Implement your own storage logic here
      },
    },
  },
);
walletId

An ID for the wallet used to store the wallet in the walletStorage.

import { SafeWallet } from "@thirdweb-dev/wallets";

const walletWithOptions = new SafeWallet(
  {
    walletId: "wallet-id",
  },
);

Methods​

Inherits all the public methods from the AbstractClientWallet class.

connect​

Prompt the user to connect their wallet to your app.

Note: A personal wallet must be connected before connecting to a Safe wallet.

import { CoinbaseWallet, SafeWallet } from "@thirdweb-dev/wallets";
import { Ethereum } from "@thirdweb-dev/chains";

// First, connect the personal wallet
const personalWallet = new CoinbaseWallet();
await personalWallet.connect();

// Then, connect the Safe wallet
const wallet = new SafeWallet();
await wallet.connect({
  personalWallet: personalWallet, // Wallet that can sign transactions on the Safe
  chain: Ethereum, // Chain that the Safe is on
  safeAddress: "{{contract_address}}", // Smart contract address of the Safe
});
Configuration

personalWallet​

The instance of a personal wallet that can sign transactions on the Safe.

Must be of type EVMWallet such as CoinbaseWallet or MetamaskWallet.

chain​

The chain that the Safe smart contract is deployed to.

Must be a Chain object, from the @thirdweb-dev/chains package.

safeAddress​

Smart contract address of the Safe wallet.

Must be a string.

Return Value​

Returns a string containing the wallet address, or throws and error if connection failed.

string;