Нажатие на динамический c маршрут, определяемый значением, контролируемым вызовом API

Question

У меня проблема с отправкой на динамический c маршрут. После нажатия кнопки отправки на компоненте входа в систему у меня отправлено действие, которое обновляет state.account.id:

export const loginAndGetAccount = credentials => dispatch => {
    dispatch({ type: GET_ACCOUNT_START })
    return axios
        .post('https://foodtrucktrackr.herokuapp.com/api/auth/login/operators', credentials)
        .then(res => {
            console.log(res);
            dispatch({ type: GET_ACCOUNT_SUCCESS, payload: res.data.id })
            localStorage.setItem("token", res.data.token)
        })
        .catch(err => console.log(err));
}

Эта функция, loginAndGetAccount, использует отправленные действия для обновления значения в state.account.id например:

case GET_ACCOUNT_START:
            return {
                ...state,
                isLoading: true
            }
        case GET_ACCOUNT_SUCCESS:
            return {
                ...state,
                isLoading: false,
                account: {
                    id: action.payload
                }
            }

Затем я хочу, чтобы это значение, хранящееся в state.account.id, использовалось, чтобы сообщить приложению, куда направляться. Я попытался использовать ловушку useEffect для выполнения sh. Однако код внутри хука useEffect просто ломает все; Я получаю сообщение об ошибке: невозможно прочитать свойство 'pu sh' из неопределенного. Как я могу решить эту проблему?

вот код в приложении. js:

function App(props) {
  const dynamicRoute = `/api/vendor/${props.accountId}`

  useEffect(() => {
    if(props.accountId !== undefined && !props.isLoading) {
      props.history.push(`/api/vendor/${props.accountId}`);
    }
  }, [props.accountId])

  return (
    <Router>
      <div className="App">
        <Route exact path="/" component={Login} />
        <PrivateRoute path={dynamicRoute} component={Dashboard} />
      </div>
    </Router>
  );
}

const mapStateToProps = state => {
  return {
    accountId: state.account.id,
    isLoading: state.isLoading
  }
}

export default connect(mapStateToProps)(App);