title: Handle button click with two different handler in different condition - ReactJS
body: <p>I want to handle the click of my custom button component in two separate conditions.
  This is the <code>custom-button</code> component:</p>
  
  <pre><code>function CustomButton({status, onStop, onClick}) {
  
      return (
          // ... 
          &lt;button onClick={status ? onStop : onClick}/&gt;
          // ... 
      )
  }
  </code></pre>
  
  <p>This code is just a simple example to explain my question. and I can't separate my component according to the value of <code>status</code>.</p>
  
  <p>My question is, Is this an anti-pattern or bad practice in a component? If yes, what's the best practice to do?</p>