Frog.composerAction

Import

import { Frog } from 'frog'

Usage

import { Frog } from 'frog'
 
const app = new Frog({ title: 'Frog Frame' })
 
app.composerAction(
  '/',
  (c) => {
    return c.res({
      title: 'My Composer Action',
      url: 'https://example.com'
    })
  },
  {
    name: 'composerAction',
    description: 'Cool Composer Action',
    icon: 'image',
    imageUrl: 'https://frog.fm/logo-light.svg',
  }
)

Parameters

path

Type: string

Path of the route.

import { Frog } from 'frog'
 
const app = new Frog({ title: 'Frog Frame' })
 
app.composerAction(
  '/',
  (c) => {
    return c.res({
      title: 'My Composer Action',
      url: 'https://example.com'
    })
  },
  {
    name: 'composerAction',
    description: 'Cool Composer Action',
    icon: 'image',
    imageUrl: 'https://frog.fm/logo-light.svg',
  }
)

handler

Type: (c: Context) => ComposerActionResponse

Handler function for the route.

import { Frog } from 'frog'
 
const app = new Frog({ title: 'Frog Frame' })
 
app.composerAction(
  '/',
  (c) => {
    return c.res({
      title: 'My Composer Action',
      url: 'https://example.com'
    })
  },
  {
    name: 'composerAction',
    description: 'Cool Composer Action',
    icon: 'image',
    imageUrl: 'https://frog.fm/logo-light.svg',
  }
)

options

Type: RouteOptions<'composerAction'>

Options for Composer Action

import { Frog } from 'frog'
 
const app = new Frog({ title: 'Frog Frame' })
 
app.composerAction(
  '/',
  (c) => {
    return c.res({
      title: 'My Composer Action',
      url: 'https://example.com'
    })
  },
  {
    name: 'composerAction',
    description: 'Cool Composer Action',
    icon: 'image',
    imageUrl: 'https://frog.fm/logo-light.svg',
  }
)

Context Parameter

See the Composer Action Context API.

Action Response

See the Composer Action Response API.