> ## Documentation Index
> Fetch the complete documentation index at: https://dynamic-docs-feat-sidebar-revamp.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# MegaEth & Dynamic (with EIP-7702)

## Enabling MegaEth

Dynamic supports MegaEth from Day 0, simply enable it in [the EVM networks section of the dashboard](https://app.dynamic.xyz/dashboard/chains-and-networks#evm) and you’re good to go! We also support 7702 by default on MegaEth in partnership with Zerodev, learn how to enable that below.

## Setup MegaEth for 7702

<Steps>
  <Step title="ZeroDev Account">
    Sign up for a free account at [https://dashboard.zerodev.app/](https://dashboard.zerodev.app/) and create a project, configure your project name and network (please use MegaEth for this example) and copy your new ZeroDev project ID.
  </Step>

  <Step title="Enable in Dynamic">
    In [the EVM section of your Dynamic Dashboard](https://app.dynamic.xyz/dashboard/chains-and-networks#evm), toggle on MegaEth and click Save.

    Now, go to [the Account Abstraction section](https://app.dynamic.xyz/dashboard/configurations#accountabstraction), enable ZeroDev and paste in your ZeroDev project id.
  </Step>

  <Step title="Choose who gets a SCW">
    On the same configuration page as the step above, you'll see there are two different types of configuration for issuing smart contract wallets (SCWs) in Dynamic - the wallet level and the user level.

    * Wallet level

    Choose whether to issue SCWs to all wallets, only to embedded wallets, or use EIP-7702. *Choose 7702 here*.

    * User level

    Choose whether to issues SCWs to all your users (existing included next time they log in), or just new users.
  </Step>

  <Step title="Choose if your users see both the signer and smart wallet">
    On the same configuration page as the 2 steps above, you'll see there is a setting for how the Dynamic SDK treats the signer and the smart wallet - only the smart wallet or both the smart wallet and signer.

    * Show Smart Wallet Only

    Only allows you to interact with the smart wallet directly.

    * Show Smart Wallet & Signer

    Treats the smart wallet and signer as separate wallets which you can switch between.
  </Step>

  <Step title="Enable Dynamic-powered embedded wallets + Email">
    Back in your Dynamic Dashboard, go to [the Embedded Wallets section](https://app.dynamic.xyz/dashboard/embedded-wallets/dynamic) and enable Dynamic-powered embedded wallets.

    Lastly, in [the Log in & User Profile section](https://app.dynamic.xyz/dashboard/log-in-user-profile), enable Email sign up (optionally, enable social sign up and configure oauth)
  </Step>

  <Step title="Install the packages in your app">
    ```bash
    npm i @dynamic-labs/ethereum @dynamic-labs/ethereum-aa @dynamic-labs/sdk-react-core
    ```
  </Step>

  <Step title="Initialize the Dynamic Context Provider">
    Pass `ZeroDevSmartWalletConnectors` along with EthereumWalletConnectors to the WalletConnectors Array of your context provider.

    ```tsx
    import { DynamicContextProvider, DynamicWidget } from '@dynamic-labs/sdk-react-core';
    import { EthereumWalletConnectors } from '@dynamic-labs/ethereum';
    import { ZeroDevSmartWalletConnectors } from '@dynamic-labs/ethereum-aa';

    const App = () => {
      return (
        <DynamicContextProvider
        settings={{
          environmentId: 'XXXX',
          walletConnectors: [
            EthereumWalletConnectors,
            ZeroDevSmartWalletConnectors
          ]
        }}
        >
          <DynamicWidget />
        </DynamicContextProvider>
      );
    };
    ```
  </Step>

  <Step title="Kernel Interaction">
    Currently to interact with the wallet, you will need to interact directly with the kernel, we will do this in a new component:

    ```typescript
    const Sign7702Transaction = () => {
      import { isZeroDevConnector } from '@dynamic-labs/ethereum-aa';
      import { primaryWallet } from '@dynamic-labs/sdk-react-core';

      if(!primaryWallet) {
        console.error('No wallet found');
        return null;
      }


      if(!isZeroDevConnector(primaryWallet.connector)) {
        console.error('Not a ZeroDev connector');
        return null;
      }

      const params = {
        withSponsorship: true,
      }

      const kernelClient =  primaryWallet.connector?.getAccountAbstractionProvider(params);

      if(!kernelClient) {
        console.error('No kernel client found');
        return null;
      }

      const userOpHash = await kernelClient.sendUserOperation({
          callData: await kernelClient.account.encodeCalls([
            {
              data: '0x',
              to: zeroAddress,
              value: BigInt(0),
            },
            {
              data: '0x',
              to: zeroAddress,
              value: BigInt(0),
            },
          ]),
        });

    }
    ```
  </Step>
</Steps>

## Full Example

```typescript
import { EthereumWalletConnectors, } from '@dynamic-labs/ethereum';
import { DynamicContextProvider, DynamicWidget, useUserWallets} from '@dynamic-labs/sdk-react-core';
import { ZeroDevSmartWalletConnectors, isZeroDevConnector } from '@dynamic-labs/ethereum-aa';
import { zeroAddress } from 'viem';
import { useState } from 'react';

function App() {
  return (
    <DynamicContextProvider
    settings={{
      environmentId: '54a5040b-cdd2-47f4-ac72-8e37dd8db1b6',
      walletConnectors: [
        EthereumWalletConnectors,
        ZeroDevSmartWalletConnectors
      ]
    }}
    >
      <DynamicWidget />
      <Sign7702Transaction/>
      </DynamicContextProvider>
  )
}


function Sign7702Transaction() {
  const { primaryWallet } = useDynamicContext();
  const [error, setError] = useState(null);
  const [txHash, setTxHash] = useState(null);
  const [isSendingTransaction, setIsSendingTransaction] = useState(false);

  if (!primaryWallet) {
    return null;
  }

  const handleSendTransaction = async () => {
    const connector = primaryWallet.connector;

    if (!connector) {
      setError('No connector found');
      return;
    }

    if (!isZeroDevConnector(connector)) {
      setError('Connector is not a ZeroDev connector');
      return;
    }

    const params = {
      withSponsorship: true,
    };
    const kernelClient = connector.getAccountAbstractionProvider(params);

    if (!kernelClient) {
      setError('No kernel client found');
      return;
    }

    try {
      setIsSendingTransaction(true);
      const userOpHash = await kernelClient.sendUserOperation({
        callData: await kernelClient.account.encodeCalls([
          {
            data: '0x',
            to: zeroAddress,
            value: BigInt(0),
          },
          {
            data: '0x',
            to: zeroAddress,
            value: BigInt(0),
          },
        ]),
      });


      const { receipt } = await kernelClient.waitForUserOperationReceipt({
        hash: userOpHash,
      });


      setTxHash(receipt.transactionHash);
      setError(null);
    } catch (err) {
      setError((err).message || 'Error sending transaction');
    } finally {
      setIsSendingTransaction(false);
    }
  };

  return (
    <>
      <div className='grid gap-12'>
        {primaryWallet && (
          <div className='grid gap-4'>
            <Button
              onClick={handleSendTransaction}
              disabled={!primaryWallet || isSendingTransaction}
              loading={isSendingTransaction}
              className='w-full'
            >
              Send Transaction
            </Button>


            {txHash && (
              <div className='p-6 bg-gray-50 rounded-lg mt-6'>
                  Transaction Hash:
                <a
                  href={`https://odyssey-explorer.ithaca.xyz/tx/${txHash}`}
                  target='_blank'
                  rel='noopener noreferrer'
                  className='block bg-gray-100 p-3 rounded hover:bg-gray-200 transition-colors text-blue-600 underline flex items-center gap-2'
                >
                  {`${txHash.slice(0, 6)}...${txHash.slice(-4)}`}
                  <span className='text-gray-500 text-sm'>
                    (View on Explorer)
                  </span>
                </a>
              </div>
            )}
          </div>
        )}


        {error && (
          <Typography variant='paragraph-3' className='text-red-500 mt-6'>
            Error: {error}
          </Typography>
        )}
      </div>
    </>
  );
}

export default App
```