feat: auto-close panel when a token is selected

2 files changed, 11 insertions, 3 deletions

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 765ff7e3d..850beb49c 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -46,7 +46,7 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
                         animationState={this.state.tokenSelectionPanelAnimationState}
                         onClose={this._handlePanelClose}
                     >
-                        <AvailableERC20TokenSelector />
+                        <AvailableERC20TokenSelector onTokenSelect={this._handlePanelClose} />
                     </SlidingPanel>
                 </Container>
             </Container>
diff --git a/packages/instant/src/containers/available_erc20_token_selector.ts b/packages/instant/src/containers/available_erc20_token_selector.ts
index e8bacdba0..bb194cd6b 100644
--- a/packages/instant/src/containers/available_erc20_token_selector.ts
+++ b/packages/instant/src/containers/available_erc20_token_selector.ts
@@ -1,3 +1,4 @@
+import * as _ from 'lodash';
 import * as React from 'react';
 import { connect } from 'react-redux';
 import { Dispatch } from 'redux';
@@ -9,7 +10,9 @@ import { assetUtils } from '../util/asset';
 import { ERC20TokenSelector } from '../components/erc20_token_selector';
 import { Action, actions } from '../redux/actions';
 
-export interface AvailableERC20TokenSelectorProps {}
+export interface AvailableERC20TokenSelectorProps {
+    onTokenSelect?: (token: ERC20Asset) => void;
+}
 
 interface ConnectedState {
     tokens: ERC20Asset[];
@@ -27,7 +30,12 @@ const mapDispatchToProps = (
     dispatch: Dispatch<Action>,
     ownProps: AvailableERC20TokenSelectorProps,
 ): ConnectedDispatch => ({
-    onTokenSelect: (token: ERC20Asset) => dispatch(actions.updateSelectedAsset(token)),
+    onTokenSelect: (token: ERC20Asset) => {
+        if (ownProps.onTokenSelect) {
+            ownProps.onTokenSelect(token);
+        }
+        dispatch(actions.updateSelectedAsset(token));
+    },
 });
 
 export const AvailableERC20TokenSelector: React.ComponentClass<AvailableERC20TokenSelectorProps> = connect(