aljaz/landscape-template
1
0
Fork 0
mirror of https://github.com/aljazceru/landscape-template.git synced 2026-01-14 20:04:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

perf: better polling optimization in login page/modal

Browse Source
This commit is contained in:
MTG2000
2022-09-09 20:52:02 +03:00
parent e1a2e46276
commit 54874feb4c
2 changed files with 26 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/features/Auth/pages/LoginPage/LoginPage.tsx
View File

@@ -1,4 +1,4 @@
import { useCallback, useEffect, useState } from "react"
import { useCallback, useEffect, useRef, useState } from "react"
import { Helmet } from "react-helmet";
import { Grid } from "react-loader-spinner";
import { useNavigate, useLocation } from "react-router-dom";
@@ -62,6 +62,7 @@ export default function LoginPage() {
const location = useLocation();
const [copied, setCopied] = useState(false);
const canFetchIsLogged = useRef(true)
const { loadingLnurl, data: { lnurl, session_token }, error } = useLnurlQuery();
const clipboard = useCopyToClipboard()
@@ -96,18 +97,26 @@ export default function LoginPage() {
const startPolling = useCallback(
() => {
const interval = setInterval(() => {
if (canFetchIsLogged.current === false) return;
canFetchIsLogged.current = false;
fetch(CONSTS.apiEndpoint + '/is-logged-in', {
credentials: 'include',
headers: {
session_token
}
}).then(data => data.json())
})
.then(data => data.json())
.then(data => {
if (data.logged_in) {
clearInterval(interval)
refetch();
}
})
.catch()
.finally(() => {
canFetchIsLogged.current = true;
})
}, 2000);
return interval;
@@ -123,6 +132,7 @@ export default function LoginPage() {
interval = startPolling();
return () => {
canFetchIsLogged.current = true;
clearInterval(interval)
}
}, [lnurl, startPolling])

17
src/features/Tournaments/pages/OverviewPage/RegisterationModals/LoginModal/LoginModal.tsx
View File

@@ -6,7 +6,7 @@ import { useMeTournamentQuery } from 'src/graphql';
import Button from 'src/Components/Button/Button';
import { QRCodeSVG } from 'qrcode.react';
import { Grid } from 'react-loader-spinner';
import { useCallback, useEffect, useState } from 'react';
import { useCallback, useEffect, useRef, useState } from 'react';
import { CONSTS } from 'src/utils';
import useCopyToClipboard from 'src/utils/hooks/useCopyToClipboard';
import { useLnurlQuery } from 'src/features/Auth/pages/LoginPage/LoginPage';
@@ -24,7 +24,9 @@ export default function LinkingAccountModal({ onClose, direction, tournamentId,
const [copied, setCopied] = useState(false);
const { loadingLnurl, data: { lnurl, session_token }, error } = useLnurlQuery();
const clipboard = useCopyToClipboard()
const clipboard = useCopyToClipboard();
const canFetchIsLogged = useRef(true)
const dispatch = useAppDispatch();
@@ -64,18 +66,26 @@ export default function LinkingAccountModal({ onClose, direction, tournamentId,
const startPolling = useCallback(
() => {
const interval = setInterval(() => {
if (canFetchIsLogged.current === false) return;
canFetchIsLogged.current = false;
fetch(CONSTS.apiEndpoint + '/is-logged-in', {
credentials: 'include',
headers: {
session_token
}
}).then(data => data.json())
})
.then(data => data.json())
.then(data => {
if (data.logged_in) {
clearInterval(interval)
refetch();
}
})
.catch()
.finally(() => {
canFetchIsLogged.current = true;
})
}, 2000);
return interval;
@@ -91,6 +101,7 @@ export default function LinkingAccountModal({ onClose, direction, tournamentId,
interval = startPolling();
return () => {
canFetchIsLogged.current = true;
clearInterval(interval)
}
}, [lnurl, startPolling])