UNPKG

@moveflow/widget

Version:

> ⚠️ **This is a testnet version** of the MoveFlow Checkout Widget. It is intended for development and testing purposes only. Do not use for mainnet payments.

36 lines (35 loc) 1.86 kB
"use client"; import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import { useSubscription } from "../hooks/useSubscription"; import { useEffect } from "react"; function SubscriptionButton(props) { const ETHEREUM_CONTRACT = "0xbDf6Fb9AF46712ebf58B9CB0c23B4a881BF58099"; const coinAddress = "0xEAB439707cA5F8e4e47c697629E77aE26842cbba"; const decimal = 18; const { payment, primaryColor, fontFamily, borderRadius, chainName } = props; const { state, resetState, handleCreateSubscription } = useSubscription(ETHEREUM_CONTRACT, coinAddress, decimal); useEffect(() => { resetState(); }, [payment]); return (_jsxs("div", { children: [state.networkError && (_jsx("div", { style: { color: "red", marginBottom: "10px" }, children: state.networkError })), _jsx("button", { onClick: () => handleCreateSubscription(payment, chainName), disabled: state.isCreatingSubscription || state.tokensApproved || state.subscriptionCreated, style: { width: "100%", borderRadius: `${borderRadius}px`, background: primaryColor, color: "white", fontFamily: fontFamily, padding: "10px", cursor: state.isCreatingSubscription || state.tokensApproved || state.subscriptionCreated ? "not-allowed" : "pointer", marginTop: "10px", }, children: state.isCreatingSubscription ? "Creating Subscription..." : state.subscriptionCreated ? "Subscription Created Successfully" : "Create Subscription" })] })); } export default SubscriptionButton;