From 19f61906d3075391efb32c17c99c2cba1f7a3858 Mon Sep 17 00:00:00 2001 From: fragosti Date: Wed, 10 Oct 2018 18:27:06 -0700 Subject: feat: Move over features from zrx-buyer --- packages/instant/src/components/buy_button.tsx | 59 +++++++++++++++++++++----- 1 file changed, 48 insertions(+), 11 deletions(-) (limited to 'packages/instant/src/components/buy_button.tsx') diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx index 5a32b9575..097b8e547 100644 --- a/packages/instant/src/components/buy_button.tsx +++ b/packages/instant/src/components/buy_button.tsx @@ -1,19 +1,56 @@ +import { BuyQuote } from '@0xproject/asset-buyer'; +import * as _ from 'lodash'; import * as React from 'react'; import { ColorOption } from '../style/theme'; +import { assetBuyer } from '../util/asset_buyer'; +import { web3Wrapper } from '../util/web3_wrapper'; import { Button, Container, Text } from './ui'; -export interface BuyButtonProps {} +export interface BuyButtonProps { + buyQuote?: BuyQuote; + onClick: (buyQuote: BuyQuote) => void; + onBuySuccess: (buyQuote: BuyQuote) => void; + onBuyFailure: (buyQuote: BuyQuote) => void; + text: string; +} -export const BuyButton: React.StatelessComponent = props => ( - - - -); +const boundNoop = _.noop.bind(_); -BuyButton.displayName = 'BuyButton'; +export class BuyButton extends React.Component { + public static defaultProps = { + onClick: boundNoop, + onBuySuccess: boundNoop, + onBuyFailure: boundNoop, + }; + public render(): React.ReactNode { + const shouldDisableButton = _.isUndefined(this.props.buyQuote); + return ( + + + + ); + } + private readonly _handleClick = async () => { + // The button is disabled when there is no buy quote anyway. + if (_.isUndefined(this.props.buyQuote)) { + return; + } + this.props.onClick(this.props.buyQuote); + try { + const txnHash = await assetBuyer.executeBuyQuoteAsync(this.props.buyQuote, { + // HACK: There is a calculation issue in asset-buyer. ETH is refunded anyway so just over-estimate. + ethAmount: this.props.buyQuote.worstCaseQuoteInfo.totalEthAmount.mul(2), + }); + await web3Wrapper.awaitTransactionSuccessAsync(txnHash); + } catch { + this.props.onBuyFailure(this.props.buyQuote); + } + this.props.onBuySuccess(this.props.buyQuote); + }; +} -- cgit v1.2.3 From fcf345144835cf142da2cbca544151100791700f Mon Sep 17 00:00:00 2001 From: fragosti Date: Mon, 15 Oct 2018 17:06:06 -0700 Subject: Add tnxHash to buy button callbacks --- packages/instant/src/components/buy_button.tsx | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) (limited to 'packages/instant/src/components/buy_button.tsx') diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx index 097b8e547..e9466619e 100644 --- a/packages/instant/src/components/buy_button.tsx +++ b/packages/instant/src/components/buy_button.tsx @@ -11,8 +11,8 @@ import { Button, Container, Text } from './ui'; export interface BuyButtonProps { buyQuote?: BuyQuote; onClick: (buyQuote: BuyQuote) => void; - onBuySuccess: (buyQuote: BuyQuote) => void; - onBuyFailure: (buyQuote: BuyQuote) => void; + onBuySuccess: (buyQuote: BuyQuote, txnHash: string) => void; + onBuyFailure: (buyQuote: BuyQuote, tnxHash?: string) => void; text: string; } @@ -42,15 +42,13 @@ export class BuyButton extends React.Component { return; } this.props.onClick(this.props.buyQuote); + let txnHash; try { - const txnHash = await assetBuyer.executeBuyQuoteAsync(this.props.buyQuote, { - // HACK: There is a calculation issue in asset-buyer. ETH is refunded anyway so just over-estimate. - ethAmount: this.props.buyQuote.worstCaseQuoteInfo.totalEthAmount.mul(2), - }); + txnHash = await assetBuyer.executeBuyQuoteAsync(this.props.buyQuote); await web3Wrapper.awaitTransactionSuccessAsync(txnHash); + this.props.onBuySuccess(this.props.buyQuote, txnHash); } catch { - this.props.onBuyFailure(this.props.buyQuote); + this.props.onBuyFailure(this.props.buyQuote, txnHash); } - this.props.onBuySuccess(this.props.buyQuote); }; } -- cgit v1.2.3 From ac3bfdfe5ffc4fc49b88fbad062e1d562987e728 Mon Sep 17 00:00:00 2001 From: fragosti Date: Mon, 15 Oct 2018 17:06:28 -0700 Subject: Put boundNoop in a util file --- packages/instant/src/components/buy_button.tsx | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) (limited to 'packages/instant/src/components/buy_button.tsx') diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx index e9466619e..0706817c9 100644 --- a/packages/instant/src/components/buy_button.tsx +++ b/packages/instant/src/components/buy_button.tsx @@ -4,6 +4,7 @@ import * as React from 'react'; import { ColorOption } from '../style/theme'; import { assetBuyer } from '../util/asset_buyer'; +import { util } from '../util/util'; import { web3Wrapper } from '../util/web3_wrapper'; import { Button, Container, Text } from './ui'; @@ -16,13 +17,11 @@ export interface BuyButtonProps { text: string; } -const boundNoop = _.noop.bind(_); - export class BuyButton extends React.Component { public static defaultProps = { - onClick: boundNoop, - onBuySuccess: boundNoop, - onBuyFailure: boundNoop, + onClick: util.boundNoop, + onBuySuccess: util.boundNoop, + onBuyFailure: util.boundNoop, }; public render(): React.ReactNode { const shouldDisableButton = _.isUndefined(this.props.buyQuote); -- cgit v1.2.3