0

When I call the function it will [object Promise] instead of data, I think the promise will be in a pending state, and it returns. Can anyone help me with how to do this in the right way?

Here is my util function.

export const GetDataFromSnapshot = async (snapshot) => {
  const data = [];
  try {
    return await snapshot.onSnapshot((docs) => {
      const currentState = [];
      docs.forEach((doc) => {
        currentState.push(doc.data());
      });
      data.push(currentState);

      console.log(currentState);
      // 0:
      //   id: "71u638UFCpGs6hLkWP"
      //   timestamp: t {seconds: 2177433000, nanoseconds: 0}
      //   title: "Remind Me in future"

    });
  } catch (error) {
    console.log(error);
  }
};

and this function called by saga-watcher generator function will look like this.

// TODO: action calling the API
function* fetchReminder() {
  try {
    const reminders = yield call(GetAllReminders);

    const resultDoc = GetDataFromSnapshot(reminders);

    console.log(`resultDoc =>> ${resultDoc}`);
    // resultDoc =>> [object Promise]

   resultDoc
      .then((data) => {
        console.log(`resultDoc =>> ${resultDoc}`);
        // resultDoc =>> [object Promise]

        console.log(`data =>> ${data}`);
        // data =>> function () {
        //           i.Zl(), r.cs.ws(function () {
        //             return Pr(r.q_, o);
        //          });
        //         }

        data.json();
        // Unhandled Rejection (TypeError): data.json is not a function

      })
      .then((response) => console.log(`response =>> ${response}`));

    yield put(setReminder(reminders));

how to get the data will look like this. An array of objects from the firestore database

0:
  id: "71u638UFCpGs6hLkWP"
  timestamp: t {seconds: 2177433000, nanoseconds: 0}
  title: "Remind Me in future"
Abhishek Patel
  • 113
  • 1
  • 8
  • Check out my answer, it should help you out :) – Sowam Jul 02 '21 at 11:05
  • 1
    Your code is written as if `snapshot.onSnapshot()` returns a promise that resolves to something that has a `.json()` method. That seems unlikely, seems more like you've just copy-pasted some example code. Looks to me like the `data` array is the thing you want to return from `GetDataFromSnapshot()` and if `.onSnapshot()` doesn't return a promise you need to *promisify* it yourself. – Lennholm Jul 02 '21 at 12:16
  • @Lennholm, you did correctly, but how to promisify by myself, can you pls help with the code or any link that I've understand quickly what you're saying for promisify and all stuff. – Abhishek Patel Jul 02 '21 at 12:48
  • @Lennholm, ya you're right `.onSnapshot()` return a `[object Promise]` correctly here. I checked again. But I didn't get the `.json()` value here. – Abhishek Patel Jul 02 '21 at 13:04

1 Answers1

1

Just do next .then() on this and you will get the data but you have to make it data.text() or data.json(), depends on what data it is. So like:

      resultDoc.then((data) => {
         data.json();
      ).then((response)=> console.log(response);
Sowam
  • 1,674
  • 3
  • 12
  • 30
  • `data =>> , resultDoc =>> [object Promise]`, data is empty and resultDoc is object promise. When we `data.json()` it will unhandled rejection error like; `data.json() is not a function` obevisouly – Abhishek Patel Jul 02 '21 at 11:20
  • 1
    if it is [object Promise] you can just do .then on it or do await, that's all – Sowam Jul 02 '21 at 15:38
  • `export const GetDataFromSnapshot = async (snapshot) => { const result = new Promise((resolve, reject) => { const data = []; snapshot.onSnapshot( (docs) => { docs.forEach((doc) => { data.push(doc.data()); }); resolve(data); }, (error) => { console.log(error); reject(); } ); }); const finalResult = await result; return finalResult; };` – Abhishek Patel Jul 07 '21 at 03:58
  • `const resultDoc = GetDataFromSnapshot(reminders); resultDoc.then((res) => {console.log(res); put({ type: 'FETCH_REMINDER', reminders: fetchReminders(res) }); }) .catch((err) => { console.log(err); });` then its worked for me – Abhishek Patel Jul 07 '21 at 03:59