move buy order state to its own component
This commit is contained in:
24
packages/instant/src/components/buy_order_state_button.tsx
Normal file
24
packages/instant/src/components/buy_order_state_button.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import * as React from 'react';
|
||||
|
||||
import { SelectedAssetBuyButton } from '../containers/selected_asset_buy_button';
|
||||
import { SelectedAssetRetryButton } from '../containers/selected_asset_retry_button';
|
||||
|
||||
import { AsyncProcessState } from '../types';
|
||||
|
||||
import { SecondaryButton } from './secondary_button';
|
||||
|
||||
export interface BuyOrderStateButtonProps {
|
||||
buyOrderState: AsyncProcessState;
|
||||
}
|
||||
|
||||
export const BuyOrderStateButton: React.StatelessComponent<BuyOrderStateButtonProps> = props => {
|
||||
if (props.buyOrderState === AsyncProcessState.FAILURE) {
|
||||
return <SelectedAssetRetryButton />;
|
||||
} else if (props.buyOrderState === AsyncProcessState.SUCCESS) {
|
||||
return <SecondaryButton text="Success" isDisabled={true} />;
|
||||
} else if (props.buyOrderState === AsyncProcessState.PENDING) {
|
||||
return <SecondaryButton text="Processing" isDisabled={true} />;
|
||||
}
|
||||
|
||||
return <SelectedAssetBuyButton />;
|
||||
};
|
@@ -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 <SelectedAssetRetryButton />;
|
||||
} else if (props.buyOrderState === AsyncProcessState.SUCCESS) {
|
||||
return <SecondaryButton text="Success" isDisabled={true} />;
|
||||
} else if (props.buyOrderState === AsyncProcessState.PENDING) {
|
||||
return <SecondaryButton text="Processing" isDisabled={true} />;
|
||||
}
|
||||
|
||||
return <SelectedAssetBuyButton />;
|
||||
};
|
||||
|
||||
export const SelectedAssetButton: React.ComponentClass<SelectedAssetButtonProps> = connect(mapStateToProps)(
|
||||
SelectedAssetButtonPresentationComponent,
|
||||
BuyOrderStateButton,
|
||||
);
|
||||
|
Reference in New Issue
Block a user