FirebaseExtended / FirebaseExtended/reactfire

useSigninCheck suspends indefinitely

未关闭
#405 8 条评论 5 个 reaction 已指派 1 人 已被 @jhuleatt 认领 在 GitHub 查看
v5
主要语言
TypeScript
星标
3.6k
派生
403
平均合并
14 小时 53 分钟
30 天内合并 PR
5

描述

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`.

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。