Skip to main content

Usage

Configure Networking and Pair clients​

Make sure that you properly configure Networking and Pair Clients first.

Initialize Web3Modal Client​

In order to initialize a client just call a configure method from the Web3Modal instance wrapper

let metadata = AppMetadata(
    name: "Example Wallet",
    description: "Wallet description",
    url: "example.wallet",
    icons: ["https://avatars.githubusercontent.com/u/37784886"],
    // Used for the Verify: to opt-out verification ignore this parameter
    verifyUrl: "verify.walletconnect.com"
)

Web3Modal.configure(
    projectId: PROJECT_ID,
    metadata: metadata
)

Don't have a project ID?

Head over to WalletConnect Cloud and create a new project now!

Get startedcloud illustration

This example will default to using following namespaces.

let methods: Set<String> = ["eth_sendTransaction", "personal_sign", "eth_signTypedData"]
let events: Set<String> = ["chainChanged", "accountsChanged"]
let blockchains: Set<Blockchain> = [Blockchain("eip155:1")!]
let namespaces: [String: ProposalNamespace] = [
    "eip155": ProposalNamespace(
        chains: blockchains,
        methods: methods,
        events: events
    )
]

let defaultSessionParams =  SessionParams(
                                requiredNamespaces: namespaces,
                                optionalNamespaces: nil,
                                sessionProperties: nil
                            )

If you want to change that you can call configure and define your own session parameters like this.

let metadata = AppMetadata(...)

let sessionParams = SessionParams(...)

Web3Modal.configure(
    projectId: PROJECT_ID,
    metadata: metadata,
    sessionParams: sessionParams
)

or you can change them later by calling Web3Modal.set(sessionParams: SessionParams(...))

Provided UI components​

Now you can use the Web3ModalButton or Web3ModalNetworkButton components. These two components reflect the state of the Web3Modal client, including the session state, account address and balance, currently selected network, and will automatically update when the state changes. More can be found in https://github.com/WalletConnect/web3modal-swift/blob/develop/Sample/Example/ContentView.swift as part of the Sample app.

Custom UI​

If you want to use custom UI you can present the modal by simply calling.

Web3Modal.present()

It will traverse the view hierarchy and try to present from top most controller. This is meant more towards SwiftUI.

Otherwise you can specify the viewController to present from.

Web3Modal.present(from: viewController)

Subscribe for Web3Modal Publishers​

The following publishers are available to subscribe:

public var sessionPublisher: AnyPublisher<[Session], Never>
public var sessionSettlePublisher: AnyPublisher<Session, Never>
public var sessionRejectionPublisher: AnyPublisher<(Session.Proposal, Reason), Never>
public var sessionDeletePublisher: AnyPublisher<(String, Reason), Never>
public var sessionResponsePublisher: AnyPublisher<Response, Never>
public var socketConnectionStatusPublisher: AnyPublisher<SocketConnectionStatus, Never>

Sign methods​

Web3Modal is internally using Sign SDK and most of its method are being exposed through Web3Modal interface.

Where to go from here​

Check the Web3Modal usage in our Sample app that is part of Web3Modal repository.