Skip to content

Commit 546fe9b

Browse files
authored
useInitAuth Example (#522)
Adding additional context around auth initialization with a common issue loading iframe.
1 parent 1769cfb commit 546fe9b

1 file changed

Lines changed: 18 additions & 0 deletions

File tree

docs/use.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
- [Auth](#auth)
1010
* [Display the current signed-in user](#display-the-current-signed-in-user)
1111
* [Only render a component if a user is signed in](#only-render-a-component-if-a-user-is-signed-in)
12+
* [Initialize Auth with custom Dependencies](#initialize-auth-with-custom-dependencies)
1213
- [Cloud Firestore](#cloud-firestore)
1314
* [Access data offline](#access-data-offline)
1415
* [Show a single document](#show-a-single-document)
@@ -221,6 +222,23 @@ const { status, data: signInCheckResult } = useSigninCheck({
221222
});
222223
```
223224

225+
### Initialize Auth with custom dependencies
226+
227+
You may often find that you need to only initialize Firebase Auth with specific dependencies such as local persistence. In order to do this `reactfire` provides a hook called `useInitAuth`. This allows you to initialize the authApp correctly by passing in the required configuration.
228+
229+
In the below example you will see that we only pass persistance and no providers. You can add providers later as to avoid loading [large iFrame on mobile](https://github.com/firebase/firebase-js-sdk/issues/4946) issue.
230+
231+
```
232+
const { status, data: auth } = useInitAuth(async (authApp) => {
233+
const auth = initializeAuth(authApp, {
234+
persistence: [indexedDBLocalPersistence, browserLocalPersistence],
235+
});
236+
return auth;
237+
});
238+
```
239+
240+
> You can find out more from the [Firebase Docs - Custom Dependencies](https://firebase.google.com/docs/auth/web/custom-dependencies).
241+
224242
## Cloud Firestore
225243

226244
The following samples assume that `FirebaseAppProvider` and `FirestoreProvider` components exist higher up the component tree (see [setup instructions](#setup) for more detail).

0 commit comments

Comments
 (0)