Подпишитесь на firestore из React.useEffect с помощью двух запросов (асинхронная операция)

# #reactjs #typescript #google-cloud-firestore

Вопрос:

У меня есть три коллекции в базе данных firestore: пользователи, клиенты и узлы. И примером интересующих свойств их документов является:

Пользователь (Имя документа: IDUSER)

 {
...<Non interesting properties>,
customer: ref = customers/IDCUSTOMER
}
 

Клиент (Название документа: IDCUSTOMER)

 {
...<Non interesting properties>
}
 

Узел (Имя документа: IDNODE)

 {
...<Non interesting properties>,
customer: ref = customers/IDCUSTOMER
}
 

С помощью этой конфигурации я хочу сгруппировать пользователей по назначенному клиенту (у одного клиента может быть несколько пользователей) и использовать этого назначенного клиента для предоставления доступа к узлам, назначенным данному клиенту. Таким образом, все пользователи из клиента могут просматривать узлы клиента. У меня нет проблем с этой конфигурацией.

Моя проблема в том, что в приложении ReactJS ( Машинопись) я хочу подписаться на данный компонент в коллекции узлов, чтобы получить новые добавленные узлы. Для этого мне нужно:

  1. Создайте запрос ( q1 ), чтобы назначить клиента текущему пользователю.
  2. Получить данные из q1 ( async функции).
  3. Создайте запрос ( q2 ) для получения узлов клиента (этот запрос зависит от данных, полученных на шаге 2).
  4. Выполните onSnapshot функцию и верните unsubscribe функцию на React.useEffect крючок, чтобы выполнить ее при демонтаже компонента.

Моя проблема в том, что поток зависит от async функции, конечная unsubscribe функция-это Promise<Unsubscribe> функция, и она выдает ошибку.

Я знаю, что использовать async React.useEffect это-плохая идея.

Как я могу это реализовать???

Заранее большое вам спасибо за потраченное время.