benwinding / react-admin-firebase

A firebase data provider for the react-admin framework
https://benwinding.github.io/react-admin-firebase/
MIT License
459 stars 179 forks source link

Unhandled Runtime Error TypeError: Cannot read property 'length' of undefined #207

Open mshd opened 3 years ago

mshd commented 3 years ago

components/ReactAdmin.tsx (39:44) @ ReactAdmin

39 | const dataProvider = FirebaseDataProvider(config, options);

Screenshot from 2021-09-04 22-30-59

I just use normal config, and empty options. My config works fine in the demo rep, but not in my rep. Any idea?

nicokant commented 3 years ago

Had the same problem with the latest version of firebase, just provide the initialized firebase app to the options:

import { initializeApp } from "firebase/app";

const config = {
  apiKey: "aaaaaaaaaaaaaaaaaaaaaaaaaaa",
  authDomain: "aaaaaaaaaaaaaaaaaaaaaaaaaaa",
  databaseURL: "aaaaaaaaaaaaaaaaaaaaaaaaaaa",
  projectId: "aaaaaaaaaaaaaaaaaaaaaaaaaaa",
  storageBucket: "aaaaaaaaaaaaaaaaaaaaaaaaaaa",
  messagingSenderId: "aaaaaaaaaaaaaaaaaaaaaaaaaaa",
};

const app = initializeApp(config);

options = {
  app,
}
ricardojlrufino commented 3 years ago

now i got: TypeError: this.app.firestore is not a function

kmihaltsov commented 3 years ago

I had to downgrade firebase version to the latest 7.x Haven't tested 8.x yet.

rafahoro commented 2 years ago

Same issue here: First I got "Unhandled Runtime Error TypeError: Cannot read property 'length' of undefined" Then changed the options as suggested and got "TypeError: this.app.firestore is not a function". I checked using "firebase": "^9.6.0" in https://github.com/benwinding/react-admin-firebase-demo-typescript

Any help besides downgrading to 7.X?

mithleshk commented 2 years ago

@rafahoro You may try this solution https://stackoverflow.com/questions/69143642/firebase-apps-length-of-undefined#69143734

rafahoro commented 2 years ago

@rafahoro You may try this solution https://stackoverflow.com/questions/69143642/firebase-apps-length-of-undefined#69143734

@mithleshk thanks for answering. From my understanding, the solution in your link is for using Firebase directly (how to migrate to version 9). However in this case Im using it through react-admin-firebase, so the change (as I understand) is to be done in the react-admin-firebase source code (ie: I need to branch this project).

The SO answer suggest using

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore';

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

and thats OK. The problem is that after that, I still need to import from "react-admin-firebase" FirebaseDataProvider, RAFirebaseOptions and call

export const dataProvider = FirebaseDataProvider(config, options); // This line is the one throwing the len exception

I cant pass app nor db to the FirebaseDataProvider. So Im still with the same issue. The same happens if I import the compatibility versions:

import firebase from 'firebase/compat/app';
import 'firebase/compat/firestore';

As I understand, the solution will be to change "react-admin-firebase" to use/support V9 of firebase.

DanielDanaee commented 2 years ago

Any updates on this? im on Firebase v9 and latet of react-admin-firebase and get this.app.firestore is not a function