Frog.transaction Response

The response returned from the .transaction handler.

There are three types of responses:

Send Transaction (c.send): Convinience method to send a transaction.
Contract Transaction (c.contract): Convinience method to invoke a contract function (with inferred types & automatic encoding).
Raw Transaction (c.res): Low-level method to send raw transaction (mimics the Transaction Spec API).

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    value: parseEther('1'),
  })
})
 
app.transaction('/mint', (c) => {
  return c.contract({
    abi,
    chainId: 'eip155:10',
    functionName: 'mint',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
  })
})
 
app.transaction('/raw-send', (c) => {
  return c.res({
    chainId: 'eip155:10',
    method: 'eth_sendTransaction',
    params: {
      to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
      value: 1n,
    },
  })
})

Frog also supports Response objects as a return value of the .transaction handler. Useful for returning error responses.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return new Response('dang', { status: 400 })
})

Send Transaction (`c.send`)

chainId

Type: "eip155:${number}"

A CAIP-2 Chain ID to identify the transaction network.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    value: parseEther('1')
  }) 
})

gas (optional)

Type: BigInt

Gas limit of the transaction to send.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    gas: 100_000n,
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    value: parseEther('1'),
  }) 
})

to

Type: Address

Transaction recipient.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    value: parseEther('1')
  }) 
})

value

Type: Bigint

Value (in wei) to send with the transaction.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    value: parseEther('1')
  }) 
})

abi (optional)

Type: Abi

The ABI of the contract.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    abi,
  }) 
})

attribution (optional)

Type: boolean
Default: false

Includes client calldata suffix

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    abi, 
    attribution: true,
  }) 
})

data (optional)

Type: Hex

Calldata to send with the transaction

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/send-ether', (c) => {
  return c.send({ 
    chainId: 'eip155:10',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    data: '0xdeadbeef',
  }) 
})

Contract Transaction (`c.contract`)

abi

Type: Abi

The ABI of the contract.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10', 
    functionName: 'mint', 
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
  }) 
})

chainId

Type: "eip155:${number}"

A CAIP-2 Chain ID to identify the transaction network.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10',
    functionName: 'mint', 
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
  }) 
})

functionName

Type: string

Function to invoke on the contract.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10',
    functionName: 'mint',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
  }) 
})

gas (optional)

Type: Bigint

Gas limit of the transaction to send.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10',
    gas: 100_000n,
    functionName: 'mint',
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
  }) 
})

args

Type: unknown

Args to pass to the contract function.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10',
    functionName: 'mint',
    args: [69420n],
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
  }) 
})

to

Type: Address

The address of the contract.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10',
    functionName: 'mint',
    args: [69420n],
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
  }) 
})

attribution (optional)

Type: boolean
Default: false

Includes client calldata suffix

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi, 
    chainId: 'eip155:10', 
    functionName: 'mint', 
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
    attribution: true,
  }) 
})

value (optional)

Type: Bigint

Value to send with the transaction.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/mint', (c) => {
  return c.contract({ 
    abi,
    chainId: 'eip155:10',
    functionName: 'mint',
    args: [69420n],
    to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
    value: parseEther('1'),
  }) 
})

Raw Transaction (`c.res`)

chainId

Type: "eip155:${number}"

A CAIP-2 Chain ID to identify the transaction network.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/raw-send', (c) => {
  return c.res({ 
    chainId: 'eip155:10',
    method: 'eth_sendTransaction', 
    params: { 
      to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
      value: 1n, 
    }, 
  }) 
})

method

Type: "eth_sendTransaction"

A method ID to identify the type of transaction request.

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/raw-send', (c) => {
  return c.res({ 
    chainId: 'eip155:10',
    method: 'eth_sendTransaction',
    params: { 
      to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
      value: 1n, 
    }, 
  }) 
})

params

Type: EthSendTransactionParameters

Transaction parameters

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/raw-send', (c) => {
  return c.res({ 
    chainId: 'eip155:10',
    method: 'eth_sendTransaction',
    params: {
      to: '0xd2135CfB216b74109775236E36d4b433F1DF507B',
      value: 1n,
    },
  }) 
})

attribution (optional)

Type: boolean
Default: false

Includes client calldata suffix

import { Frog, parseEther } from 'frog'
 
export const app = new Frog({ title: 'Frog Frame' })
 
app.transaction('/raw-send', (c) => {
  return c.res({ 
    chainId: 'eip155:10',
    method: 'eth_sendTransaction',
    params: { 
      to: '0xd2135CfB216b74109775236E36d4b433F1DF507B', 
      value: 1n,
    }, 
    attribution: true,
  }) 
})

Send Transaction (c.send)

chainId

gas (optional)

to

value

abi (optional)

attribution (optional)

data (optional)

Contract Transaction (c.contract)

abi

chainId

functionName

gas (optional)

args

to

attribution (optional)

value (optional)

Raw Transaction (c.res)

chainId

method

params

attribution (optional)

Send Transaction (`c.send`)

Contract Transaction (`c.contract`)

Raw Transaction (`c.res`)