Merge remote-tracking branch 'origin/5.4.1' into 5.4.1

李犇
Commit e2841033b18e1d50d3e2b9dfcb6ddbadf764b8c2 2 parents 2af95614 40b87eca
Showing 14 changed files with 168 additions and 41 deletions
js/blk/containers/BrandContainer.js
js/home/components/home/Home.js
js/home/containers/HomeContainer.js
js/home/reducers/home/homeActions.js
js/outlet/components/outlet/ActivityCell.js
js/outlet/components/outlet/NoActivityView.js
js/outlet/components/outlet/Outlet.js
js/outlet/components/outlet/OutletDoubleImage.js
js/outlet/components/outlet/OutletPageListView.js
js/outlet/components/outlet/OutletRecommendFive.js
js/outlet/components/outlet/OutletSingleImage.js
js/outlet/components/outlet/OutletSwiper.js
js/outlet/components/outlet/OutletThreeImage.js
js/outlet/containers/OutletContainer.js
--- a/js/blk/containers/BrandContainer.js
View file @e284103
+++ b/js/blk/containers/BrandContainer.js
View file @e284103
@@ -80,6 +80,11 @@ class BrandContainer extends Component {
     //原生跳转
     _onPressBrandItem(data, fromSearch=false){
+        //blk品牌跳转需要：如果发现是店铺，全部跳基础店铺。----顺老板。
+        if (data&&data.type == '2') {
+            data.is_red_shop == '0';
+            data.shop_template_type = '1';
+        }
         ReactNative.NativeModules.YH_CommonHelper.blkPushBrandVC(data);
         // let eventName = '';
         // let params = {};
--- a/js/home/components/home/Home.js
View file @e284103
+++ b/js/home/components/home/Home.js
View file @e284103
@@ -84,9 +84,19 @@ export default class Home extends Component {
         }
     }
-    trigggePullToRefresh() {
+    trigggePullToRefresh(changeChannel=false) {
         let data = this._currentChannelData();
-        if (data.isFirstLoad) {
+        if (changeChannel) {
+            if (data.isFirstLoad) {
+                if (Platform.OS === 'ios') {
+                    InteractionManager.runAfterInteractions(() => {
+                        this.listView && this.listView.getScrollResponder().startPullToRefresh();
+                    });
+                } else {
+                    this.props.onRefresh && this.props.onRefresh();
+                }
+            }
+        }else {
             if (Platform.OS === 'ios') {
                 InteractionManager.runAfterInteractions(() => {
                     this.listView && this.listView.getScrollResponder().startPullToRefresh();
@@ -422,7 +432,7 @@ export default class Home extends Component {
     }
     //因为android下拉刷新控件与swiper的滑动事件会引起冲突，所以将listview滚动位置加1以阻止下拉刷新
-    _onChildScrollToPreventRefresh() {  
+    _onChildScrollToPreventRefresh() {
         if(Platform.OS === 'android' && this.state.currentY == 0 && this.listView){
             this.listView.scrollTo({x: 0, y: 1, animated: false});
         }
--- a/js/home/containers/HomeContainer.js
View file @e284103
+++ b/js/home/containers/HomeContainer.js
View file @e284103
@@ -83,10 +83,37 @@ class HomeContainer extends Component {
                 //增加了IOS的判断，Android不需要此方法，因为Android首页的四个频道为四个不同的原生界面，调用此方法会导致重复渲染数据
                 if (Platform.OS === 'ios') {
                     this.props.actions.setChannel(reminder.channel);
-                    this.home && this.home.trigggePullToRefresh();
+                    this.home && this.home.trigggePullToRefresh(true);
                 }
             }
         );
+        this.subscription2 = NativeAppEventEmitter.addListener(
+            'UserDidLoginEvent',
+            (reminder) => {
+                this.home && this.home.trigggePullToRefresh();
+            }
+        );
+
+        this.subscription3 = NativeAppEventEmitter.addListener(
+            'UserDidLogoutEvent',
+            (reminder) => {
+                this.home && this.home.trigggePullToRefresh();
+            }
+        );
+
+        this.subscription4 = NativeAppEventEmitter.addListener(
+            'ABTestDidChangeEvent',
+            (reminder) => {
+                this.home && this.home.trigggePullToRefresh();
+            }
+        );
+
+        this.subscription5 = NativeAppEventEmitter.addListener(
+            'UserDidRegisterEvent',
+            (reminder) => {
+                this.home && this.home.trigggePullToRefresh();
+            }
+        );
     }
     componentDidMount() {
@@ -96,6 +123,10 @@ class HomeContainer extends Component {
     componentWillUnmount() {
         this.subscription && this.subscription.remove();
+        this.subscription2 && this.subscription2.remove();
+        this.subscription3 && this.subscription3.remove();
+        this.subscription4 && this.subscription4.remove();
+        this.subscription5 && this.subscription5.remove();
     }
     onLongPressProduct(rowID) {
@@ -139,7 +170,6 @@ class HomeContainer extends Component {
         this.props.actions.selectedRecommendProduct();
     }
-
     onEndReached() {
         InteractionManager.runAfterInteractions(() => {
             this.props.actions.fetchHomeFavoriteList();
--- a/js/home/reducers/home/homeActions.js
View file @e284103
+++ b/js/home/reducers/home/homeActions.js
View file @e284103
@@ -626,7 +626,7 @@ export function  getRecommendPop() {
 		}
 		dispatch(recommendPopRequest(channelStr));
 		let fetchRecommendPop = (fromPage, rec_pos) =>{
-			return new HomeService('http://dev-api.yohops.com:9999').recommendPop(fromPage, rec_pos)
+			return new HomeService(app.host).recommendPop(fromPage, rec_pos)
 			.then(json =>{
 				let payload = floorParser.parseRecommendPop(json);
 				dispatch(recommendPopSuccess(payload, channelStr));
--- a/js/outlet/components/outlet/ActivityCell.js
View file @e284103
+++ b/js/outlet/components/outlet/ActivityCell.js
View file @e284103
@@ -115,7 +115,7 @@ export default class ActivityCell extends React.Component {
     render() {
-		let {resource} = this.props;
+		let {resource ,row_ID} = this.props;
         if (!resource) {
 			return null;
 		}
@@ -150,7 +150,7 @@ export default class ActivityCell extends React.Component {
                                 this.props.showToast && this.props.showToast('活动已结束，敬请期待。');
                             }else {
                                 let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.outletactivity","params":{"activity_id":"${id}"}}`;
-        						this.props.onPressProduct && this.props.onPressProduct(url);
+        						this.props.onPressProduct && this.props.onPressProduct(url,row_ID,1,'','');
                             }
                         }else {
                             this.props.showToast && this.props.showToast('活动还未开始，敬请期待');
--- a/js/outlet/components/outlet/NoActivityView.js
View file @e284103
+++ b/js/outlet/components/outlet/NoActivityView.js
View file @e284103
@@ -66,13 +66,13 @@ let styles = StyleSheet.create({
     },
 	textV: {
 		width: textWidth,
-		height: 40,
+		height: 50,
 		alignSelf: 'center',
 		marginTop: 10,
 	},
 	text: {
 		width: textWidth,
-		height: 40,
+		height: 50,
 		textAlign: 'center',
 	}
 });
--- a/js/outlet/components/outlet/Outlet.js
View file @e284103
+++ b/js/outlet/components/outlet/Outlet.js
View file @e284103
@@ -18,6 +18,18 @@ import OutletSrollableBar from './OutletSrollableBar';
 export default class Outlet extends Component {
     constructor(props) {
         super(props);
+        this._onPressProductListProduct = this._onPressProductListProduct.bind(this);
+
+    }
+
+    _onPressProductListProduct(product,rowId=0,tabLabel) {
+        let {
+            categoryList,
+        } = this.props;
+
+        let initialPage = categoryList?categoryList.get('initialPage'):0;
+
+        this.props.onPressProductListProduct && this.props.onPressProductListProduct(product,rowId,tabLabel,initialPage)
     }
     render() {
@@ -41,6 +53,9 @@ export default class Outlet extends Component {
                 {!isFetching?<ScrollableTabView
                     initialPage={initialPage}
                     renderTabBar={() => <OutletSrollableBar />}
+                    onChangeTab={(obj) => {
+                      this.props.onChangeTab && this.props.onChangeTab(list?list[obj.i].get('sort_name'):'');
+                  }}
                 >
                     {list.map((item, i) => {
                         let name = item.get('sort_name');
@@ -54,7 +69,7 @@ export default class Outlet extends Component {
                                 getOutletHomeResource = {this.props.getOutletHomeResource}
                                 getOutletActivityList = {this.props.getOutletActivityList}
                                 onPressProduct = {this.props.onPressProduct}
-                                onPressProductListProduct={this.props.onPressProductListProduct}
+                                onPressProductListProduct={this._onPressProductListProduct}
                                 setActivityFliter = {this.props.setActivityFliter}
                                 onPressFilter = {this.props.onPressFilter}
                                 onEndReached = {this.props.onEndReached}
--- a/js/outlet/components/outlet/OutletDoubleImage.js
View file @e284103
+++ b/js/outlet/components/outlet/OutletDoubleImage.js
View file @e284103
@@ -31,7 +31,7 @@ export default class OutletDoubleImage extends React.Component {
     render() {
-		let {resource} = this.props;
+        let {resource  ,row_ID} = this.props;
         if (!resource) {
 			return null;
 		}
@@ -42,16 +42,20 @@ export default class OutletDoubleImage extends React.Component {
 		let url0 = data[0].url;
 		let src1 = getSlicedUrl(data[1].src, backgroundWidth, backgroundHeight);
 		let url1 = data[1].url;
+
+        let template_name = resource.get('template_name');
+        let template_id = resource.get('template_id');
+
 		return (
 			<View style={styles.viewStyle}>
-				  <TouchableOpacity onPress={() => {this.props.onPressProduct&&this.props.onPressProduct(url0)}} >
+				  <TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url0,row_ID,1,template_name,template_id)}} >
 					  <YH_Image
 					  	url={src0}
 						style={styles.thumbnail}
 					  />
 				  </TouchableOpacity>
-				 <TouchableOpacity onPress={() => {this.props.onPressProduct&&this.props.onPressProduct(url1)}} >
+				 <TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url1,row_ID,1,template_name,template_id)}} >
 					  <YH_Image
 					   url={src1}
 					   style={styles.thumbnail}
--- a/js/outlet/components/outlet/OutletPageListView.js
View file @e284103
+++ b/js/outlet/components/outlet/OutletPageListView.js
View file @e284103
@@ -37,25 +37,44 @@ export default class OutletPageListView extends Component {
         this._onRefresh = this._onRefresh.bind(this);
         this.setActivityFliter = this.setActivityFliter.bind(this);
         this._onPressFilter = this._onPressFilter.bind(this);
+        this._onPressProductListProduct = this._onPressProductListProduct.bind(this);
+        this._onPressProduct = this._onPressProduct.bind(this);
+
     }
 	componentDidMount() {
         this._onRefresh && this._onRefresh(false);
 	}
+    _onPressProduct (url,rowId,sectionId,templateName,template_id){
+        let {
+            tabLabel,
+        } = this.props;
+        this.props.onPressProduct && this.props.onPressProduct(url,tabLabel,rowId,sectionId,templateName,template_id)
+    }
+
+
+    _onPressProductListProduct(product,rowId=0) {
+        let {
+            tabLabel,
+        } = this.props;
+
+        this.props.onPressProductListProduct && this.props.onPressProductListProduct(product,rowId,tabLabel)
+    }
     _onRefresh(ptr) {
         let {
             resource,
+            tabLabel,
         } = this.props;
         if (resource.get('sort_name')=='即将开始') {
-            this.props.getOutletActivityList && this.props.getOutletActivityList(resource.get('content_code'),resource.get('yh_channel'),resource.get('type'));
+            this.props.getOutletActivityList && this.props.getOutletActivityList(resource.get('content_code'),resource.get('yh_channel'),resource.get('type'),tabLabel);
         }else if (resource.get('sort_name') == '即将结束') {
-            this.props.getOutletActivityList && this.props.getOutletActivityList(resource.get('content_code'),resource.get('yh_channel'),resource.get('type'));
+            this.props.getOutletActivityList && this.props.getOutletActivityList(resource.get('content_code'),resource.get('yh_channel'),resource.get('type'),tabLabel);
         }else {
             this.props.getOutletHomeResource && this.props.getOutletHomeResource(resource.get('content_code'),ptr);
-            this.props.getOutletActivityList && this.props.getOutletActivityList(resource.get('content_code'),resource.get('yh_channel'),resource.get('type'));
+            this.props.getOutletActivityList && this.props.getOutletActivityList(resource.get('content_code'),resource.get('yh_channel'),resource.get('type'),tabLabel);
         }
     }
@@ -104,22 +123,22 @@ export default class OutletPageListView extends Component {
     renderRow(rowData, sectionID, rowID, highlightRow) {
         if (sectionID == 'outletHomeReource') {
             if (rowData.get('template_name') == 'NL2R') {
-                return(<OutletThreeImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+                return(<OutletThreeImage resource={rowData} row_ID={rowID} onPressProduct={this._onPressProduct}/>);
             }else if (rowData.get('template_name') == 'focus') {
-                return(<OutletSwiper resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+                return(<OutletSwiper resource={rowData} row_ID={rowID} onPressProduct={this._onPressProduct}/>);
             }else if (rowData.get('template_name') == 'single_image') {
-                return(<OutletSingleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+                return(<OutletSingleImage resource={rowData} row_ID={rowID} onPressProduct={this._onPressProduct}/>);
             }else if (rowData.get('template_name') == 'small_pic') {
-                return(<OutletDoubleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+                return(<OutletDoubleImage resource={rowData} row_ID={rowID} onPressProduct={this._onPressProduct}/>);
             }else if (rowData.get('template_name') == 'recommend_content_five') {
-                return(<OutletRecommendFive resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+                return(<OutletRecommendFive resource={rowData} row_ID={rowID} onPressProduct={this._onPressProduct}/>);
             }else if (rowData.get('template_name') == 'app_hot_brands') {
-                return(<OutletRecommendFive resource={rowData} onPressProduct={this.props.onPressProduct}/>);
+                return(<OutletRecommendFive resource={rowData} row_ID={rowID} onPressProduct={this._onPressProduct}/>);
             }else if (rowData.get('template_name') == '文字广告') {
                 // return(<TripleImage resource={rowData} onPressProduct={this.props.onPressProduct}/>);
             }
         }else if (sectionID == 'activityList') {
-            return(<ActivityCell resource={rowData} key = {rowID + 'activityList'} showToast={this.props.showToast} onPressProduct={this.props.onPressProduct}/>);
+            return(<ActivityCell resource={rowData} key = {rowID + 'activityList'} showToast={this.props.showToast}  row_ID={rowID} onPressProduct={this._onPressProduct}/>);
         }else if (sectionID == 'activityMore') {
             if (rowData == 'more') {
                 let sourceIcon = require('../../../brandStore/image/filter/brandstore_filter_arrow_down_normal.png');
@@ -142,7 +161,7 @@ export default class OutletPageListView extends Component {
                     key={'row' + rowID}
                     rowID={rowID}
                     data={rowData}
-                    onPressProduct={this.props.onPressProductListProduct}/>
+                    onPressProduct={this._onPressProductListProduct}/>
             );
         }
         return null;
--- a/js/outlet/components/outlet/OutletRecommendFive.js
View file @e284103
+++ b/js/outlet/components/outlet/OutletRecommendFive.js
View file @e284103
@@ -41,11 +41,14 @@ export default class OutletRecommendFive extends React.Component {
 	renderRow(rowData, sectionID, rowID, highlightRow) {
+        let {resource ,row_ID} = this.props;
+        let template_name = resource?resource.get('template_name'):'';
+        let template_id = resource?resource.get('template_id'):0;
 		let newSrc = getSlicedUrl(rowData.get('src'), 80, 80, 2);
 		return (
 			<TouchableOpacity activeOpacity={0.5}  onPress={() => {
-				this.props.onPressProduct && this.props.onPressProduct(rowData.get('url'));
+                this.props.onPressProduct && this.props.onPressProduct(rowData.get('url'),row_ID,1,template_name,template_id)
 			}}>
 				<View style={styles.rowContainer}>
 					<Image
@@ -84,9 +87,11 @@ export default class OutletRecommendFive extends React.Component {
 	}
     render() {
-		let data = this.props.resource.get('data');
+        let {resource ,sectionID ,rowID} = this.props;
+
+		let data = resource?resource.get('data'):null;
-		let list = data.get('list')?data.get('list').toArray():null;
+		let list = data&&data.get('list')?data.get('list').toArray():null;
         if (!list || list.length == 0) {
             return null;
         }
--- a/js/outlet/components/outlet/OutletSingleImage.js
View file @e284103
+++ b/js/outlet/components/outlet/OutletSingleImage.js
View file @e284103
@@ -31,10 +31,12 @@ export default class OutletSingleImage extends React.Component {
     render() {
-		let {resource} = this.props;
+        let {resource ,row_ID} = this.props;
         if (!resource) {
 			return null;
 		}
+        let template_name = resource?resource.get('template_name'):'';
+        let template_id = resource?resource.get('template_id'):0;
         let data = resource.get('data').toJS();
@@ -46,7 +48,7 @@ export default class OutletSingleImage extends React.Component {
 					activeOpacity={1}
 					style={{width: width, height: backgroundHeight}}
 					onPress={() => {
-						this.props.onPressProduct && this.props.onPressProduct(data[0].url);
+                        this.props.onPressProduct && this.props.onPressProduct(data[0].url,row_ID,1,template_name,template_id)
 					}}
 				>
 					<YH_Image
--- a/js/outlet/components/outlet/OutletSwiper.js
View file @e284103
+++ b/js/outlet/components/outlet/OutletSwiper.js
View file @e284103
@@ -57,11 +57,12 @@ export default class OutletSwiper extends React.Component {
     render() {
-        let {resource} = this.props;
+        let {resource  ,row_ID} = this.props;
         if (!resource) {
 			return null;
 		}
-
+        let template_name = resource?resource.get('template_name'):'';
+        let template_id = resource?resource.get('template_id'):0;
         let data = resource.get('data').toJS();
         if (data.length == 1) {
@@ -72,7 +73,7 @@ export default class OutletSwiper extends React.Component {
 	                    activeOpacity={1}
 	                    style={{width: width, height: swiperHeight}}
 	                    onPress={() => {
-	                        this.props.onPressProduct && this.props.onPressProduct(data[0].url);
+                            this.props.onPressProduct && this.props.onPressProduct(data[0].url,row_ID,1,template_name,template_id)
 	                    }}
 	                >
 	                    <YH_Image
@@ -105,7 +106,7 @@ export default class OutletSwiper extends React.Component {
 	                                key={i}
 	                                activeOpacity={1}
 	                                onPress={() => {
-	 		                            this.props.onPressProduct && this.props.onPressProduct(item.url);
+                                        this.props.onPressProduct && this.props.onPressProduct(item.url,row_ID,1,template_name,template_id)
 	                                }}
 	                            >
 	                                <YH_Image
--- a/js/outlet/components/outlet/OutletThreeImage.js
View file @e284103
+++ b/js/outlet/components/outlet/OutletThreeImage.js
View file @e284103
@@ -19,10 +19,12 @@ export default class OutletThreeImage extends Component{
 	  render() {
-		let {resource} = this.props;
+		 let {resource ,row_ID} = this.props;
 	  	if (!resource) {
 	  		return null;
 	  	}
+		let template_name = resource?resource.get('template_name'):'';
+		let template_id = resource?resource.get('template_id'):0;
 	  	let data = resource.get('data').toJS();
@@ -36,20 +38,21 @@ export default class OutletThreeImage extends Component{
 	    let url3 = data.right[1].url;
+
         return (
             <View style={styles.container}>
 				<View style={styles.leftView}>
-					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url1)}} >
+					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url1,row_ID,1,template_name,template_id)}} >
 						<View style={styles.leftImage}>
 							<YH_Image url={src1} style={styles.leftImage}></YH_Image>
 						</View>
 					</TouchableOpacity>
 				</View>
 				<View style={styles.rightView}>
-					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url2)}} >
+					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url2,row_ID,1,template_name,template_id)}} >
 						<YH_Image url={src2} style={styles.rightImage1}></YH_Image>
 					</TouchableOpacity>
-					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url3)}} >
+					<TouchableOpacity onPress={() => {this.props.onPressProduct && this.props.onPressProduct(url3,row_ID,1,template_name,template_id)}} >
 						<YH_Image url={src3} style={styles.rightImage2}></YH_Image>
 					</TouchableOpacity>
 				</View>
--- a/js/outlet/containers/OutletContainer.js
View file @e284103
+++ b/js/outlet/containers/OutletContainer.js
View file @e284103
@@ -50,6 +50,8 @@ class OutletContainer extends Component {
         this._showToast = this._showToast.bind(this);
         this._hideToastMessage = this._hideToastMessage.bind(this);
         this._onSelectChannel = this._onSelectChannel.bind(this);
+        this._onChangeTab = this._onChangeTab.bind(this);
+
         this.subscription = NativeAppEventEmitter.addListener(
             'ChannelDidChangeEvent',
             (reminder) => {
@@ -66,6 +68,12 @@ class OutletContainer extends Component {
         this.subscription && this.subscription.remove();
     }
+    _onChangeTab(sort_name){
+        let params = {
+              TAB_ID: sort_name,
+        }
+        ReactNative.NativeModules.YH_CommonHelper.logEvent('YB_OUTLET_TAB_C', params);
+    }
     _onSelectChannel(channel){
         this.props.actions.setChannel(channel);
     }
@@ -81,25 +89,49 @@ class OutletContainer extends Component {
         this.props.actions.getOutletHomeResource(content_code,ptr);
     }
-    _getOutletActivityList(content_code,yh_channel,type){
+    _getOutletActivityList(content_code,yh_channel,type,tabLabel){
         this.props.actions.getOutletActivityList(content_code,yh_channel,type);
+        let params = {
+              TAB_ID: tabLabel,
+        }
+        ReactNative.NativeModules.YH_CommonHelper.logEvent('kAnalyticsYB_OUTLET_HOME_PAGE_L', params);
     }
     _setActivityFliter(content_code,activityMore) {
         this.props.actions.setActivityFliter(content_code,activityMore);
     }
-    _onPressProduct(url){
+    _onPressProduct(url,tabLabel,rowId=0,sectionId=0,templateName,template_id){
         ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
+        if (templateName) {
+            let params = {
+                  TAB_ID: tabLabel,
+                  F_ID: template_id,
+                  F_NAME: templateName,
+                  F_URL: url,
+                  F_INDEX: parseInt(sectionId),
+                  I_INDEX: parseInt(rowId)+1,
+            }
+            ReactNative.NativeModules.YH_CommonHelper.logEvent('YB_OUTLET_FLR_C', params);
+        }
     }
-    _onPressProductListProduct(product) {
+    _onPressProductListProduct(product,rowId=0,tabLabel,initialPage) {
       let productSkn = product && product.get('product_skn', 0);
       if (!productSkn) {
           return;
       }
       let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.productDetail","params":{"product_skn":"${productSkn}"}}`;
       ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url);
+
+      let productId = product && product.get('product_id', 0);
+      let params = {
+            TAB_ID: tabLabel,
+            SORT_TYPE: initialPage,
+            PRD_ID: productId,
+            PRD_NUM: parseInt(rowId)+1,
+      }
+      ReactNative.NativeModules.YH_CommonHelper.logEvent('YB_OUTLET_GOODS_LIST_C', params);
     }
     _showToast(value){
@@ -140,6 +172,7 @@ class OutletContainer extends Component {
                 onEndReached = {this._onEndReached}
                 showToast = {this._showToast}
                 hideToastMessage = {this._hideToastMessage}
+                onChangeTab = {this._onChangeTab}
             />
         );
     }