title: How to join data from two collections by reference field in Firestore?
body: <p>I have 2 collections in my firestore. One called owners and the second is unicorns.
  An owner has only a name field and a unicorn has a name and a reference to the owner.
  I want a query to return an array of objects that looks like this</p>
  <pre><code>unicorns = { id: 123,
                  name: Dreamy,
                  owner: { id: 1
                           name: John Cane
                         }
                 }
  </code></pre>
  <p>my query looks like this but there is something missing that I can't figure out</p>
  <pre><code>let unis = [];
        db
        .collection(&quot;unicorns&quot;)
        .get()
        .then((querySnapshot) =&gt; {
          querySnapshot.forEach((doc) =&gt; {
            let uni = {
              id: doc.id,
              name: doc.data().name,
              owner: doc.data().owner,
            };
            if (uni.owner) {
              doc
                .data()
                .owner.get()
                .then((res) =&gt; {
                  uni.owner = {
                    id: res.id,
                    name: res.data().name,
                  };
                  unis.push(uni);
                  
                })
                .then(() =&gt; {
                  setUnicorns(unis);
                })
                .catch((err) =&gt; console.error(err));
            } else {
              unis.push(uni);
            }
          });
        })
  </code></pre>
  <p>When I setUnicorns hook and I try to map the results I don't get all the data I need</p>