FrameButton

Renders a fc:frame:button.

Props

children: string: The label to show on the button
target?: string render a redirect button specifying an absolute url. For shorter urls, use the redirect prop with the redirectHandler
action?: "post" | "link" | "mint" | "tx" | "post_redirect" type of action to take, defaults to "post" if unspecified

Read the Farcaster Frames spec for detailed button types.

Usage

./app/page.tsx

import { FrameButton, FrameContainer, FrameImage } from "frames.js/next/server";
 
return function Home(){
    return <FrameContainer
        postUrl="/frames"
        state={state}
        previousFrame={previousFrame}
      >
        <FrameImage src="https://picsum.photos/seed/frames.js/1146/600" />
        <FrameButton>
          {state?.active === "1" ? "Active" : "Inactive"}
        </FrameButton>
        <FrameButton>
          {state?.active === "2" ? "Active" : "Inactive"}
        </FrameButton>
        <FrameButton action="mint" target={`eip155:7777777:0x060f3edd18c47f59bd23d063bbeb9aa4a8fec6df`}>Mint NFT</FrameButton>
        <FrameButton action="link" target={`https://www.google.com`}>External</FrameButton>
      </FrameContainer>
}