Асинхронные обновления в реальном времени с проблемой Firestore

Question

Я пытаюсь получить данные в реальном времени из Firestore с помощью React-Native. У меня есть файл helpers.js, в котором я храню и экспортирую все функции get и set для Firestore, и я просто импортирую их в App.js, чтобы использовать его.

Когда я пытаюсь получить только один раз (без реального времени)работает отлично. Это работает:

В helpers.js:

const waitlistRef = db.firestore().collection('waitlist');

export async function getWaitlist() {
  let waitlist = [];

  await waitlistRef.get().then(res => {
      res.forEach(doc => {
      waitlist.push(doc.data());
    });
  });

  return waitlist;
}

В App.js:

import { getWaitlist } from './helpers';

...

useEffect(() => {
 getWaitlist().then(waitlist => console.log(waitlist));
}, []);

Так что это работает, но я могу получить его только один раз (нет в реальном времени). Чтобы получать обновления в реальном времени, я попробовал этот метод:

В helpers.js:

const waitlistRef = db.firestore().collection('waitlist');

export async function getWaitlist() {
  let waitlist = [];

  await waitlistRef.onSnapshot(snapshot => {
    snapshot.forEach(doc =>
      waitlist.push(doc.data()),
    );
  });

  return waitlist;
}

В App.js:

import { getWaitlist } from './helpers';

...

useEffect(() => {
 getWaitlist().then(waitlist => console.log(waitlist));
}, []);

Но когдаЯ пытаюсь записать массив waitlist, который должен был быть возвращен из вспомогательной функции, я просто получаю пустой массив.

Есть идеи?