From 2a1c2a55eda0f3d279aa1145b6157892d03001ae Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 25 Oct 2018 11:43:53 -0700 Subject: feat: supply render options from URL --- packages/instant/src/components/zero_ex_instant.tsx | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index ffa5a8250..0fe494726 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -1,5 +1,6 @@ import { AssetBuyer } from '@0x/asset-buyer'; -import { ObjectMap } from '@0x/types'; +import { ObjectMap, SignedOrder } from '@0x/types'; +import * as _ from 'lodash'; import * as React from 'react'; import { Provider } from 'react-redux'; @@ -21,8 +22,7 @@ export type ZeroExInstantProps = ZeroExInstantRequiredProps & Partial { }; const { network } = optionalPropsWithDefaults; // TODO: Provider needs to not be hard-coded to injected web3. - const assetBuyer = AssetBuyer.getAssetBuyerForStandardRelayerAPIUrl(getProvider(), props.liquiditySource, { + const provider = getProvider(); + const assetBuyerOptions = { networkId: network, - }); + }; + let assetBuyer; + if (_.isString(props.liquiditySource)) { + assetBuyer = AssetBuyer.getAssetBuyerForStandardRelayerAPIUrl( + provider, + props.liquiditySource, + assetBuyerOptions, + ); + } else { + assetBuyer = AssetBuyer.getAssetBuyerForProvidedOrders(provider, props.liquiditySource, assetBuyerOptions); + } const completeAssetMetaDataMap = { ...props.additionalAssetMetaDataMap, ...state.assetMetaDataMap, -- cgit v1.2.3 From 1a10715fcb21a89aa47cade6d796eeb677f9741d Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 25 Oct 2018 14:19:40 -0700 Subject: feat: flash an error if the wrong network is detected --- packages/instant/src/components/sliding_error.tsx | 16 +++++++++------- packages/instant/src/components/zero_ex_instant.tsx | 19 ++++++++++++++++++- 2 files changed, 27 insertions(+), 8 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/sliding_error.tsx b/packages/instant/src/components/sliding_error.tsx index 3865a8797..2b55597ec 100644 --- a/packages/instant/src/components/sliding_error.tsx +++ b/packages/instant/src/components/sliding_error.tsx @@ -4,7 +4,7 @@ import { ColorOption } from '../style/theme'; import { SlideDownAnimation, SlideUpAnimation } from './animations/slide_animations'; -import { Container, Text } from './ui'; +import { Container, Flex, Text } from './ui'; export interface ErrorProps { icon: string; @@ -20,12 +20,14 @@ export const Error: React.StatelessComponent = props => ( borderRadius="6px" marginBottom="10px" > - - {props.icon} - - - {props.message} - + + + {props.icon} + + + {props.message} + + ); diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index 0fe494726..63d944654 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -11,7 +11,9 @@ import { store, Store } from '../redux/store'; import { fonts } from '../style/fonts'; import { AssetMetaData, Network } from '../types'; import { assetUtils } from '../util/asset'; +import { errorUtil } from '../util/error'; import { getProvider } from '../util/provider'; +import { web3Wrapper } from '../util/web3_wrapper'; import { ZeroExInstantContainer } from './zero_ex_instant_container'; @@ -69,9 +71,15 @@ export class ZeroExInstant extends React.Component { } constructor(props: ZeroExInstantProps) { super(props); - this._store = store.create(ZeroExInstant._mergeInitialStateWithProps(this.props, INITIAL_STATE)); + const initialAppState = ZeroExInstant._mergeInitialStateWithProps(this.props, INITIAL_STATE); + this._store = store.create(initialAppState); + } + + public componentDidMount(): void { // tslint:disable-next-line:no-floating-promises asyncData.fetchAndDispatchToStore(this._store); + // tslint:disable-next-line:no-floating-promises + this._flashErrorIfWrongNetwork(this._store.getState().network); } public render(): React.ReactNode { @@ -83,4 +91,13 @@ export class ZeroExInstant extends React.Component { ); } + + private readonly _flashErrorIfWrongNetwork = async (network: Network): Promise => { + const msToShowError = 30000; // 30 seconds + const networkOfProvider = await web3Wrapper.getNetworkIdAsync(); + if (network !== networkOfProvider) { + const errorMessage = `Wrong network detected. Try switching to ${Network[network]}.`; + errorUtil.errorFlasher.flashNewError(this._store.dispatch, errorMessage, msToShowError); + } + }; } -- cgit v1.2.3 From 23b165669202c1bdf4bd7d7e509b9bfe06e3ef8a Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 25 Oct 2018 14:37:34 -0700 Subject: feat: support defaultAssetBuyAmount setting --- packages/instant/src/components/zero_ex_instant.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index 63d944654..9018c9427 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -1,5 +1,6 @@ import { AssetBuyer } from '@0x/asset-buyer'; import { ObjectMap, SignedOrder } from '@0x/types'; +import { BigNumber } from '@0x/utils'; import * as _ from 'lodash'; import * as React from 'react'; import { Provider } from 'react-redux'; @@ -28,6 +29,7 @@ export interface ZeroExInstantRequiredProps { } export interface ZeroExInstantOptionalProps { + defaultAssetBuyAmount?: number; additionalAssetMetaDataMap: ObjectMap; network: Network; } @@ -35,12 +37,7 @@ export interface ZeroExInstantOptionalProps { export class ZeroExInstant extends React.Component { private readonly _store: Store; private static _mergeInitialStateWithProps(props: ZeroExInstantProps, state: State = INITIAL_STATE): State { - // Create merged object such that properties in props override default settings - const optionalPropsWithDefaults: ZeroExInstantOptionalProps = { - additionalAssetMetaDataMap: props.additionalAssetMetaDataMap || {}, - network: props.network || state.network, - }; - const { network } = optionalPropsWithDefaults; + const network = props.network || state.network; // TODO: Provider needs to not be hard-coded to injected web3. const provider = getProvider(); const assetBuyerOptions = { @@ -65,6 +62,9 @@ export class ZeroExInstant extends React.Component { assetBuyer, network, selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, network), + selectedAssetAmount: _.isUndefined(props.defaultAssetBuyAmount) + ? state.selectedAssetAmount + : new BigNumber(props.defaultAssetBuyAmount), assetMetaDataMap: completeAssetMetaDataMap, }; return storeStateFromProps; -- cgit v1.2.3 From a2d09a68b0d6d20359916251e0cc795fb600360e Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 25 Oct 2018 15:03:30 -0700 Subject: chore: add to asset-buyer changelog.json --- packages/instant/src/components/zero_ex_instant.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index 9018c9427..bf7cc9de5 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -79,7 +79,7 @@ export class ZeroExInstant extends React.Component { // tslint:disable-next-line:no-floating-promises asyncData.fetchAndDispatchToStore(this._store); // tslint:disable-next-line:no-floating-promises - this._flashErrorIfWrongNetwork(this._store.getState().network); + this._flashErrorIfWrongNetwork(); } public render(): React.ReactNode { @@ -92,8 +92,9 @@ export class ZeroExInstant extends React.Component { ); } - private readonly _flashErrorIfWrongNetwork = async (network: Network): Promise => { + private readonly _flashErrorIfWrongNetwork = async (): Promise => { const msToShowError = 30000; // 30 seconds + const network = this._store.getState().network; const networkOfProvider = await web3Wrapper.getNetworkIdAsync(); if (network !== networkOfProvider) { const errorMessage = `Wrong network detected. Try switching to ${Network[network]}.`; -- cgit v1.2.3 From 948d62200a23b4da59278f976e9757cfc3c9234e Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 25 Oct 2018 18:53:16 -0700 Subject: feat: change network to networkId --- packages/instant/src/components/zero_ex_instant.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index bf7cc9de5..8454de43c 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -31,17 +31,17 @@ export interface ZeroExInstantRequiredProps { export interface ZeroExInstantOptionalProps { defaultAssetBuyAmount?: number; additionalAssetMetaDataMap: ObjectMap; - network: Network; + networkId: Network; } export class ZeroExInstant extends React.Component { private readonly _store: Store; private static _mergeInitialStateWithProps(props: ZeroExInstantProps, state: State = INITIAL_STATE): State { - const network = props.network || state.network; + const networkId = props.networkId || state.network; // TODO: Provider needs to not be hard-coded to injected web3. const provider = getProvider(); const assetBuyerOptions = { - networkId: network, + networkId, }; let assetBuyer; if (_.isString(props.liquiditySource)) { @@ -60,8 +60,8 @@ export class ZeroExInstant extends React.Component { const storeStateFromProps: State = { ...state, assetBuyer, - network, - selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, network), + network: networkId, + selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, networkId), selectedAssetAmount: _.isUndefined(props.defaultAssetBuyAmount) ? state.selectedAssetAmount : new BigNumber(props.defaultAssetBuyAmount), -- cgit v1.2.3 From 951a5271e15cebb010281de3b8cbfb3972ecec83 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 26 Oct 2018 11:22:14 -0700 Subject: fix: justify error message left --- packages/instant/src/components/sliding_error.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/sliding_error.tsx b/packages/instant/src/components/sliding_error.tsx index 2b55597ec..cc9abb7dd 100644 --- a/packages/instant/src/components/sliding_error.tsx +++ b/packages/instant/src/components/sliding_error.tsx @@ -20,7 +20,7 @@ export const Error: React.StatelessComponent = props => ( borderRadius="6px" marginBottom="10px" > - + {props.icon} -- cgit v1.2.3 From 51da5311b54733540f44f938a0c953bb4ae42052 Mon Sep 17 00:00:00 2001 From: fragosti Date: Fri, 26 Oct 2018 11:47:46 -0700 Subject: fix: init BigNumberInput not BigNumber when initializing state --- packages/instant/src/components/zero_ex_instant.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index 8454de43c..b080f0bad 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -1,6 +1,5 @@ import { AssetBuyer } from '@0x/asset-buyer'; import { ObjectMap, SignedOrder } from '@0x/types'; -import { BigNumber } from '@0x/utils'; import * as _ from 'lodash'; import * as React from 'react'; import { Provider } from 'react-redux'; @@ -12,6 +11,7 @@ import { store, Store } from '../redux/store'; import { fonts } from '../style/fonts'; import { AssetMetaData, Network } from '../types'; import { assetUtils } from '../util/asset'; +import { BigNumberInput } from '../util/big_number_input'; import { errorUtil } from '../util/error'; import { getProvider } from '../util/provider'; import { web3Wrapper } from '../util/web3_wrapper'; @@ -64,7 +64,7 @@ export class ZeroExInstant extends React.Component { selectedAsset: assetUtils.createAssetFromAssetData(props.assetData, completeAssetMetaDataMap, networkId), selectedAssetAmount: _.isUndefined(props.defaultAssetBuyAmount) ? state.selectedAssetAmount - : new BigNumber(props.defaultAssetBuyAmount), + : new BigNumberInput(props.defaultAssetBuyAmount), assetMetaDataMap: completeAssetMetaDataMap, }; return storeStateFromProps; -- cgit v1.2.3 From 4f5ab1a72d33dc6a7516d7b1d51f1aa15752a6b8 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Fri, 26 Oct 2018 15:32:04 -0700 Subject: Refactor error handling such that errorMessage lives on the top level state --- packages/instant/src/components/buy_button.tsx | 4 ++-- packages/instant/src/components/zero_ex_instant.tsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx index a70269dde..9e06604e0 100644 --- a/packages/instant/src/components/buy_button.tsx +++ b/packages/instant/src/components/buy_button.tsx @@ -13,7 +13,7 @@ export interface BuyButtonProps { buyQuote?: BuyQuote; assetBuyer?: AssetBuyer; onAwaitingSignature: (buyQuote: BuyQuote) => void; - onSignatureDenied: (buyQuote: BuyQuote, preventedError: Error) => void; + onSignatureDenied: (buyQuote: BuyQuote) => void; onBuyProcessing: (buyQuote: BuyQuote, txHash: string) => void; onBuySuccess: (buyQuote: BuyQuote, txHash: string) => void; onBuyFailure: (buyQuote: BuyQuote, txHash: string) => void; @@ -48,7 +48,7 @@ export class BuyButton extends React.Component { txHash = await assetBuyer.executeBuyQuoteAsync(buyQuote); } catch (e) { if (e instanceof Error && e.message === AssetBuyerError.SignatureRequestDenied) { - this.props.onSignatureDenied(buyQuote, e); + this.props.onSignatureDenied(buyQuote); return; } throw e; diff --git a/packages/instant/src/components/zero_ex_instant.tsx b/packages/instant/src/components/zero_ex_instant.tsx index b080f0bad..19a2d6b9b 100644 --- a/packages/instant/src/components/zero_ex_instant.tsx +++ b/packages/instant/src/components/zero_ex_instant.tsx @@ -12,7 +12,7 @@ import { fonts } from '../style/fonts'; import { AssetMetaData, Network } from '../types'; import { assetUtils } from '../util/asset'; import { BigNumberInput } from '../util/big_number_input'; -import { errorUtil } from '../util/error'; +import { errorFlasher } from '../util/error_flasher'; import { getProvider } from '../util/provider'; import { web3Wrapper } from '../util/web3_wrapper'; @@ -98,7 +98,7 @@ export class ZeroExInstant extends React.Component { const networkOfProvider = await web3Wrapper.getNetworkIdAsync(); if (network !== networkOfProvider) { const errorMessage = `Wrong network detected. Try switching to ${Network[network]}.`; - errorUtil.errorFlasher.flashNewError(this._store.dispatch, errorMessage, msToShowError); + errorFlasher.flashNewErrorMessage(this._store.dispatch, errorMessage, msToShowError); } }; } -- cgit v1.2.3 From 3f35239b27653da898218e53909982203fad6d17 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Mon, 29 Oct 2018 10:40:11 -0700 Subject: fix(instant): fix spelling error and BigNumber gte operation --- packages/instant/src/components/buy_button.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/instant/src/components') diff --git a/packages/instant/src/components/buy_button.tsx b/packages/instant/src/components/buy_button.tsx index 13c1dc88c..129aedaf3 100644 --- a/packages/instant/src/components/buy_button.tsx +++ b/packages/instant/src/components/buy_button.tsx @@ -49,8 +49,8 @@ export class BuyButton extends React.Component { this.props.onValidationPending(buyQuote); const takerAddress = await getBestAddress(); - const hasSufficentEth = await balanceUtil.hasSufficentEth(takerAddress, buyQuote, web3Wrapper); - if (!hasSufficentEth) { + const hasSufficientEth = await balanceUtil.hasSufficientEth(takerAddress, buyQuote, web3Wrapper); + if (!hasSufficientEth) { this.props.onValidationFail(buyQuote, ZeroExInstantError.InsufficientETH); return; } -- cgit v1.2.3