title: React useState does not seem to accept a default value here?
body: <p>I have a chart component in which specific lines can be shown/hidden. To keep track of which lines are active I keep an <code>activeKeys</code> array in a state. Initially I get the key names from a function <code>getKeys</code> that takes the array of data. </p>
  
  <p>When I do this:</p>
  
  <pre class="lang-js prettyprint-override"><code>    const defaultValue = getKeys(data)
      console.log('defaultValue from keys', defaultValue)
      const [activeKeys, setActiveKeys] = useState(defaultValue)
      console.log('activeKeys', activeKeys)
  </code></pre>
  
  <p>First console log shows the correct keys: </p>
  
  <pre class="lang-js prettyprint-override"><code>["createdCount", "confirmedCount", "hasFeedbackCount"]
  </code></pre>
  
  <p>Second console log shows <code>[]</code></p>
  
  <p><strong>But</strong> if I do:</p>
  
  <pre class="lang-js prettyprint-override"><code>const defaultValue = ["createdCount", "confirmedCount","hasFeedbackCount"]
  console.log('defaultValue', defaultValue)
  const [activeKeys, setActiveKeys] = useState(defaultValue)
  console.log('activeKeys', activeKeys)
  </code></pre>
  
  <p>First console log shows the same array: </p>
  
  <pre><code>["createdCount", "confirmedCount", "hasFeedbackCount"]
  </code></pre>
  
  <p><strong>And</strong> <code>activeKeys</code> shows the correct array:</p>
  
  <pre><code>["createdCount", "confirmedCount", "hasFeedbackCount"]
  </code></pre>
  
  <p>Is <code>useState</code> broken or something? By the <code>getKeys</code> is a simple function, no promise or anything like that. It looks like this:</p>
  
  <pre class="lang-js prettyprint-override"><code>const getKeys = (data: Props['data']): string[] =&gt; {
    const reduced = data.reduce((acc, datum) =&gt; [...acc, ...Object.keys(datum.lines)] as any, [])
    const setted = new Set(reduced)
    const arrayed = Array.from(setted)
    return arrayed
  }
  </code></pre>
  
  <p>The shape of <code>Props['data']</code> is:</p>
  
  <pre class="lang-js prettyprint-override"><code>  data: {
      date: string
      lines: Partial&lt;Record&lt;string, number&gt;&gt;
    }[]
  </code></pre>