removed legacy performedCallback system, and implemented new react-redux system

packages/instant/src/components/zero_ex_instant_provider.tsx

@@ -28,7 +28,6 @@ export class ZeroExInstantProvider extends React.PureComponent<ZeroExInstantProv
     private readonly _store: Store;
     private _accountUpdateHeartbeat?: Heartbeater;
     private _buyQuoteHeartbeat?: Heartbeater;
-    private _unsubscribeHandler?: Unsubscribe;
 
     // TODO(fragosti): Write tests for this beast once we inject a provider.
     private static _mergeDefaultStateWithProps(
@@ -88,6 +87,7 @@ export class ZeroExInstantProvider extends React.PureComponent<ZeroExInstantProv
                       ),
             assetMetaDataMap: completeAssetMetaDataMap,
             affiliateInfo: props.affiliateInfo,
+            onSuccess: props.onSuccess,
         };
         return storeStateFromProps;
     }
@@ -100,18 +100,6 @@ export class ZeroExInstantProvider extends React.PureComponent<ZeroExInstantProv
     }
     public componentDidMount(): void {
         const state = this._store.getState();
-        this._unsubscribeHandler = this._store.subscribe(() => {
-            const currentState = this._store.getState();
-            if (
-                currentState.buyOrderState.processState === OrderProcessState.Success &&
-                !currentState.buyOrderState.performedCallback &&
-                this.props.onSuccess !== undefined
-            ) {
-                const txHash = currentState.buyOrderState.txHash;
-                this.props.onSuccess(txHash);
-                this._store.dispatch(actions.setBuyOrderStateSuccess(txHash, true));
-            }
-        });
         const dispatch = this._store.dispatch;
         // tslint:disable-next-line:no-floating-promises
         asyncData.fetchEthPriceAndDispatchToStore(dispatch);
@@ -167,9 +155,6 @@ export class ZeroExInstantProvider extends React.PureComponent<ZeroExInstantProv
         if (this._buyQuoteHeartbeat) {
             this._buyQuoteHeartbeat.stop();
         }
-        if (this._unsubscribeHandler) {
-            this._unsubscribeHandler();
-        }
     }
     public render(): React.ReactNode {
         return (

packages/instant/src/containers/selected_asset_buy_order_state_buttons.ts

@@ -24,6 +24,7 @@ interface ConnectedState {
     affiliateInfo?: AffiliateInfo;
     selectedAsset?: Asset;
     onViewTransaction: () => void;
+    onSuccess?: (txHash: string) => void;
 }
 
 interface ConnectedDispatch {
@@ -52,6 +53,7 @@ const mapStateToProps = (state: State, _ownProps: SelectedAssetBuyOrderStateButt
         buyQuote: state.latestBuyQuote,
         affiliateInfo: state.affiliateInfo,
         selectedAsset,
+        onSuccess: state.onSuccess,
         onViewTransaction: () => {
             if (
                 state.buyOrderState.processState === OrderProcessState.Processing ||
@@ -107,7 +109,28 @@ const mapDispatchToProps = (
     },
 });
 
-export const SelectedAssetBuyOrderStateButtons: React.ComponentClass<SelectedAssetBuyOrderStateButtons> = connect(
+
+const mergeProps = (
+   connectedState: ConnectedState,
+   connectedDispatch: ConnectedDispatch,
+   ownProps: SelectedAssetBuyOrderStateButtons,
+) => {
+   return {
+       ...ownProps,
+       ...connectedState,
+       ...connectedDispatch,
+       onBuySuccess: (buyQuote: BuyQuote, txHash: string) => {
+           connectedDispatch.onBuySuccess(buyQuote, txHash);
+           if (connectedState.onSuccess) {
+               connectedState.onSuccess(txHash);
+           }
+       },
+    }
+
+};
+
+export const SelectedAssetBuyOrderStateButtons = connect(
     mapStateToProps,
     mapDispatchToProps,
+    mergeProps,
 )(BuyOrderStateButtons);

packages/instant/src/redux/reducer.ts

@@ -52,6 +52,7 @@ interface OptionalState {
     latestErrorMessage: string;
     affiliateInfo: AffiliateInfo;
     walletDisplayName: string;
+    onSuccess: (txHash: string) => void;
 }
 
 export type State = DefaultState & PropsDerivedState & Partial<OptionalState>;
@@ -157,7 +158,6 @@ export const createReducer = (initialState: State) => {
                     buyOrderState: {
                         processState: OrderProcessState.Processing,
                         txHash: processingData.txHash,
-                        performedCallback: false,
                         progress: {
                             startTimeUnix,
                             expectedEndTimeUnix,

packages/instant/src/types.ts

@@ -43,7 +43,6 @@ interface OrderStatePostTx {
     processState: OrderProcessState.Processing | OrderProcessState.Success | OrderProcessState.Failure;
     txHash: string;
     progress: SimulatedProgress;
-    performedCallback: boolean;
 }
 export type OrderState = OrderStatePreTx | OrderStatePostTx;