Do not mutate state directly. Use setState() react/no-direct-mutation-state

First of all, we should not store the ui components inside state variable, state should contain only data. All the ui part should be inside render method.

If you want to render some component on the basis of any data then use conditional rendering. Check the value of this.state.loginButton and if it is null then render that button.

Like this:

constructor(props) {
    super(props)
    this.state = {
        loginButton: props.username,
        benchmarkList: ''
    }
}

render(){
    return(
        <div>
            {!this.state.loginButton ? <GoogleButton></GoogleButton> : null}
        </div>
    )
}

Ideally we should not store the props value in state also, so directly use this.props.username, i did that because don't know about the complete code.

constructor(props) {
    super(props)
    this.state = {
      loginButton: props.username == null? <GoogleButton></GoogleButton>: '',
      benchmarkList: ''
    }
  }

Or You can use setState in componentWillMount()

componentWillMount(){
   let loginButton = props.username == null? <GoogleButton></GoogleButton>: '';
   this.setState({loginButton: loginButton});
}