I am fairly new to react and am having an issue. I am using reactstrap to call a modal on click of a button. In reactstrap docs the modal is called on the click of a button in the modal component like so:

```
import React from 'react';
import { Button, Modal, ModalFooter, ModalHeader, ModalBody } from 'reactstrap';

class SubmitConfirmation extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      modal: false,
      fade: true,
    };

    this.toggle = this.toggle.bind(this);
  }

  toggle() {
    this.setState({
      modal: !this.state.modal,
      fade: !this.state.fade,
    });
  }

  render() {
    return (
      <div>
        <Button color="danger" onClick={this.toggle}>
          TOGGLE
        </Button>
        <Modal isOpen={this.state.modal} toggle={this.toggle} fade={this.state.fade} className={this.props.className}>
          <ModalHeader toggle={this.toggle}>Modal title</ModalHeader>
          <ModalBody></ModalBody>
          <ModalFooter>
            <Button color="primary" onClick={this.toggle}>
              Do Something
            </Button>{' '}
            <Button color="secondary" onClick={this.toggle}>
              Cancel
            </Button>
          </ModalFooter>
        </Modal>
      </div>
    );
  }
}

export default SubmitConfirmation;

```

I want to call the modal from the click of a button in a parent component How do I do this?

```
export default class SampleApp extends React.Component {
    constructor(props) {
        super(props);
        this.state = {}
    }

    render() {
        return (
            <div>
                <Button

              color="primary"
              size="sm"
              style={{ width: '100%' }}
              onClick={this.toggle} 
              Submit
            </Button>
            </div>
        )
    }
}

```

How do I call the button from parent component: