FirebaseExtended / FirebaseExtended/reactfire

useSigninCheck suspends indefinitely

Đang mở
#405 8 bình luận 5 reaction 1 người được giao Được @jhuleatt nhận Xem trên GitHub
v5
Ngôn ngữ chính
TypeScript
Star
3.6k
Fork
403
Merge trung bình
14 giờ 53 phút
Pull request đã merge (30 ngày)
5

Mô tả

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

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.