search

FirebaseExtended / reactfire

Hooks, Context Providers, and Components that make it easy to interact with Firebase.
https://firebaseopensource.com/projects/firebaseextended/reactfire/
MIT License
3.52k stars 401 forks source link

React-firebaseui: Cannot read properties of undefined (reading 'initializeApp') #478

Closed mankinchi closed 2 years ago

mankinchi commented 2 years ago

Version info

React: 17.0.2

Firebase: 9.1.3

ReactFire: 4.2.0

react-firebaseui: 5.0.2

Test case

Main component image

Layout component image

You can see that the provider is set up correctly

Component image

Expected behavior

FirebaseUI to work correctly.

Side question: How can I grab the provider ID for firebase auth? Should I grab it straight from firebase/auth instead of using useAuth hook?

Actual behavior

Error image

nbangba commented 2 years ago

i am facing the same problem

jhuleatt commented 2 years ago

Hi @mankinchi and @nbangba, v6 of react-firebaseui only works with the compat imports of Firebase v9, described here: https://github.com/firebase/firebaseui-web-react/pull/158#issuecomment-964269348

There's also a discussion about this here: https://github.com/FirebaseExtended/reactfire/discussions/474. I'll try to post an example of how to use FirebaseUI react-firebaseui v6 alongside ReactFire v4 soon.

Imprasna commented 2 years ago

Screenshot 2021-11-26 104045 I want to fix this, but I don't know what am I supposed to do. Can anyone help me fix this issue please.

jhuleatt commented 2 years ago

I posted a workaround here: https://github.com/FirebaseExtended/reactfire/discussions/474#discussioncomment-1737817

Please give it a try and comment in that discussion if it isn't working :)