title: I want Popup to close, how do I do it?
body: <p>When I press the <code>AddAction</code> button from the <code>Addaction</code> component, I want the popup to close. ?</p>
  
  <p>in fact, if I reach the <code>onCloseAddActionModal</code> method in my component which is popup from AddAction component, my problem will be solved.</p>
  
  <p>AddAction Component: </p>
  
  <pre><code>   class AddAction extends React.Component { 
  
      constructor() {
          super();
          this.state = {
              items: [{id:null, actiontype: null}],
              error: null,
              isLoaded: false,
              selectId: null,
          }
          this.handleCheckChieldElement = 
          this.handleCheckChieldElement.bind(this); // set this,  because you need get methods from CheckBox 
        }
  
      componentDidMount = () =&gt; {
          ....
      }
  
      fetchAdd = (carid, offboardingactiontypeid) =&gt; {
          ...
      }
  
      handleCheckChieldElement = (id, e) =&gt; {
          this.setState({selectId: id})
      }
  
      render() {
        const items = this.state.items;
        return (
  
          &lt;div&gt;
                  &lt;ul className="popupAddAction"&gt;
                      {
                          items.map((item) =&gt; {
                              return (
                                  &lt;li className="list" key={item.id}&gt;
                                      &lt;input  key={item.id} onClick= 
                      {(e) 
                                   =&gt; 
  
                      this.handleCheckChieldElement(item.id, 
                                  e)} type="checkbox" /&gt; 
                                   {item.actiontype}
                                 &lt;/li&gt;
                              )
                          })
                      } 
                  &lt;/ul&gt;
                  &lt;div className="popupAddAction--btn"&gt;
                      &lt;button
                                      onClick=
                                      { () =&gt; 
                   this.fetchAdd(this.props.id, this.state.selectId)}
                                      className="btn btn-primary 
                                     popupAddAction--btn" 
                                  &gt;
                                      Add Action
                      &lt;/button&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
                 );
                }
               } 
  
             export default AddAction;
  
  Popup Component:
  
           class OffBoarding extends Component {
            this.state = {
            openAddAction: false
            };
  
            onOpenAddActionModal = () =&gt; {
              this.setState({ openAddAction: true });
            };    
  
            onCloseAddActionModal = () =&gt; {
              this.setState({ openAddAction: false });
            };
            render(){
            return{
            &lt;div&gt;
            &lt;Button className="btn btn-danger commentPlus" onClick= 
             {this.onOpenAddActionModal}&gt; &lt;FontAwesomeIcon icon= 
             {faPlus}/&gt;&lt;/Button&gt;
            &lt;/div&gt;
            {this.state.openAddAction ? 
                &lt;div style={styles}&gt;
                 &lt;Modal open= 
                {this.state.openAddAction} onClose= 
                {this.onCloseAddActionModal} center&gt;
                                        &lt;AddAction id= 
            {this.state.carid} 
                                     close= 
            {this.state.openAddAction}/&gt;
                  &lt;/Modal&gt;
                 &lt;/div&gt; : null
               }}
            }}
  </code></pre>