Lens Blocks are currently in pre-alpha and not ready for use!

Tip Dialog Component

A dialog component for sending tips to Lens Posts and Accounts, with support for multiple tokens.

A Lens tip dialog component
Open in

This will create a post tip for this post

Installation

Usage

The tip dialog can be used to create tips for Posts and Accounts.

import LensTipDialog, { TipDialogRef } from "@/components/lens-tip-dialog";
import { useTipPostAction } from "@/hooks/use-tip-post-action";
import { postId, useSessionClient } from "@lens-protocol/react";
import { useWalletClient } from "wagmi";
const { data: sessionClient } = useSessionClient();
const { data: walletClient } = useWalletClient();
const { execute } = useTipPostAction();

const post = postId("SOME_POST_ID");
const tipDialog = useRef<TipDialogRef>(null);
const handleCreateTip = async (
  source: PaymentSource,
  amount: string,
  tokenAddress: string,
): Promise<TxHash> => {
  if (!sessionClient || !walletClient) {
    // Errors thrown will be caught by LensTipDialog and passed to onError
    throw new Error("A valid session and wallet client are required");
  }
  const res = await execute({
    post,
    source,
    amount,
    tokenAddress,
    sessionClient,
    walletClient
  });
  if (res.isErr()) {
    throw res.error;
  }
  return res.value;
};
<>
  <button onClick={() => tipDialog?.current?.open()}>
    Tip me!
  </button>
  <LensTipDialog ref={tipDialog} createTip={handleCreateTip} />       
</>