title: Passing props to a react component wrapped in withRouter() function
body: <p>I am using React-Router v4 to navigate in my React app. The following is a component wrapped in the <code>withRouter()</code> function to make it able to change route on click: </p>
  
  <pre><code>const LogoName = withRouter(({history, props}) =&gt; (
    &lt;h1
      {...props}
      onClick={() =&gt; {history.push('/')}}&gt;
      BandMate
    &lt;/h1&gt;
  ));
  </code></pre>
  
  <p>As you can see I pass the <code>props</code> to the component, which I need in order to change the class of the component. The problem here is that <code>props</code> is <code>undefined</code> in the <code>&lt;LogoName&gt;</code> component. I need to be able to change the class of this component when I click on another component, like this:</p>
  
  <pre><code>&lt;LogoName className={this.state.searchOpen ? "hidden" : ""} /&gt;
  &lt;div id="search-container"&gt;
    &lt;SearchIcon
      onClick={this.handleClick}
      className={this.state.searchOpen ? "active" : ""} /&gt;
    &lt;SearchBar className={this.state.searchOpen ? "active" : ""}/&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is how I handle the click. Basically just setting the state.</p>
  
  <pre><code>constructor(){
    super();
    this.state = {
      searchOpen: false
    }
  }
  
  handleClick = () =&gt; {
    this.setState( {searchOpen: !this.state.searchOpen} );
  }
  </code></pre>
  
  <p>Is there a way for me to pass <code>props</code> to a component that is wrapped inside the <code>withRouter()</code> function or is there a similar way to create a component which has the ability to navigate with React-Router and still receive props?</p>
  
  <p>Thanks in advance.  </p>