Applied Use Cases : Morpho Demo

Integrate crypto-backed loans into your app using Gelato’s Smart Wallet SDK and Morpho’s lending protocol. This guide walks you through setting up embedded wallet onboarding and implementing both the Supply/Earn and Borrow flows.

This guide assumes you're using React + TypeScript.

---

Smart Wallet Onboarding Setup

Before users can supply or borrow assets, they must onboard into a Smart Wallet via a frictionless embedded flow. Powered by Gelato’s SDK and Dynamic, users can create smart accounts using just their email, social login, or passkeys — no browser extensions or seed phrases needed.

Key Features of Embedded Wallets

• EIP-7702 & ERC-4337 compliant

• Supports gasless transactions (sponsored execution)

• Runs across 50+ EVM chains

• Session-based login — no need to reconnect every time

Code Snippet

Embed the following setup within your app to configure the provider:

<GelatoSmartWalletContextProvider
  settings={{
    scw: {
      type: "gelato",
    },
    apiKey: process.env.NEXT_PUBLIC_GELATO_API_KEY as string,
    waas: dynamic(
      process.env.NEXT_PUBLIC_MORPHO_DYNAMIC_ENVIRONMENT_ID as string
    ),
    wagmi: wagmi({
      chains: [baseSepolia],
      transports: {
        [baseSepolia.id]: http(),
      },
    }),
  }}
>
  <QueryClientProvider client={queryClient}>
    <ActivityLogProvider>
      <RouteGuard>
        {children}
        <Toaster />
      </RouteGuard>
    </ActivityLogProvider>
  </QueryClientProvider>
</GelatoSmartWalletContextProvider>

This context enables smart wallet access throughout your app, setting up:

• Wallet creation and session

• Transaction preparation and sending

• Provider availability across your components

const { gelato: { client }, logout} = useGelatoSmartWalletProviderContext();

---

Part 1: Supply & Earn

Allow users to supply assets (e.g., USDC) and earn yield in Morpho’s vaults — fully onchain, without user signatures or gas fees.

Flow Overview

1. Approve vault to spend USDC

2. Deposit USDC to Morpho vault

3. Optionally, record stats to external tracking contract

Code Snippet

const calls = [
  {
    to: USDC_ADDRESS,
    data: encodeFunctionData({
      abi: tokenABI,
      functionName: "approve",
      args: [MORPHO_VAULT_ADDRESS, parseUnits(amount, 6)],
    }),
  },
  {
    to: MORPHO_VAULT_ADDRESS,
    data: encodeFunctionData({
      abi: morphoVaultABI,
      functionName: "deposit",
      args: [parseUnits(amount, 6), smartWallet.address],
    }),
  },
  {
    to: VAULT_STATS_ADDRESS,
    data: encodeFunctionData({
      abi: vaultStatsABI,
      functionName: "deposit",
      args: [parseUnits(amount, 6), userAssets, totalAssets],
    }),
  },
];

const response = await smartWalletClient.execute({
  payment: sponsored(GELATO_API_KEY),
  calls,
});

console.log("userOp Hash", response.id);
const txHash = await response.wait();

Users never sign a transaction or pay gas. All logic executes onchain using their smart account.

---

Part 2: Borrow

Let users borrow stablecoins (like USDC) using crypto collateral (cbBTC) — trustless, non-custodial, and instant.

Flow Overview

1. Approve Morpho to move collateral

2. Supply collateral to Morpho

3. Borrow USDC

Code Snippet

const approveCall = {
  to: COLLATERAL_TOKEN_ADDRESS,
  data: encodeFunctionData({
    abi: tokenABI,
    functionName: "approve",
    args: [MORPHO_MARKET_ADDRESS, collateralAmount],
  }),
};

const supplyCollateralCall = {
  to: MORPHO_MARKET_ADDRESS,
  data: encodeFunctionData({
    abi: morphoABI,
    functionName: "supplyCollateral",
    args: [marketParams, collateralAmount, smartWallet.address, "0x"],
  }),
};

const borrowCall = {
  to: MORPHO_MARKET_ADDRESS,
  data: encodeFunctionData({
    abi: morphoABI,
    functionName: "borrow",
    args: [
      marketParams,
      borrowAmount,
      BigInt(0),
      smartWallet.address,
      smartWallet.address,
    ],
  }),
};

const response = await smartWalletClient.execute({
  payment: sponsored(GELATO_API_KEY),
  calls: [approveCall, supplyCollateralCall, borrowCall]
});

console.log("userOp Hash", response.id);
const txHash = await response.wait();

---

Summary

Feature	Available Now
Smart wallet onboarding (social/email)	Yes
Embedded supply to Morpho vaults	Yes
Embedded borrow against crypto	Yes
Gasless transactions via Gelato	Yes
Fully onchain, no custody	Yes

---

What You Can Build

Using these flows, your app can now offer:

• Embedded lending dashboards

• Crypto credit lines

• Non-custodial stablecoin loans

• Yield vault integrations

• Composable DeFi automations

You get the power of Morpho and the abstraction of Gelato — without the overhead of building wallets, managing custody, or dealing with onchain UX friction.