Настройте props.insertBtn в btnGroup.

Question

Я добавил настраиваемую кнопку в моем btngroupтем временем хочу отключить свой props.inserBtn основанный на разрешении пользователей, как следующие

< InsertButton disabled={!this.state.hasPermission}>Let me in</InsertButton >

Но проблема в том, что я использовал btnGroup а также props.insertBtn не может быть изменено Ниже приведен мой код:

class UploadFormatter extends React.Component {
    constructor(props) {
    super(props);
    this.onClick = this.onClick.bind(this);
  }

  onMapAction = (message) => {
    alert(message);
  }

  createCustomButtonGroup = props => {
    return (
      <ButtonGroup className='my-custom-class' sizeClass='btn-group-md'>
        { props.insertBtn }
        { props.deleteBtn }
        <button type='button'
          className={ `btn btn-primary` } onClick={() => this.onClick('Message')}>
          MyCustomBtn
        </button>
      </ButtonGroup>
    );
  }

  render() {
    const selectRow = {
      mode: 'checkbox'
    };
    const options = {
      insertModalHeader: this.createCustomModalHeader,
      insertModalFooter: this.createCustomModalFooter,
      insertModalBody: this.createCustomModalBody,
      insertText: 'Upload',
      afterDeleteRow: this.onAfterDeleteRow,
      btnGroup: this.createCustomButtonGroup
    };
    return (
      <BootstrapTable data={ products }
        options={ options }
        selectRow={ selectRow }
        insertRow
        deleteRow
        exportCSV>
        <TableHeaderColumn dataField='id' isKey={ true }>Product ID</TableHeaderColumn>
        <TableHeaderColumn dataField='name'>Product Name</TableHeaderColumn>
        <TableHeaderColumn dataField='price'>Product Price</TableHeaderColumn>
      </BootstrapTable>
    );
  }
}