​
Introduction

Safe Smart Accounts is a product by Safe (formerly Gnosis Safe) that enables the creation of ERC-4337-compatible smart accounts for your users. This integration allows you to leverage the power of Account Abstraction and other Safe features within your Capsule-powered application.

Safe Smart Accounts use the user’s Externally Owned Account (EOA) as the smart account’s signer. This builds upon the robust smart contract infrastructure that powers the widely-used Safe wallet.

​
Understanding EOAs and Smart Accounts

In this integration:

  • The user’s EOA (from Capsule) serves as the signer for their smart wallet (from Safe).
  • The smart wallet (Safe) holds all assets and submits transactions to the network.
  • The signer (Capsule) is responsible for producing signatures and initiating transaction flows.

​
Integration Steps

To create Safe smart accounts for your users with Capsule, follow these steps:

1

Install Dependencies

First, install the necessary dependencies:

2

Import Required Modules

Import the necessary modules in your project:

import { createCapsuleViemClient } from '@usecapsule/viem-v2-integration';
import { http, createPublicClient } from 'viem';
import { sepolia } from 'viem/chains';
import Safe, { EthersAdapter } from '@safe-global/protocol-kit';
import { SafeAccountConfig } from '@safe-global/safe-core-sdk-types';
3

Initialize Capsule VIEM Client

Set up the Capsule VIEM client:

const capsuleViemClient = createCapsuleViemClient(capsule, {
  chain: sepolia, // Replace with your desired chain
  transport: http('https://rpc.sepolia.org'), // Replace with your RPC URL
});
4

Create Safe Account Configuration

Define the configuration for the Safe account:

const safeAccountConfig: SafeAccountConfig = {
  owners: [await capsuleViemClient.account.address],
  threshold: 1,
};
5

Initialize Safe SDK

Create an instance of the Safe SDK:

const ethAdapter = new EthersAdapter({
  ethers: capsuleViemClient,
  signerOrProvider: capsuleViemClient.account,
});

const safeSdk = await Safe.create({ ethAdapter, safeAccountConfig });
6

Deploy Safe Smart Account

Deploy the Safe smart account:

const safeAddress = await safeSdk.getAddress();
const safeTransaction = await safeSdk.createTransaction({ safeTransactionData: [] });
const safeTxHash = await safeSdk.getTransactionHash(safeTransaction);
const senderSignature = await safeSdk.signTransactionHash(safeTxHash);
await safeSdk.executeTransaction(safeTransaction, senderSignature);
7

Interact with the Safe Smart Account

Now you can interact with the Safe smart account using the Capsule VIEM client:

// Example: Send a transaction through the Safe smart account
const transaction = await capsuleViemClient.sendTransaction({
  account: safeAddress,
  to: '0x...',  // Recipient address
  value: 1000000000000000000n,  // 1 ETH in wei
});

console.log('Transaction hash:', transaction);

​
Conclusion

By integrating Safe Smart Accounts with Capsule, you’ve enhanced your application with Account Abstraction capabilities. This setup allows for more flexible transaction handling, improved security, and advanced features like batched transactions and gas sponsorship.

Consider storing the user’s smart account address in your application’s state or database for easy access in future sessions.

For more advanced usage and detailed API references, refer to the Safe documentation.

Was this page helpful?

PimlicoNext.js