So, I was following a tutorial on a messenger clone and they used Firebase. When I used that syntax it showed me error and later i found out they changed the whole syntax. So I tried to do the thing this way and its giving me this typerror.
import db from "./firebase";
import { doc,onSnapshot,collection,query } from 'firebase/firestore';
.....
.....
const [messages, setMessages] = useState([
{username: "Shuvo", message: "What's up"},
{username:"Arnob",message:"Hi"}]);
useEffect(()=>{
const q = query(collection(db,"messages"));
const hello = onSnapshot(q,(querySnapshot)=>{
setMessages(querySnapshot.docs.map(doc => doc.data()))
})
},[])
.....
useEffect(()=>{
const ref = firebase.firestore().collection('messages')
ref.onSnapshot((querySnapshot)=>{
const items = []
querySnapshot.forEach((doc)=> items.push(doc.data()))
setMessages(items)
})