Cancel Button

This button cancels the subscription of your connected user to your subscription contract. It has the following props:

style (optional): A standard CSS-in-JS style, as seen here. Because Subbi uses styled-components under the hood, this includes pseudo elements.

onError (optional): An optional function that is called if any of the components encounter an error. It is passed one argument: the error object in question.

onCancelled (optional): An optional function that is called upon a successful subscription. The first argument of the function is a basket of properties pertaining to the user, network they are connected to and the contract they are subscribing to.

subscriptionContractAddress (REQUIRED): The address for your deployed contract.

interface OnActionProps {
  user: string;
  contract: string;
  network: SupportedNetworks;

interface Props {
    style?: {
      [x: string]: string | number | {};
    } & React.CSSProperties;
    onError?: (error: any) => void | Promise<void>;
    onCancelled?: (arg0: OnActionProps) => void | Promise<void>;
    subscriptionContractAddress: string;


import { CancelButton } from "@subbi/react";

    onCancelled={() => console.log("Cancelled!")}
    onError={(error: any) => console.log(error)}
    style={{ backgroundColor: "blue" }}

Last updated