import React from 'react' ; import { useParams , useLocation , useNavigate } from 'react-router-dom' ; import qs from 'querystring' ; const withRouter = < P extends unknown > ( WrapComponent ) => ( props ) : JSX . Element => { const params = useParams ( ) ; const location = useLocation ( ) ; const navigate = useNavigate ( ) ; const query = location . search ? qs . parse ( location . search . substr ( 1 ) ) : { } ; const historyPush = ( pushProps , state ? ) => { if ( ! pushProps ) { return ; } if ( typeof pushProps === 'object' ) { navigate ( pushProps ?. pathname , { state : pushProps ?. state } ) ; return ; } if ( typeof pushProps === 'string' ) { navigate ( pushProps , state ) ; } } ; return ( < WrapComponent { ... props } match = { { params } } location = { { ... location , query } } history = { { push : historyPush , goBack : ( ) => navigate ( - 1 ) , goForward : ( ) => navigate ( 1 ) , go : ( num ) => navigate ( num ) , } } />); } ; export default withRouter ;