import { useCallback } from 'react' ; import { useLocation , useHistory } from 'react-router-dom' ; import { useDispatch } from 'react-redux' ; import useAuthProvider , { defaultAuthParams } from './useAuthProvider' ; import { resetNotification } from '../actions/notificationActions' ; see useAuthProvider returns { Function } example const useLogin = ( ) : Login => { const authProvider = useAuthProvider ( ) ; const location = useLocation ( ) ; const locationState = location . state as any ; const history = useHistory ( ) ; const dispatch = useDispatch ( ) ; const nextPathName = locationState && locationState . nextPathname ; const nextSearch = locationState && locationState . nextSearch ; const login = useCallback ( ( params = { } , pathName ) => authProvider . login ( params ) . then ( ret => { dispatch ( resetNotification ( ) ) ; const redirectUrl = pathName ? pathName : nextPathName + nextSearch || defaultAuthParams . afterLoginUrl ; history . push ( redirectUrl ) ; return ret ; } ) , [ authProvider , history , nextPathName , nextSearch , dispatch ] ) ; const loginWithoutProvider = useCallback ( ( _ , __ ) => { dispatch ( resetNotification ( ) ) ; history . push ( defaultAuthParams . afterLoginUrl ) ; return Promise . resolve ( ) ; } , [ history , dispatch ] ) ; return authProvider ? login : loginWithoutProvider ; } ; param { Object } params param { string } pathName return { Promise } type Login = ( params : any , pathName ? : string ) => Promise < any > ; export default useLogin ;