Not able to fetch data from Firebase Firestore SHOWS ERROR in NEXT.JS using Firebase SDK Firebase v9

Viewed 42

Hey there so i want to fetch data from firebase firestore and i am following a tutorial for it of firebase v9 but it is showing a error FIRESTORE (9.8.4) INTERNAL ASSERTION FAILED: Unexpected state

The code

import React, { useEffect, useState } from "react";
import { db } from "../firebase";

export default function TodoList() {
  const [todos, setTodos] = useState([]);
  useEffect(() => {
    const collectionRef = collection(db, "todos");
    const q = query(collectionRef, orderBy("timestamp", "detail"));

    const unsubscribe = onSnapshot(q, (querySnapshot) => {
      setTodos(
        querySnapshot.docs.map((doc) => ({
          ...doc.data(),
          id: doc.id,
          timestamp: doc.data().timestamp?.toDate().getTime(),
        }))
      );
    });
    return unsubscribe;
  }, []);

  return (
    <div>
      {todos.map((todo) => {
        <div key={todo.id}>{todo.title}</div>;
      })}
    </div>
  );
}

This is the code for the fetching and then i am using this component in the index.js file in the next application like so

import Head from "next/head";
import Image from "next/image";
import styles from "../styles/Home.module.css";
import TodoList from "../components/TodoList";

export default function Home() {
  return (
    <Container>
      <TodoList />
    </Container>
  );
}

I see this error i dont know why and i cant seem to find this on google either for the v9.

[image of the firebase firestore console] [1] [1]: https://i.stack.imgur.com/o4Yir.png

Complete error

Error: FIRESTORE (9.8.4) INTERNAL ASSERTION FAILED: Unexpected state

Call Stack
L
node_modules/@firebase/firestore/dist/index.esm2017.js (193:0)
pn
node_modules/@firebase/firestore/dist/index.esm2017.js (4167:0)
eval
node_modules/@firebase/firestore/dist/index.esm2017.js (4146:0)
eval
node_modules/@firebase/firestore/dist/index.esm2017.js (13838:0)
Gt.insert
node_modules/@firebase/firestore/dist/index.esm2017.js (2300:0)
qt.insert
node_modules/@firebase/firestore/dist/index.esm2017.js (2129:0)
Lu.add
node_modules/@firebase/firestore/dist/index.esm2017.js (13878:0)
eval
node_modules/@firebase/firestore/dist/index.esm2017.js (14395:0)
Gt.inorderTraversal
node_modules/@firebase/firestore/dist/index.esm2017.js (2276:0)
qt.inorderTraversal
node_modules/@firebase/firestore/dist/index.esm2017.js (2180:0)
sc.Ku
node_modules/@firebase/firestore/dist/index.esm2017.js (14365:0)
eval
node_modules/@firebase/firestore/dist/index.esm2017.js (14699:0)
t.hc
node_modules/@firebase/firestore/dist/index.esm2017.js (14709:5)
eval
node_modules/@firebase/firestore/dist/index.esm2017.js (15036:0)
eval
node_modules/@firebase/firestore/dist/index.esm2017.js (4981:0)
Lt
node_modules/@firebase/firestore/dist/index.esm2017.js (2095:0)
is.forEach
node_modules/@firebase/firestore/dist/index.esm2017.js (4980:0)
Rc
node_modules/@firebase/firestore/dist/index.esm2017.js (15035:0)
lc
node_modules/@firebase/firestore/dist/index.esm2017.js (14823:9)
async Eu
node_modules/@firebase/firestore/dist/index.esm2017.js (13475:0)```
1 Answers

I had the exact same problem when I tried to use a different machine for development, I just reinstalled latest version of NodeJS and it worked fine.

Related