move buy order state to its own component

2 files changed, 26 insertions, 18 deletions

diff --git a/packages/instant/src/components/buy_order_state_button.tsx b/packages/instant/src/components/buy_order_state_button.tsx
new file mode 100644
index 000000000..e7641e7e7
--- /dev/null
+++ b/packages/instant/src/components/buy_order_state_button.tsx
@@ -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 />;
+};
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 <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,
 );