FirebaseExtended / FirebaseExtended/reactfire

useSigninCheck suspends indefinitely

Ouverte
#405 8 commentaires 5 réactions 1 personne assignée Réclamée par @jhuleatt Voir sur GitHub
v5
Langage dominant
TypeScript
Étoiles
3.6k
Forks
403
Merge moyen
14 h 53 min
PR mergées (30 j)
5

Description

I would like to create a protected route with `reactfire` and `react-router-dom`. To achieve this, I created a `PrivateRoute` component as follows:

```
export default function PrivateRoute(routeProps: RouteProps) {
const { status, data: signInCheckResult, error } = useSigninCheck();

if (signInCheckResult.signedIn) {
return ;
} else {
return (

);
}
}
```

I enabled `suspense` mode for `reactfire`.
Oddly, when staying on a single page for around ~1min, navigating to another page would cause the component to suspend indefinitely. Reloading the page, however, does momentarily unsuspend the page (but the effect would reappear after idle).

### Version info
"firebase": "8.7.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-router-dom": "5.2.0",
"react-scripts": "4.0.0",
"reactfire": "3.0.0-rc.2"

### Test case
https://codesandbox.io/s/reactfire-suspend-demo-i3j1e

### Steps to reproduce

1. Click on `Sign in with Google` and proceed.
2. You should land in a `signed in` page with a log out button and a `link to test page`.
2. Wait for at least 30 seconds (idle).
3. Click on `Link to test page` (React Router Link)
4. Page would suspend indefinitely.

### Expected behavior

Page shouldn't suspend indefinitely.

### Actual behavior

Page suspends indefinitely.

Please let me know if there are any good implementations for integrating `reactfire` with `react-router-dom`.

Guide de contribution

Ouvrir le guide de contribution

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.