title: React useState setting initial value has no effect
body: <p>Below is my functional component's relevant code to the issue,</p>
  
  <p>How can I set the initial value after some processing of data within useState() hook?</p>
  
  <pre><code>const data = props.data ? props.data : {};
  const statusOptions = [
    { label: "Active", value: "active" },
    { label: "Inactive", value: "inactive" },
    { label: "Complete", value: "completed" },
  ];
  const defaultStatus = statusOptions.filter(
    option =&gt; option.value === data["status"],
  )[0];
  
  //This does not work
  const [status, setStatusValue] = useState(defaultStatus);
  console.log(status); //undefined
  
  //Below works
  const [status, setStatusValue] = useState({
    label: "Complete",
    value: "completed",
  });
  console.log(status); //{label:"Complete",value:"completed"}
  </code></pre>