What is the version 9 equivalent of this in firebase?-CodePudding

Im trying to convert my version 8 working code to version 9 but I cant figure out why im getting the error: 'FirebaseError: Expected type 'Query', but it was: a custom DocumentReference object'. It seems not like messagesRes but I put in a query and I think im correctly getting the subcollection.

version 8: working
 export async function getServerSideProps(context) {
   const chatRef = db.collection('chats').doc(context.query.id);

   const messagesRes = await chatRef
     .collection('messages')
     .orderBy('timestamp', 'asc')
     .get();

   const messages = messagesRes.docs
    .map(doc => ({
       id: doc.id,
       ...doc.data(),
    }))
       .map(messages => ({
       ...messages,
       timestamp: messages.timestamp.toDate().getTime(),
     }));

   const chatRes = await chatRef.get();

   const chat = {
     id: chatRes.id,
     ...chatRes.data(),
   };

   return {
     props: {
       messages: JSON.stringify(messages),
       chat,
     },
   };
 }
version 9: 
export async function getServerSideProps(context) {
  const chatRef = doc(db, 'chats', context.query.id);

  const messagesRes = await getDocs(
    query(collection(chatRef, 'messages'), orderBy('timestamp', 'asc'))
  );

  const messages = messagesRes.docs
    .map(doc => ({
      id: doc.id,
      ...doc.data(),
    }))
    .map(messages => ({
      ...messages,
      timestamp: messages.timestamp.toDate().getTime(),
    }));

  const chatRes = await getDocs(chatRef);

  const chat = {
    id: chatRes.id,
    ...chatRes.data(),
  };

  return {
    props: {
      messages: JSON.stringify(messages),
      chat,
    },
  };
}

CodePudding user response：

According to the API documentation:

export declare function getDocs<T>(query: Query<T>): Promise<QuerySnapshot<T>>;

And in your code you are doing:

const chatRes = await getDocs(chatRef);

That is why you are seeing the error:

'FirebaseError: Expected type 'Query', but it was: a custom DocumentReference object'.

because you are passing in your document reference and not a query.

Like you did here:

const messagesRes = await getDocs(
    query(collection(chatRef, 'messages'), orderBy('timestamp', 'asc'))
  );

You can see the correct usage of the API here.

CodePudding user response：

Didn't work for me but I modified it a bit and used the firebase 9 collections and filtered the collection where the context.query.id is valid to SSR before the page load.

export async function getServerSideProps(context) {
  const chatID = context.query.id;
  const chatIDRef = collection(db, "chats");

  //prep messages
  const messagesRes = await getDocs(chatIDRef, where(chatID, "==", chatID));
  console.log("ctx log: ", messagesRes);

  const messages = messagesRes.docs
    .map((doc) => ({
      id: doc.id,
      ...doc.data(),
    }))
    .map((messages) => ({
      ...messages,
      timestamp: messages.timestamp?.toDate().getTime(),
    }));

  //prep chat
  const chatIDRef2 = doc(db, "chats", chatID);

  const chatRef = await getDoc(chatIDRef2);

  const chat = {
    id: chatRef.id,
    ...chatRef.data(),
  };

  return {
    props: {
      messages: JSON.stringify(messages),
      chat: chat,
    },
  };
}