React with Typescript: Property 'push' does not exist on type 'History'

Question

I'm trying to navigate away from a view by pushing into the history object. However when I try to push a route into it, I get an error message:

Property 'push' does not exist on type 'History'.

  render(){
    return (
        <div className="loginWrapper">
    withRouter(({history}) => (<button onClick={()=>{history.push('/home')}} className="btn btn-primary">Pieteikties</button>))
  </div>
    )  
}

What can I do to fix this?

EDIT:

I also tried this:

logIn(){
  this.props.history.push('/new-location')
}

with a component like this:

 render(){
    return (
        <div className="loginWrapper">
<button onClick={this.logIn} className="btn btn-primary">Pieteikties</button>
</div>
    )  
}

And it didn't work.

Answer 1

UPDATE: I found a new way to do this type of thing. Same as b4 you need to install them types:

1.- npm i react-router react-router-dom

2.- npm i -D @types/react-router @types/react-router-dom

import React from "react";
import { RouteComponentProps } from "react-router-dom";

interface MyComponentProps extends RouteComponentProps {
 someOfYourOwnProps: any;
 someMorePropsIfNeedIt: any;
}

interface MyComponentState {
  someProperty: any;
  another: any;
}

export class MyComponent extends React.Component<MyComponentProps, MyComponentState> {

    public state: MyComponentState;
    public constructor (props: MyComponentProps) {
        super(props);

        this.state = {
            someProperty: "",
            another: ""
        }
    }

    public onClickHandler (evt: React.MouseEvent<HTMLButtonElement, MouseEvent>): void {
        evt.preventDefault();
    }

    public componentDidMount () {
        this.props.history;
    }
   public render (): React.ReactElement<MyComponentProps> {
        return (
            <div>trol</div>
        )
    }
}

---

hihitl i know whats happening. Hope you sill need it.

1.- npm i react-router react-router-dom

2.- npm i -D @types/react-router @types/react-router-dom

import React from "react";
import { History, LocationState } from "history";

interface MyComponentProps {
 someOfYourOwnProps: any;
 history: History<LocationState>;
 someMorePropsIfNeedIt: any;
}

then on your component if it is a class do

class MyComponent extends Component<MyComponentProps, {}> {}

if it is a functional

const MyComponent = (props: MyComponentProps) => {}