Use withRouter for TabsBar (#6652)
TabsBar refers to router, which is a private context property of react-router. withRouter is a recommended alternative. It also allows to track location changes even if React.PureComponent is used.
This commit is contained in:
		
							parent
							
								
									78d772af86
								
							
						
					
					
						commit
						61e6275781
					
				
					 1 changed files with 5 additions and 7 deletions
				
			
		|  | @ -1,6 +1,6 @@ | |||
| import React from 'react'; | ||||
| import PropTypes from 'prop-types'; | ||||
| import { NavLink } from 'react-router-dom'; | ||||
| import { NavLink, withRouter } from 'react-router-dom'; | ||||
| import { FormattedMessage, injectIntl } from 'react-intl'; | ||||
| import { debounce } from 'lodash'; | ||||
| import { isUserTouching } from '../../../is_mobile'; | ||||
|  | @ -24,14 +24,12 @@ export function getLink (index) { | |||
| } | ||||
| 
 | ||||
| @injectIntl | ||||
| export default class TabsBar extends React.Component { | ||||
| 
 | ||||
|   static contextTypes = { | ||||
|     router: PropTypes.object.isRequired, | ||||
|   } | ||||
| @withRouter | ||||
| export default class TabsBar extends React.PureComponent { | ||||
| 
 | ||||
|   static propTypes = { | ||||
|     intl: PropTypes.object.isRequired, | ||||
|     history: PropTypes.object.isRequired, | ||||
|   } | ||||
| 
 | ||||
|   setRef = ref => { | ||||
|  | @ -59,7 +57,7 @@ export default class TabsBar extends React.Component { | |||
| 
 | ||||
|           const listener = debounce(() => { | ||||
|             nextTab.removeEventListener('transitionend', listener); | ||||
|             this.context.router.history.push(to); | ||||
|             this.props.history.push(to); | ||||
|           }, 50); | ||||
| 
 | ||||
|           nextTab.addEventListener('transitionend', listener); | ||||
|  |  | |||
		Reference in a new issue