From 2fec7613c408a046c130f4c5817696ab3b5e3928 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Mon, 26 Nov 2018 13:20:16 -0800
Subject: Token Selector open, closed, chose

---
 packages/instant/src/components/zero_ex_instant_container.tsx | 3 +++
 1 file changed, 3 insertions(+)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 47c938472..f30bda6ed 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -12,6 +12,7 @@ import { SelectedAssetInstantHeading } from '../containers/selected_asset_instan
 import { ColorOption } from '../style/theme';
 import { zIndex } from '../style/z_index';
 import { OrderProcessState, SlideAnimationState } from '../types';
+import { analytics } from '../util/analytics';
 
 import { CSSReset } from './css_reset';
 import { SlidingPanel } from './sliding_panel';
@@ -82,11 +83,13 @@ export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantCon
         );
     }
     private readonly _handleSymbolClick = (): void => {
+        analytics.trackTokenSelectorOpened();
         this.setState({
             tokenSelectionPanelAnimationState: 'slidIn',
         });
     };
     private readonly _handlePanelClose = (): void => {
+        analytics.trackTokenSelectorClosed();
         this.setState({
             tokenSelectionPanelAnimationState: 'slidOut',
         });
-- 
cgit v1.2.3


From ae570dba05cfc0d696c616d05804152791d29677 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Mon, 26 Nov 2018 15:04:02 -0800
Subject: feat(instant): Event tracking for token selector

---
 .../src/components/zero_ex_instant_container.tsx        | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index f30bda6ed..b72493ce6 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -12,7 +12,7 @@ import { SelectedAssetInstantHeading } from '../containers/selected_asset_instan
 import { ColorOption } from '../style/theme';
 import { zIndex } from '../style/z_index';
 import { OrderProcessState, SlideAnimationState } from '../types';
-import { analytics } from '../util/analytics';
+import { analytics, TokenSelectorClosedVia } from '../util/analytics';
 
 import { CSSReset } from './css_reset';
 import { SlidingPanel } from './sliding_panel';
@@ -30,6 +30,13 @@ export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantCon
     public state = {
         tokenSelectionPanelAnimationState: 'none' as SlideAnimationState,
     };
+    private _handlePanelCloseClickedX: () => void;
+    private _handlePanelCloseAfterChose: () => void;
+    public constructor(props: {}) {
+        super(props);
+        this._handlePanelCloseClickedX = this._handlePanelClose.bind(this, TokenSelectorClosedVia.ClickedX);
+        this._handlePanelCloseAfterChose = this._handlePanelClose.bind(this, TokenSelectorClosedVia.TokenChose);
+    }
     public render(): React.ReactNode {
         return (
             <React.Fragment>
@@ -61,9 +68,9 @@ export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantCon
                         </Flex>
                         <SlidingPanel
                             animationState={this.state.tokenSelectionPanelAnimationState}
-                            onClose={this._handlePanelClose}
+                            onClose={this._handlePanelCloseClickedX}
                         >
-                            <AvailableERC20TokenSelector onTokenSelect={this._handlePanelClose} />
+                            <AvailableERC20TokenSelector onTokenSelect={this._handlePanelCloseAfterChose} />
                         </SlidingPanel>
                         <CurrentStandardSlidingPanel />
                     </Container>
@@ -88,8 +95,8 @@ export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantCon
             tokenSelectionPanelAnimationState: 'slidIn',
         });
     };
-    private readonly _handlePanelClose = (): void => {
-        analytics.trackTokenSelectorClosed();
+    private readonly _handlePanelClose = (closedVia: TokenSelectorClosedVia): void => {
+        analytics.trackTokenSelectorClosed(closedVia);
         this.setState({
             tokenSelectionPanelAnimationState: 'slidOut',
         });
-- 
cgit v1.2.3


From 80a53aedf220948675a938dc4ae5227381fb96e5 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Mon, 26 Nov 2018 16:53:50 -0800
Subject: Fix props

---
 packages/instant/src/components/zero_ex_instant_container.tsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index b72493ce6..72a3cde2f 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -19,20 +19,18 @@ import { SlidingPanel } from './sliding_panel';
 import { Container } from './ui/container';
 import { Flex } from './ui/flex';
 
-export interface ZeroExInstantContainerProps {
-    orderProcessState: OrderProcessState;
-}
+export interface ZeroExInstantContainerProps {}
 export interface ZeroExInstantContainerState {
     tokenSelectionPanelAnimationState: SlideAnimationState;
 }
 
-export class ZeroExInstantContainer extends React.Component<{}, ZeroExInstantContainerState> {
+export class ZeroExInstantContainer extends React.Component<ZeroExInstantContainerProps, ZeroExInstantContainerState> {
     public state = {
         tokenSelectionPanelAnimationState: 'none' as SlideAnimationState,
     };
     private _handlePanelCloseClickedX: () => void;
     private _handlePanelCloseAfterChose: () => void;
-    public constructor(props: {}) {
+    public constructor(props: ZeroExInstantContainerProps) {
         super(props);
         this._handlePanelCloseClickedX = this._handlePanelClose.bind(this, TokenSelectorClosedVia.ClickedX);
         this._handlePanelCloseAfterChose = this._handlePanelClose.bind(this, TokenSelectorClosedVia.TokenChose);
-- 
cgit v1.2.3


From ee5b6ad77ffac9aca00035a6bc50cdbf25caf348 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Tue, 27 Nov 2018 09:16:26 -0800
Subject: Linting

---
 packages/instant/src/components/zero_ex_instant_container.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 72a3cde2f..1e74cf41c 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -11,7 +11,7 @@ import { SelectedAssetBuyOrderStateButtons } from '../containers/selected_asset_
 import { SelectedAssetInstantHeading } from '../containers/selected_asset_instant_heading';
 import { ColorOption } from '../style/theme';
 import { zIndex } from '../style/z_index';
-import { OrderProcessState, SlideAnimationState } from '../types';
+import { SlideAnimationState } from '../types';
 import { analytics, TokenSelectorClosedVia } from '../util/analytics';
 
 import { CSSReset } from './css_reset';
@@ -28,8 +28,8 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
     public state = {
         tokenSelectionPanelAnimationState: 'none' as SlideAnimationState,
     };
-    private _handlePanelCloseClickedX: () => void;
-    private _handlePanelCloseAfterChose: () => void;
+    private readonly _handlePanelCloseClickedX: () => void;
+    private readonly _handlePanelCloseAfterChose: () => void;
     public constructor(props: ZeroExInstantContainerProps) {
         super(props);
         this._handlePanelCloseClickedX = this._handlePanelClose.bind(this, TokenSelectorClosedVia.ClickedX);
-- 
cgit v1.2.3


From 9c27feeff61ab38771709b3f4ccd1fb1ff29e1d2 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Tue, 27 Nov 2018 10:00:21 -0800
Subject: Make explicit functions

---
 .../instant/src/components/zero_ex_instant_container.tsx    | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 1e74cf41c..8a809ee31 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -28,13 +28,6 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
     public state = {
         tokenSelectionPanelAnimationState: 'none' as SlideAnimationState,
     };
-    private readonly _handlePanelCloseClickedX: () => void;
-    private readonly _handlePanelCloseAfterChose: () => void;
-    public constructor(props: ZeroExInstantContainerProps) {
-        super(props);
-        this._handlePanelCloseClickedX = this._handlePanelClose.bind(this, TokenSelectorClosedVia.ClickedX);
-        this._handlePanelCloseAfterChose = this._handlePanelClose.bind(this, TokenSelectorClosedVia.TokenChose);
-    }
     public render(): React.ReactNode {
         return (
             <React.Fragment>
@@ -93,6 +86,12 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
             tokenSelectionPanelAnimationState: 'slidIn',
         });
     };
+    private readonly _handlePanelCloseClickedX = (): void => {
+        this._handlePanelClose(TokenSelectorClosedVia.ClickedX);
+    };
+    private readonly _handlePanelCloseAfterChose = (): void => {
+        this._handlePanelClose(TokenSelectorClosedVia.TokenChose);
+    };
     private readonly _handlePanelClose = (closedVia: TokenSelectorClosedVia): void => {
         analytics.trackTokenSelectorClosed(closedVia);
         this.setState({
-- 
cgit v1.2.3


From f327d7b4d955e954c0f46bc77b7e3b34eb440dbb Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Tue, 4 Dec 2018 16:41:47 -0800
Subject: fix(instant): center powered by 0x svg

---
 packages/instant/src/components/zero_ex_instant_container.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 8a809ee31..0337c7714 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -70,7 +70,7 @@ export class ZeroExInstantContainer extends React.Component<ZeroExInstantContain
                         marginTop="10px"
                         marginLeft="auto"
                         marginRight="auto"
-                        width="140px"
+                        width="108px"
                     >
                         <a href={ZERO_EX_SITE_URL} target="_blank">
                             <PoweredByLogo />
-- 
cgit v1.2.3


From 586a8ba8e7427eab2fdc974dab6483105b7cd5b6 Mon Sep 17 00:00:00 2001
From: fragosti <francesco.agosti93@gmail.com>
Date: Wed, 2 Jan 2019 16:01:40 +0100
Subject: feat: use PureComponent instead of Component

---
 packages/instant/src/components/zero_ex_instant_container.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 0337c7714..63497e639 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -24,7 +24,7 @@ export interface ZeroExInstantContainerState {
     tokenSelectionPanelAnimationState: SlideAnimationState;
 }
 
-export class ZeroExInstantContainer extends React.Component<ZeroExInstantContainerProps, ZeroExInstantContainerState> {
+export class ZeroExInstantContainer extends React.PureComponent<ZeroExInstantContainerProps, ZeroExInstantContainerState> {
     public state = {
         tokenSelectionPanelAnimationState: 'none' as SlideAnimationState,
     };
-- 
cgit v1.2.3


From 1ceb3c96645fd3682c59459fdce996cdf5f216cf Mon Sep 17 00:00:00 2001
From: fragosti <francesco.agosti93@gmail.com>
Date: Wed, 2 Jan 2019 19:07:02 +0100
Subject: feat: unmount the token selector when its not displaying

---
 .../instant/src/components/zero_ex_instant_container.tsx    | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

(limited to 'packages/instant/src/components/zero_ex_instant_container.tsx')

diff --git a/packages/instant/src/components/zero_ex_instant_container.tsx b/packages/instant/src/components/zero_ex_instant_container.tsx
index 63497e639..e8c64d5d1 100644
--- a/packages/instant/src/components/zero_ex_instant_container.tsx
+++ b/packages/instant/src/components/zero_ex_instant_container.tsx
@@ -24,7 +24,10 @@ export interface ZeroExInstantContainerState {
     tokenSelectionPanelAnimationState: SlideAnimationState;
 }
 
-export class ZeroExInstantContainer extends React.PureComponent<ZeroExInstantContainerProps, ZeroExInstantContainerState> {
+export class ZeroExInstantContainer extends React.PureComponent<
+    ZeroExInstantContainerProps,
+    ZeroExInstantContainerState
+> {
     public state = {
         tokenSelectionPanelAnimationState: 'none' as SlideAnimationState,
     };
@@ -60,6 +63,7 @@ export class ZeroExInstantContainer extends React.PureComponent<ZeroExInstantCon
                         <SlidingPanel
                             animationState={this.state.tokenSelectionPanelAnimationState}
                             onClose={this._handlePanelCloseClickedX}
+                            onAnimationEnd={this._handleSlidingPanelAnimationEnd}
                         >
                             <AvailableERC20TokenSelector onTokenSelect={this._handlePanelCloseAfterChose} />
                         </SlidingPanel>
@@ -98,4 +102,11 @@ export class ZeroExInstantContainer extends React.PureComponent<ZeroExInstantCon
             tokenSelectionPanelAnimationState: 'slidOut',
         });
     };
+    private readonly _handleSlidingPanelAnimationEnd = (): void => {
+        if (this.state.tokenSelectionPanelAnimationState === 'slidOut') {
+            // When the slidOut animation completes, don't keep the panel mounted.
+            // Performance optimization
+            this.setState({ tokenSelectionPanelAnimationState: 'none' });
+        }
+    };
 }
-- 
cgit v1.2.3