From 4b348e1e603ec45e1e4bf39533b4b204423cafa0 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 11:09:23 -0700 Subject: quoteState -> quoteRequestState --- packages/instant/src/containers/selected_asset_amount_input.ts | 6 +++--- packages/instant/src/containers/selected_asset_instant_heading.ts | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_amount_input.ts b/packages/instant/src/containers/selected_asset_amount_input.ts index 0810b093a..aca6a09d4 100644 --- a/packages/instant/src/containers/selected_asset_amount_input.ts +++ b/packages/instant/src/containers/selected_asset_amount_input.ts @@ -44,13 +44,13 @@ const updateBuyQuoteAsync = async ( const baseUnitValue = Web3Wrapper.toBaseUnitAmount(assetAmount, zrxDecimals); // mark quote as pending - dispatch(actions.updateBuyQuoteStatePending()); + dispatch(actions.updateBuyquoteRequestStatePending()); let newBuyQuote: BuyQuote | undefined; try { newBuyQuote = await assetBuyer.getBuyQuoteAsync(assetData, baseUnitValue); } catch (error) { - dispatch(actions.updateBuyQuoteStateFailure()); + dispatch(actions.updateBuyquoteRequestStateFailure()); errorUtil.errorFlasher.flashNewError(dispatch, error); return; } @@ -76,7 +76,7 @@ const mapDispatchToProps = ( if (!_.isUndefined(value) && !_.isUndefined(assetData)) { // even if it's debounced, give them the illusion it's loading - dispatch(actions.updateBuyQuoteStatePending()); + dispatch(actions.updateBuyquoteRequestStatePending()); // tslint:disable-next-line:no-floating-promises debouncedUpdateBuyQuoteAsync(dispatch, assetData, value); } diff --git a/packages/instant/src/containers/selected_asset_instant_heading.ts b/packages/instant/src/containers/selected_asset_instant_heading.ts index 0509db5da..43127582c 100644 --- a/packages/instant/src/containers/selected_asset_instant_heading.ts +++ b/packages/instant/src/containers/selected_asset_instant_heading.ts @@ -15,14 +15,14 @@ interface ConnectedState { selectedAssetAmount?: BigNumber; totalEthBaseAmount?: BigNumber; ethUsdPrice?: BigNumber; - quoteState: AsyncProcessState; + quoteRequestState: AsyncProcessState; } const mapStateToProps = (state: State, _ownProps: InstantHeadingProps): ConnectedState => ({ selectedAssetAmount: state.selectedAssetAmount, totalEthBaseAmount: oc(state).latestBuyQuote.worstCaseQuoteInfo.totalEthAmount(), ethUsdPrice: state.ethUsdPrice, - quoteState: state.quoteState, + quoteRequestState: state.quoteRequestState, }); export const SelectedAssetInstantHeading: React.ComponentClass = connect(mapStateToProps)( -- cgit v1.2.3 From 94ace00e0cfd550bccf33f85441ce1dad33f1348 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 13:38:04 -0700 Subject: fix camel casing of updateBuyOrderState --- packages/instant/src/containers/selected_asset_amount_input.ts | 2 +- packages/instant/src/containers/selected_asset_buy_button.ts | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_amount_input.ts b/packages/instant/src/containers/selected_asset_amount_input.ts index aca6a09d4..2a1e5e457 100644 --- a/packages/instant/src/containers/selected_asset_amount_input.ts +++ b/packages/instant/src/containers/selected_asset_amount_input.ts @@ -72,7 +72,7 @@ const mapDispatchToProps = ( // invalidate the last buy quote. dispatch(actions.updateLatestBuyQuote(undefined)); // reset our buy state - dispatch(actions.updatebuyOrderState(AsyncProcessState.NONE)); + dispatch(actions.updateBuyOrderState(AsyncProcessState.NONE)); if (!_.isUndefined(value) && !_.isUndefined(assetData)) { // even if it's debounced, give them the illusion it's loading diff --git a/packages/instant/src/containers/selected_asset_buy_button.ts b/packages/instant/src/containers/selected_asset_buy_button.ts index 4a8e31525..4d3315b1a 100644 --- a/packages/instant/src/containers/selected_asset_buy_button.ts +++ b/packages/instant/src/containers/selected_asset_buy_button.ts @@ -44,9 +44,9 @@ const mapStateToProps = (state: State, _ownProps: SelectedAssetBuyButtonProps): }); const mapDispatchToProps = (dispatch: Dispatch, ownProps: SelectedAssetBuyButtonProps): ConnectedDispatch => ({ - onClick: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.PENDING)), - onBuySuccess: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.SUCCESS)), - onBuyFailure: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.FAILURE)), + onClick: buyQuote => dispatch(actions.updateBuyOrderState(AsyncProcessState.PENDING)), + onBuySuccess: buyQuote => dispatch(actions.updateBuyOrderState(AsyncProcessState.SUCCESS)), + onBuyFailure: buyQuote => dispatch(actions.updateBuyOrderState(AsyncProcessState.FAILURE)), }); export const SelectedAssetBuyButton: React.ComponentClass = connect( -- cgit v1.2.3 From 9aa67538231cc4ff71fd0f8ebe4dc66b1bcc4937 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 13:42:59 -0700 Subject: Rename update function to set function since it doesnt take a parameter --- packages/instant/src/containers/selected_asset_amount_input.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_amount_input.ts b/packages/instant/src/containers/selected_asset_amount_input.ts index 2a1e5e457..e55c8b991 100644 --- a/packages/instant/src/containers/selected_asset_amount_input.ts +++ b/packages/instant/src/containers/selected_asset_amount_input.ts @@ -44,13 +44,13 @@ const updateBuyQuoteAsync = async ( const baseUnitValue = Web3Wrapper.toBaseUnitAmount(assetAmount, zrxDecimals); // mark quote as pending - dispatch(actions.updateBuyquoteRequestStatePending()); + dispatch(actions.setQuoteRequestStatePending()); let newBuyQuote: BuyQuote | undefined; try { newBuyQuote = await assetBuyer.getBuyQuoteAsync(assetData, baseUnitValue); } catch (error) { - dispatch(actions.updateBuyquoteRequestStateFailure()); + dispatch(actions.setQuoteRequestStateFailure()); errorUtil.errorFlasher.flashNewError(dispatch, error); return; } @@ -76,7 +76,7 @@ const mapDispatchToProps = ( if (!_.isUndefined(value) && !_.isUndefined(assetData)) { // even if it's debounced, give them the illusion it's loading - dispatch(actions.updateBuyquoteRequestStatePending()); + dispatch(actions.setQuoteRequestStatePending()); // tslint:disable-next-line:no-floating-promises debouncedUpdateBuyQuoteAsync(dispatch, assetData, value); } -- cgit v1.2.3 From b4af27dd4462a001904ac6d69e43aac9fd7bb69a Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 13:48:28 -0700 Subject: Moved LatestErrorDisplay to types file and gave generic name --- packages/instant/src/containers/latest_error.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/latest_error.tsx b/packages/instant/src/containers/latest_error.tsx index 08ea418e7..413cf16ad 100644 --- a/packages/instant/src/containers/latest_error.tsx +++ b/packages/instant/src/containers/latest_error.tsx @@ -3,7 +3,8 @@ import * as React from 'react'; import { connect } from 'react-redux'; import { SlidingError } from '../components/sliding_error'; -import { LatestErrorDisplay, State } from '../redux/reducer'; +import { State } from '../redux/reducer'; +import { DisplayStatus } from '../types'; import { errorUtil } from '../util/error'; export interface LatestErrorComponentProps { @@ -29,7 +30,7 @@ export interface LatestErrorProps {} const mapStateToProps = (state: State, _ownProps: LatestErrorProps): ConnectedState => ({ assetData: state.selectedAssetData, latestError: state.latestError, - slidingDirection: state.latestErrorDisplay === LatestErrorDisplay.Present ? 'up' : 'down', + slidingDirection: state.latestErrorDisplay === DisplayStatus.Present ? 'up' : 'down', }); export const LatestError = connect(mapStateToProps)(LatestErrorComponent); -- cgit v1.2.3 From 8a6e0776640a7bec7eab1f91b3b611dc4cadd2f7 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 14:51:45 -0700 Subject: feat(instant): Indicate that order details section is loading by having pulsing placeholder --- packages/instant/src/containers/latest_buy_quote_order_details.ts | 3 +++ 1 file changed, 3 insertions(+) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/latest_buy_quote_order_details.ts b/packages/instant/src/containers/latest_buy_quote_order_details.ts index 597bf3088..092aaaf20 100644 --- a/packages/instant/src/containers/latest_buy_quote_order_details.ts +++ b/packages/instant/src/containers/latest_buy_quote_order_details.ts @@ -8,18 +8,21 @@ import { oc } from 'ts-optchain'; import { State } from '../redux/reducer'; import { OrderDetails } from '../components/order_details'; +import { AsyncProcessState } from '../types'; export interface LatestBuyQuoteOrderDetailsProps {} interface ConnectedState { buyQuoteInfo?: BuyQuoteInfo; ethUsdPrice?: BigNumber; + isLoading: boolean; } const mapStateToProps = (state: State, _ownProps: LatestBuyQuoteOrderDetailsProps): ConnectedState => ({ // use the worst case quote info buyQuoteInfo: oc(state).latestBuyQuote.worstCaseQuoteInfo(), ethUsdPrice: state.ethUsdPrice, + isLoading: state.quoteRequestState === AsyncProcessState.PENDING, }); export const LatestBuyQuoteOrderDetails: React.ComponentClass = connect( -- cgit v1.2.3 From 1737411ab7478de4a394242c930fcc7189daae07 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Thu, 18 Oct 2018 17:16:28 -0700 Subject: Show order failed messaging when order fails --- packages/instant/src/containers/selected_asset_instant_heading.ts | 2 ++ 1 file changed, 2 insertions(+) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_instant_heading.ts b/packages/instant/src/containers/selected_asset_instant_heading.ts index 0509db5da..743362151 100644 --- a/packages/instant/src/containers/selected_asset_instant_heading.ts +++ b/packages/instant/src/containers/selected_asset_instant_heading.ts @@ -16,6 +16,7 @@ interface ConnectedState { totalEthBaseAmount?: BigNumber; ethUsdPrice?: BigNumber; quoteState: AsyncProcessState; + buyOrderState: AsyncProcessState; } const mapStateToProps = (state: State, _ownProps: InstantHeadingProps): ConnectedState => ({ @@ -23,6 +24,7 @@ const mapStateToProps = (state: State, _ownProps: InstantHeadingProps): Connecte totalEthBaseAmount: oc(state).latestBuyQuote.worstCaseQuoteInfo.totalEthAmount(), ethUsdPrice: state.ethUsdPrice, quoteState: state.quoteState, + buyOrderState: state.buyOrderState, }); export const SelectedAssetInstantHeading: React.ComponentClass = connect(mapStateToProps)( -- cgit v1.2.3 From 17b282b1d743c83a4a4378eb71df098949569bdd Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Fri, 19 Oct 2018 13:42:42 -0700 Subject: wip: retry button --- .../src/containers/selected_asset_buy_button.ts | 29 ++++++---------------- 1 file changed, 8 insertions(+), 21 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_buy_button.ts b/packages/instant/src/containers/selected_asset_buy_button.ts index 99f971321..a5fa0aa8e 100644 --- a/packages/instant/src/containers/selected_asset_buy_button.ts +++ b/packages/instant/src/containers/selected_asset_buy_button.ts @@ -1,3 +1,4 @@ +// TODO: Rename to SelectedAssetButton import { AssetBuyer, BuyQuote } from '@0x/asset-buyer'; import * as _ from 'lodash'; import * as React from 'react'; @@ -8,45 +9,31 @@ import { Action, actions } from '../redux/actions'; import { State } from '../redux/reducer'; import { AsyncProcessState } from '../types'; -import { BuyButton } from '../components/buy_button'; +import { AssetButton } from '../components/asset_button'; +// TODO: rename export interface SelectedAssetBuyButtonProps {} interface ConnectedState { assetBuyer?: AssetBuyer; - text: string; + buyOrderState: AsyncProcessState; buyQuote?: BuyQuote; } interface ConnectedDispatch { - onClick: (buyQuote: BuyQuote) => void; + onBuyClick: (buyQuote: BuyQuote) => void; onBuySuccess: (buyQuote: BuyQuote) => void; onBuyFailure: (buyQuote: BuyQuote) => void; } -const textForState = (state: AsyncProcessState): string => { - switch (state) { - case AsyncProcessState.NONE: - return 'Buy'; - case AsyncProcessState.PENDING: - return '...Loading'; - case AsyncProcessState.SUCCESS: - return 'Success!'; - case AsyncProcessState.FAILURE: - return 'Failed'; - default: - return 'Buy'; - } -}; - const mapStateToProps = (state: State, _ownProps: SelectedAssetBuyButtonProps): ConnectedState => ({ assetBuyer: state.assetBuyer, - text: textForState(state.buyOrderState), + buyOrderState: state.buyOrderState, buyQuote: state.latestBuyQuote, }); const mapDispatchToProps = (dispatch: Dispatch, ownProps: SelectedAssetBuyButtonProps): ConnectedDispatch => ({ - onClick: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.PENDING)), + onBuyClick: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.PENDING)), onBuySuccess: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.SUCCESS)), onBuyFailure: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.FAILURE)), }); @@ -54,4 +41,4 @@ const mapDispatchToProps = (dispatch: Dispatch, ownProps: SelectedAssetB export const SelectedAssetBuyButton: React.ComponentClass = connect( mapStateToProps, mapDispatchToProps, -)(BuyButton); +)(AssetButton); -- cgit v1.2.3 From 6c79a858dff2766917ee3a4b5d4f623b66dadd17 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Fri, 19 Oct 2018 13:51:57 -0700 Subject: WIP: clear buy quote working --- packages/instant/src/containers/selected_asset_buy_button.ts | 2 ++ 1 file changed, 2 insertions(+) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_buy_button.ts b/packages/instant/src/containers/selected_asset_buy_button.ts index a5fa0aa8e..41d196b03 100644 --- a/packages/instant/src/containers/selected_asset_buy_button.ts +++ b/packages/instant/src/containers/selected_asset_buy_button.ts @@ -24,6 +24,7 @@ interface ConnectedDispatch { onBuyClick: (buyQuote: BuyQuote) => void; onBuySuccess: (buyQuote: BuyQuote) => void; onBuyFailure: (buyQuote: BuyQuote) => void; + onRetryClick: () => void; } const mapStateToProps = (state: State, _ownProps: SelectedAssetBuyButtonProps): ConnectedState => ({ @@ -36,6 +37,7 @@ const mapDispatchToProps = (dispatch: Dispatch, ownProps: SelectedAssetB onBuyClick: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.PENDING)), onBuySuccess: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.SUCCESS)), onBuyFailure: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.FAILURE)), + onRetryClick: () => dispatch(actions.clearBuyQuoteAndSelectedAssetAmount()), }); export const SelectedAssetBuyButton: React.ComponentClass = connect( -- cgit v1.2.3 From d2766d7ced990efd5a91441b459f36e8a21f8513 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Fri, 19 Oct 2018 14:49:38 -0700 Subject: Selected Asset button --- .../src/containers/selected_asset_button.tsx | 33 ++++++++++++++++++++++ .../src/containers/selected_asset_buy_button.ts | 10 ++----- .../src/containers/selected_asset_retry_button.tsx | 27 ++++++++++++++++++ 3 files changed, 62 insertions(+), 8 deletions(-) create mode 100644 packages/instant/src/containers/selected_asset_button.tsx create mode 100644 packages/instant/src/containers/selected_asset_retry_button.tsx (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_button.tsx b/packages/instant/src/containers/selected_asset_button.tsx new file mode 100644 index 000000000..d6e7303dd --- /dev/null +++ b/packages/instant/src/containers/selected_asset_button.tsx @@ -0,0 +1,33 @@ +import { AssetBuyer, BuyQuote } from '@0x/asset-buyer'; +import * as _ from 'lodash'; +import * as React from 'react'; +import { connect } from 'react-redux'; +import { Dispatch } from 'redux'; + +import { State } from '../redux/reducer'; +import { AsyncProcessState } from '../types'; + +import { SelectedAssetBuyButton } from './selected_asset_buy_button'; +import { SelectedAssetRetryButton } from './selected_asset_retry_button'; + +interface ConnectedState { + buyOrderState: AsyncProcessState; +} +export interface SelectedAssetButtonProps {} +const mapStateToProps = (state: State, _ownProps: SelectedAssetButtonProps): ConnectedState => ({ + buyOrderState: state.buyOrderState, +}); + +const SelectedAssetButtonPresentationComponent: React.StatelessComponent<{ + buyOrderState: AsyncProcessState; +}> = props => { + if (props.buyOrderState === AsyncProcessState.FAILURE) { + return ; + } + + return ; +}; + +export const SelectedAssetButton: React.ComponentClass = connect(mapStateToProps)( + SelectedAssetButtonPresentationComponent, +); diff --git a/packages/instant/src/containers/selected_asset_buy_button.ts b/packages/instant/src/containers/selected_asset_buy_button.ts index 41d196b03..7306ec2ec 100644 --- a/packages/instant/src/containers/selected_asset_buy_button.ts +++ b/packages/instant/src/containers/selected_asset_buy_button.ts @@ -1,4 +1,3 @@ -// TODO: Rename to SelectedAssetButton import { AssetBuyer, BuyQuote } from '@0x/asset-buyer'; import * as _ from 'lodash'; import * as React from 'react'; @@ -9,14 +8,12 @@ import { Action, actions } from '../redux/actions'; import { State } from '../redux/reducer'; import { AsyncProcessState } from '../types'; -import { AssetButton } from '../components/asset_button'; +import { BuyButton } from '../components/buy_button'; -// TODO: rename export interface SelectedAssetBuyButtonProps {} interface ConnectedState { assetBuyer?: AssetBuyer; - buyOrderState: AsyncProcessState; buyQuote?: BuyQuote; } @@ -24,12 +21,10 @@ interface ConnectedDispatch { onBuyClick: (buyQuote: BuyQuote) => void; onBuySuccess: (buyQuote: BuyQuote) => void; onBuyFailure: (buyQuote: BuyQuote) => void; - onRetryClick: () => void; } const mapStateToProps = (state: State, _ownProps: SelectedAssetBuyButtonProps): ConnectedState => ({ assetBuyer: state.assetBuyer, - buyOrderState: state.buyOrderState, buyQuote: state.latestBuyQuote, }); @@ -37,10 +32,9 @@ const mapDispatchToProps = (dispatch: Dispatch, ownProps: SelectedAssetB onBuyClick: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.PENDING)), onBuySuccess: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.SUCCESS)), onBuyFailure: buyQuote => dispatch(actions.updatebuyOrderState(AsyncProcessState.FAILURE)), - onRetryClick: () => dispatch(actions.clearBuyQuoteAndSelectedAssetAmount()), }); export const SelectedAssetBuyButton: React.ComponentClass = connect( mapStateToProps, mapDispatchToProps, -)(AssetButton); +)(BuyButton); diff --git a/packages/instant/src/containers/selected_asset_retry_button.tsx b/packages/instant/src/containers/selected_asset_retry_button.tsx new file mode 100644 index 000000000..f8963ca8e --- /dev/null +++ b/packages/instant/src/containers/selected_asset_retry_button.tsx @@ -0,0 +1,27 @@ +import * as _ from 'lodash'; +import * as React from 'react'; +import { connect } from 'react-redux'; +import { Dispatch } from 'redux'; + +import { Action, actions } from '../redux/actions'; + +import { RetryButton } from '../components/retry_button'; +import { State } from '../redux/reducer'; + +export interface SelectedAssetRetryButtonProps {} + +interface ConnectedDispatch { + onClick: () => void; +} + +const mapDispatchToProps = ( + dispatch: Dispatch, + _ownProps: SelectedAssetRetryButtonProps, +): ConnectedDispatch => ({ + onClick: () => dispatch(actions.clearBuyQuoteAndSelectedAssetAmount()), +}); + +export const SelectedAssetRetryButton: React.ComponentClass = connect( + null, + mapDispatchToProps, +)(RetryButton); -- cgit v1.2.3 From 51779fec38a32c0bbbc0209559f84aeda8a45d1a Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Fri, 19 Oct 2018 16:11:01 -0700 Subject: linting --- packages/instant/src/containers/selected_asset_button.tsx | 2 -- packages/instant/src/containers/selected_asset_retry_button.tsx | 1 - 2 files changed, 3 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_button.tsx b/packages/instant/src/containers/selected_asset_button.tsx index d6e7303dd..d84ae1a52 100644 --- a/packages/instant/src/containers/selected_asset_button.tsx +++ b/packages/instant/src/containers/selected_asset_button.tsx @@ -1,8 +1,6 @@ -import { AssetBuyer, BuyQuote } from '@0x/asset-buyer'; import * as _ from 'lodash'; import * as React from 'react'; import { connect } from 'react-redux'; -import { Dispatch } from 'redux'; import { State } from '../redux/reducer'; import { AsyncProcessState } from '../types'; diff --git a/packages/instant/src/containers/selected_asset_retry_button.tsx b/packages/instant/src/containers/selected_asset_retry_button.tsx index f8963ca8e..66177551d 100644 --- a/packages/instant/src/containers/selected_asset_retry_button.tsx +++ b/packages/instant/src/containers/selected_asset_retry_button.tsx @@ -6,7 +6,6 @@ import { Dispatch } from 'redux'; import { Action, actions } from '../redux/actions'; import { RetryButton } from '../components/retry_button'; -import { State } from '../redux/reducer'; export interface SelectedAssetRetryButtonProps {} -- cgit v1.2.3 From bf0a4bd91b6e6d15a468b0e75a3a5846c98b85ab Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Fri, 19 Oct 2018 16:37:54 -0700 Subject: feat(instant): Add failure state and icon --- packages/instant/src/containers/selected_asset_button.tsx | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_button.tsx b/packages/instant/src/containers/selected_asset_button.tsx index d84ae1a52..8c617804e 100644 --- a/packages/instant/src/containers/selected_asset_button.tsx +++ b/packages/instant/src/containers/selected_asset_button.tsx @@ -2,6 +2,7 @@ import * as _ from 'lodash'; import * as React from 'react'; import { connect } from 'react-redux'; +import { SecondaryButton } from '../components/secondary_button'; import { State } from '../redux/reducer'; import { AsyncProcessState } from '../types'; @@ -21,6 +22,10 @@ const SelectedAssetButtonPresentationComponent: React.StatelessComponent<{ }> = props => { if (props.buyOrderState === AsyncProcessState.FAILURE) { return ; + } else if (props.buyOrderState === AsyncProcessState.SUCCESS) { + return ; + } else if (props.buyOrderState === AsyncProcessState.PENDING) { + return ; } return ; -- cgit v1.2.3 From d43f89fa0af709b1c1616ab5cfb32b8c27e07ab6 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Tue, 23 Oct 2018 17:28:27 -0700 Subject: move buy order state to its own component --- .../instant/src/containers/selected_asset_button.tsx | 20 ++------------------ 1 file changed, 2 insertions(+), 18 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_button.tsx b/packages/instant/src/containers/selected_asset_button.tsx index 8c617804e..86be291bc 100644 --- a/packages/instant/src/containers/selected_asset_button.tsx +++ b/packages/instant/src/containers/selected_asset_button.tsx @@ -2,12 +2,10 @@ import * as _ from 'lodash'; import * as React from 'react'; import { connect } from 'react-redux'; -import { SecondaryButton } from '../components/secondary_button'; import { State } from '../redux/reducer'; import { AsyncProcessState } from '../types'; -import { SelectedAssetBuyButton } from './selected_asset_buy_button'; -import { SelectedAssetRetryButton } from './selected_asset_retry_button'; +import { BuyOrderStateButton } from '../components/buy_order_state_button'; interface ConnectedState { buyOrderState: AsyncProcessState; @@ -17,20 +15,6 @@ const mapStateToProps = (state: State, _ownProps: SelectedAssetButtonProps): Con buyOrderState: state.buyOrderState, }); -const SelectedAssetButtonPresentationComponent: React.StatelessComponent<{ - buyOrderState: AsyncProcessState; -}> = props => { - if (props.buyOrderState === AsyncProcessState.FAILURE) { - return ; - } else if (props.buyOrderState === AsyncProcessState.SUCCESS) { - return ; - } else if (props.buyOrderState === AsyncProcessState.PENDING) { - return ; - } - - return ; -}; - export const SelectedAssetButton: React.ComponentClass = connect(mapStateToProps)( - SelectedAssetButtonPresentationComponent, + BuyOrderStateButton, ); -- cgit v1.2.3 From 657ae0cf5732d2ad3bb23ed4270ee20ec9b0f131 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Tue, 23 Oct 2018 17:32:20 -0700 Subject: null -> undefined --- packages/instant/src/containers/selected_asset_retry_button.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_retry_button.tsx b/packages/instant/src/containers/selected_asset_retry_button.tsx index 66177551d..b2b140be6 100644 --- a/packages/instant/src/containers/selected_asset_retry_button.tsx +++ b/packages/instant/src/containers/selected_asset_retry_button.tsx @@ -17,10 +17,10 @@ const mapDispatchToProps = ( dispatch: Dispatch, _ownProps: SelectedAssetRetryButtonProps, ): ConnectedDispatch => ({ - onClick: () => dispatch(actions.clearBuyQuoteAndSelectedAssetAmount()), + onClick: () => dispatch(actions.resetAmount()), }); export const SelectedAssetRetryButton: React.ComponentClass = connect( - null, + undefined, mapDispatchToProps, )(RetryButton); -- cgit v1.2.3 From 4df8e60f42a372ae70f15cadbe1942ba27097f7a Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Tue, 23 Oct 2018 17:36:25 -0700 Subject: rename container --- .../instant/src/containers/selected_asset_button.tsx | 20 -------------------- .../selected_asset_buy_order_state_button.tsx | 20 ++++++++++++++++++++ 2 files changed, 20 insertions(+), 20 deletions(-) delete mode 100644 packages/instant/src/containers/selected_asset_button.tsx create mode 100644 packages/instant/src/containers/selected_asset_buy_order_state_button.tsx (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/selected_asset_button.tsx b/packages/instant/src/containers/selected_asset_button.tsx deleted file mode 100644 index 86be291bc..000000000 --- a/packages/instant/src/containers/selected_asset_button.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import * as _ from 'lodash'; -import * as React from 'react'; -import { connect } from 'react-redux'; - -import { State } from '../redux/reducer'; -import { AsyncProcessState } from '../types'; - -import { BuyOrderStateButton } from '../components/buy_order_state_button'; - -interface ConnectedState { - buyOrderState: AsyncProcessState; -} -export interface SelectedAssetButtonProps {} -const mapStateToProps = (state: State, _ownProps: SelectedAssetButtonProps): ConnectedState => ({ - buyOrderState: state.buyOrderState, -}); - -export const SelectedAssetButton: React.ComponentClass = connect(mapStateToProps)( - BuyOrderStateButton, -); diff --git a/packages/instant/src/containers/selected_asset_buy_order_state_button.tsx b/packages/instant/src/containers/selected_asset_buy_order_state_button.tsx new file mode 100644 index 000000000..3b7fc0054 --- /dev/null +++ b/packages/instant/src/containers/selected_asset_buy_order_state_button.tsx @@ -0,0 +1,20 @@ +import * as _ from 'lodash'; +import * as React from 'react'; +import { connect } from 'react-redux'; + +import { State } from '../redux/reducer'; +import { AsyncProcessState } from '../types'; + +import { BuyOrderStateButton } from '../components/buy_order_state_button'; + +interface ConnectedState { + buyOrderState: AsyncProcessState; +} +export interface SelectedAssetButtonProps {} +const mapStateToProps = (state: State, _ownProps: SelectedAssetButtonProps): ConnectedState => ({ + buyOrderState: state.buyOrderState, +}); + +export const SelectedAssetBuyOrderStateButton: React.ComponentClass = connect( + mapStateToProps, +)(BuyOrderStateButton); -- cgit v1.2.3