title: Can't insert new input to my form after putting old info in the form
body: <p>I have a form completed with info requested from the database. But the form is not letting me update the form, I can't write anything on the input. What I am using wrong?</p>
  
  <p>After a Graphql query, the title is store in the jsonFromDataBase variable. If the query is empty I want nothing in my input, if it's not, I eant the title but I also want to be able to change it. The problem is that the title is not letting write anything</p>
  
  <p>Here is what my code looks like:</p>
  
  <pre><code>   const Form = () =&gt; {
        useEffect(() =&gt; {
            KeyUtils.resetGenerator();
        }, []); 
  
         const [newTitle, setNewTitle] = useState("");  
  
          return (
              &lt;Title
                 type="text"
                 value={jsonFromDataBase.title ? jsonFromDataBase.title : newTitle}
                 placeholder="Title"
                 onChange={e =&gt; {
                    setNewTitle(e.target.value);
                 }}
                 required
              /&gt;
  
         )
  
    }
  
  
    const Title = styled.input`
       margin-bottom: 10px;
       padding: 10px;
       border: 1px solid white;
    `;
  
    export default Form;
  </code></pre>