React native – Firestore Could not reach Cloud Firestore backend: code=permission-denied

Im using Firebase with React-Native and Expo.

Firebase.js

import { initializeApp } from "firebase/app";
import { getFirestore, initializeFirestore } from "firebase/firestore";
import { getAuth } from "firebase/auth";
import Constants from "expo-constants";

const firebaseConfig = {
  apiKey: Constants.manifest.extra.apiKey,
  authDomain: Constants.manifest.extra.authDomain,
  projectId: Constants.manifest.extra.projectId,
  storageBucket: Constants.manifest.extra.storageBucket,
  messagingSenderId: Constants.manifest.extra.messagingSenderId,
  appId: Constants.manifest.extra.appId,
  databaseURL: Constants.manifest.extra.databaseURL
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const auth = getAuth();
const db = initializeFirestore(app, {
experimentalForceLongPolling: true
})

export { db, auth } 

Firebase Rules (I know this is bad in production, just for testing purposes)

rules_version = '2';
  service cloud.firestore { 
    match /databases/{database}/documents {
    match /{document=**} { 
      allow read, write; 
    } 
  } 
}

Chat.js

// ..imports

export default function Chat() {
    const [messages, setMessages] = useState([])
    const navigation = useNavigation();

    useLayoutEffect(() => {
      const collectionRef = collection(db, "chats");
      const q = query(collectionRef, orderBy("createdAt", "desc"));

      const unsubscribe = onSnapshot(q, snapshot => {
        console.log("snapshot");
        setMessages(snapshot.docs.map(doc => ({
          _id: doc.id,
          createdAt: doc.data().createdAt.toDate(),
          text: doc.data().text,
          user: doc.data().user
        }))
      )

    });
    return () => unsubscribe();
  }, []);
    
  const onSend = useCallback((messages = []) => {
    setMessages(previousMessages => GiftedChat.append(previousMessages, messages));

    const { _id, createdAt, text, user } = messages[0];
    addDoc(collection(db, 'chats'),{
      _id,
      createdAt,
      text,
      user
    })
  }, []);

    return (
    <GiftedChat
      messages={messages}
      onSend={messages => onSend(messages)}
      user={{
        _id: auth?.currentUser?.email,
        avatar: 'https://i.pravatar.cc/300'
      }}
    />
    )
}

I tried adding "experimentalForceLongPolling: true" in the firebase.js which didn’t work and also changed the rules so everyone can overwrite it. I also found someone who said that you should add "useFetchStreams: false" but that didn’t work either. I also removed firebase with yarn and installed again with "npx expo install firebase". (also tried "merge: true").

Im just clueless right now to why this is happening :/