[ReactJS] Uncaught TypeError: this.state is not a function

Bonjour,

Je suis entrain de suivre le tuto sur RactJS, je suis au chap5: les évènements. J'essaye de mettre en place un nombre qui s'incrémente au fil du temps et un bouton qui permet de faire pause cette incrémentation.

Ce que je fais

class IncrementWithPause extends React.Component {

    constructor(props){
        super(props)
        this.state = {n: 0, timer: null}
    }

    componentDidMount() {
        this.play()
    }

    componentWillUnmount() {
        this.pause()
    }

    increment(){
        this.setState(function(state, props){
            return{n: state.n + 1}
        })
    }

    pause(){
        clearInterval(this.state.timer)
        this.setState({
            timer: null
        })
    }

    play(){
        this.state({
            timer: setInterval(this.increment.bind(this), 1000)
        })
    }

    render() {
        return <div> 
            Valeur: {this.state.n}
            <button onClick={this.pause.bind(this)}> Pause </button>
         </div>
    }

}

function Home() {
    return <div>
        <IncrementWithPause />
    </div>
}

ReactDOM.render(<Home/>, document.querySelector('#app'))

Ce que j'obtiens

Uncaught TypeError: this.state is not a function
play http://127.0.0.1:5500/index.html line 24 > scriptElement:92
componentDidMount http://127.0.0.1:5500/index.html line 24 > scriptElement:67
React 17
<anonymous> http://127.0.0.1:5500/index.html line 24 > scriptElement:125
standalone 6/babel.min.js:24
standalone 6/babel.min.js:24
standalone 6/babel.min.js:24
standalone 6/babel.min.js:24
index.html line 24 > scriptElement:92:18
The above error occurred in the <IncrementWithPause> component:
in IncrementWithPause (created by Home)
in div (created by Home)
in Home

Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries. react-dom.development.js:19662:15
Uncaught TypeError: this.state is not a function
play http://127.0.0.1:5500/index.html line 24 > scriptElement:92
componentDidMount http://127.0.0.1:5500/index.html line 24 > scriptElement:67
React 17
<anonymous> http://127.0.0.1:5500/index.html line 24 > scriptElement:125
standalone 6/babel.min.js:24
standalone 6/babel.min.js:24
standalone 6/babel.min.js:24
standalone 6/babel.min.js:24
index.html line 24 > scriptElement:92:18
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
in IncrementWithPause (created by Home)
in div (created by Home)
in Home react-dom.development.js:82:32

​