title: Firebase 'add' data to existing document not working
body: <p>I have a document that was created during a registration process that creates a document with the following property:</p>
  <p><code>username: &quot;GOOOOD&quot;</code></p>
  <p>Now, I am trying to <code>add</code> a new property called <code>firstName</code> to the document so it looks like this:</p>
  <pre><code>username: &quot;GOOOOD&quot;
  firstName: &quot;Roger&quot;
  </code></pre>
  <p>However, the <code>add</code> function doesn't seem to be working:</p>
  <pre class="lang-js prettyprint-override"><code>function ProfileContainer() {
    const [profile, setProfile] = useState();
    const [{ user }, dispatch] = useStateValue();
    const [firstName, setFirstName] = useState(&quot;&quot;);
  
    // add first and last name
    const handleClick = () =&gt; {
      if (user) {
        db.collection(&quot;users&quot;).doc(user).collection(&quot;profile&quot;).doc(user).add({
          firstName: firstName,
        });
      }
    };
  
  
    return (
      &lt;div className=&quot;profileContainer&quot;&gt;
              &lt;div className=&quot;name__input&quot;&gt;
                &lt;input
                  type=&quot;text&quot;
                  placeholder=&quot;First Name&quot;
                  onChange={(e) =&gt; setFirstName(e.target.value)}
                  value={firstName}
                /&gt;
              &lt;/div&gt;
            &lt;button onClick={handleClick}&gt;Update&lt;/button&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    );
  }
  </code></pre>
  <p>Unfortunately, the <code>add</code> function doesn't seem to be working.</p>
  <p>I get the following error:</p>
  <blockquote>
  <p>TypeError: <em>firebase_utils__WEBPACK_IMPORTED_MODULE_4</em>_.db.collection(...).doc(...).collection(...).doc(...).add is not a function</p>
  </blockquote>
  <p><code>set</code> seems to work but I don't want to delete the entire document.</p>