Upgrade to EIP-7702

Overview

This sample demonstrates how to use Pimlico, a bundler and paymaster service for ERC-4337 accounts, together with Openfort to enable your users to send gasless (sponsored) transactions using EIP-7702 authorization.

Complete source code for the Upgrade to EIP-7702 integration with Openfort, Pimlico, and gas sponsorship.

View Sample Code

GitHub Repository

Project Structure

7702/
├── src/
│   ├── app/
│   │   ├── api/
│   │   │   └── shield-session/    # Shield proxy endpoint
│   │   │       └── route.ts
│   │   ├── favicon.ico
│   │   ├── globals.css            # Global styles
│   │   ├── layout.tsx             # Root layout
│   │   └── page.tsx               # Main application page
│   ├── components/
│   │   ├── Providers.tsx          # Context providers
│   │   ├── ui/                    # UI components
│   │   │   ├── button.tsx
│   │   │   └── card.tsx
│   │   └── UserOperation.tsx      # User operation component
│   └── lib/
│       ├── utils.ts               # Utility functions
│       └── wagmiConfig.ts         # Wagmi configuration
├── public/                        # Static assets
├── .env.example                   # Environment template
├── package.json                   # Project dependencies
├── next.config.js                 # Next.js configuration
└── README.md                      # Project documentation

Next.js application that integrates Openfort embedded wallets with Permissionless SDK and Pimlico to enable EIP-7702 authorization and gasless transaction execution on Ethereum Sepolia testnet.

Key Features

Embedded wallet authentication via Openfort Shield
EIP-7702 authorization signing
Gasless transaction execution via Pimlico paymaster
Simple smart account creation with Permissionless SDK
Environment configuration validation

Component	Technology
Frontend	Next.js + React
Blockchain	Ethereum Sepolia
Key Libraries	`@openfort/react`, `permissionless`, `viem`, `wagmi`
Paymaster	Pimlico
Styling	Tailwind CSS

Setup Requirements

Configure environment variables
Install dependencies
Run development server

Prerequisites

Node.js 18+
npm ≥ 9
Openfort dashboard project credentials
Pimlico API key and sponsorship policy ID
Ethereum Sepolia RPC endpoint

Quick Start

Clone the repository using gitpick:

npx gitpick openfort-xyz/recipes-hub/tree/main/7702 openfort-permissionless-7702
cd openfort-permissionless-7702

Environment Configuration

Create a .env.local file with the following variables:

# Openfort Configuration
NEXT_PUBLIC_OPENFORT_PUBLISHABLE_KEY=your_openfort_publishable_key
NEXT_PUBLIC_SHIELD_PUBLISHABLE_KEY=your_shield_publishable_key
NEXT_PUBLIC_OPENFORT_POLICY_ID=your_policy_id
NEXT_PUBLIC_CREATE_ENCRYPTED_SESSION_ENDPOINT=/api/shield-session
 
# Pimlico Configuration
NEXT_PUBLIC_PIMLICO_API_KEY=your_pimlico_api_key
NEXT_PUBLIC_SPONSORSHIP_POLICY_ID=your_sponsorship_policy_id
 
# Network Configuration
NEXT_PUBLIC_SEPOLIA_RPC_URL=your_sepolia_rpc_url

Installation

npm install
# or
pnpm install

Development

npm run dev
# or
pnpm dev

Open http://localhost:3000 to view the application.

How It Works

1. Embedded Wallet Setup

The application creates an embedded wallet for users through Openfort:

<OpenfortProvider
  publishableKey={process.env.NEXT_PUBLIC_OPENFORT_PUBLISHABLE_KEY!}
  walletConfig={{
    shieldPublishableKey: process.env.NEXT_PUBLIC_SHIELD_PUBLISHABLE_KEY!,
    ethereumProviderPolicyId: process.env.NEXT_PUBLIC_OPENFORT_POLICY_ID,
    createEncryptedSessionEndpoint: process.env.NEXT_PUBLIC_CREATE_ENCRYPTED_SESSION_ENDPOINT,
    accountType: AccountTypeEnum.EOA,
  }}
  uiConfig={{
    authProviders: [
      AuthProvider.EMAIL,
      AuthProvider.GUEST,
      AuthProvider.GOOGLE,
    ],
  }}
>
  {children}
</OpenfortProvider>

2. Smart Account Creation

Using Permissionless SDK, create a simple smart account:

const simpleSmartAccount = await toSimpleSmartAccount({
  owner: walletClient,
  entryPoint: {
    address: entryPoint08Address,
    version: "0.8"
  },
  client: publicClient,
  address: walletClient.account.address
})

3. EIP-7702 Authorization

Sign the EIP-7702 authorization using Openfort's hook:

const { signAuthorization } = use7702Authorization()
 
const authorization = await signAuthorization({
  contractAddress: "0xe6Cae83BdE06E4c305530e199D7217f42808555B",
  chainId: sepolia.id,
  nonce: await publicClient.getTransactionCount({
    address: walletClient.account.address
  })
})

4. Gasless Transaction Execution

Send sponsored transactions through Pimlico:

const txnHash = await smartAccountClient.sendTransaction({
  calls: [{
    to: zeroAddress,
    data: "0x",
    value: BigInt(0)
  }],
  factory: '0x7702',
  factoryData: '0x',
  paymasterContext: {
    sponsorshipPolicyId: process.env.NEXT_PUBLIC_SPONSORSHIP_POLICY_ID
  },
  authorization
})

What is EIP-7702?

EIP-7702 is an Ethereum Improvement Proposal that allows Externally Owned Accounts (EOAs) to temporarily behave like smart contract accounts. This enables regular wallets to access smart account features like:

Gasless transactions
Batch operations
Custom transaction logic
Enhanced security features

Integration Details

Pimlico Setup

Sign up for a Pimlico account
Generate an API key
Create a sponsorship policy for Ethereum Sepolia
Configure the policy ID in your environment variables

Openfort Configuration

Create an Openfort project in the dashboard
Set up Shield for embedded wallets
Create a gas policy (optional for EOA sponsorship)
Configure authentication providers