DOM reloading after setState function

Question

Having a small problem with React where when I call a function which setStates, the page reloads on browser and state remains unchanged.

input-area.js:

#updateContent function

handleInputSubmit(e){
    this.props.updateContent('Work')
}

parent.js:

this.state = {
    isActiveWork: false,
}

render(){
    return(
        ...
        <InputArea updateContent = {this.updateContent}/>
        ...
        )

updateContent(content){
        if (content === 'Work'){
            this.setState(state => ({
                isActiveWork: !state.isActiveWork 
            }))
        }

everytime handleInputSubmit is called, the page on the browser refreshes and state.isActiveWorkremains false