New to react, I currently have a list of buttons mapped based off an api response like so:

render() { 
  return(
      <div> 
        <h4>User Status:</h4> 
        <div className='buttonContainer'>
        {this.state.data.map((status =>   
            <li key={status.key}>
              <button id={status.key} value = {status.text} onClick={this.nextStep}/>
                {status.text}
              </button>
            </li>
          ))}
        </div>
      </div>
    )      
  }

The nextStep function changes a users status to whatever the value of the pressed button is (all based on the data) I don't want a user to be able to press a button multiple times however. How can I disable the button that was pressed without disabling every button in the list?