title: Reusing state in React with Hooks
body: <p>I see myself using declarations like:</p>
  <pre><code>const [state, setState] = React.useState({value: ''});
      
  return &lt;InputComponent {...properties} value={state.value} onChange={(event) =&gt; setState({value: event.target.value || event.target.checked}
  </code></pre>
  <p>Whenever a component needs state I have to rewrite this down and it feels not reusable at all. I looked for render props and HOC, but couldn't reuse state.</p>
  <p>I tried creating:</p>
  <pre><code>const StatefulInput = (InputComponent) =&gt; {
  
    const [state, setState] = React.useState({value: ''});
  
    return &lt;InputComponent value={state.value} onChange={(event) =&gt; setState({value: event.target.value || event.target.checked /&gt;
  }
  </code></pre>
  <p>But I couldn't reuse, I got 'invalid Hook', 'render received object not something else' errors and some other ones.</p>
  <p>How can I do it? Is it possible to reuse this hook?</p>