on master help sign in
roller: move polling to it's own file, change polling behavior to be less request heavy
commit6ba87926c2c34f1229c4d3b7044d20296877181a authorHunter Miller <hunter@thisdot.co> dateMon 14 Feb 2022, 19:08 (5 years ago) parentb953e8e
3 files changed+50−32
src/Bridge.js+8 src/lib/useRoller.ts−32 src/lib/useRollerPoller.ts+42
src/Bridge.js+8
@@ -25,6 +25,7 @@ import Modal from 'components/L2/Modal';
2525import { useRollerStore } from 'store/rollerStore';
2626import { Box } from '@tlon/indigo-react';
2727import LoadingOverlay from 'components/L2/LoadingOverlay';
28+import { useRollerPoller } from 'lib/useRollerPoller';
2829
2930const INITIAL_NETWORK_TYPE = isRopsten
3031 ? NETWORK_TYPES.ROPSTEN
@@ -72,6 +73,12 @@ function useInitialRoutes() {
7273 return [{ key: ROUTE_NAMES.LOGIN }];
7374}
7475
76+function Poller() {
77+ useRollerPoller();
78+
79+ return null;
80+}
81+
7582function Bridge() {
7683 const initialRoutes = useInitialRoutes();
7784 const { loading, modalText, setModalText } = useRollerStore();
@@ -105,6 +112,7 @@ function Bridge() {
105112 <Box width="280px">{modalText}</Box>
106113 </Modal>
107114 <LoadingOverlay loading={loading} />
115+ <Poller />
108116 </Provider>
109117 </WithErrorBoundary>
110118 );
src/lib/useRoller.ts−32
@@ -27,7 +27,6 @@ import {
2727 generateInviteWallet,
2828 getPendingSpawns,
2929 submitL2Transaction,
30− getTimeToNextBatch,
3130 registerProxyAddress,
3231 isL2Spawn,
3332} from './utils/roller';
@@ -44,7 +43,6 @@ import {
4443} from '@urbit/roller-api';
4544
4645import Point, { PointField, Points } from './types/Point';
47−import { useTimerStore } from 'store/timerStore';
4846import { ReticketParams, SendL2Params } from './types/L2Transaction';
4947import { L1Point } from './types/L1Point';
5048import { ddmmmYYYY } from './utils/date';
@@ -53,8 +51,6 @@ import { useWalletConnect } from './useWalletConnect';
5351import { PendingL1Txn } from './types/PendingL1Transaction';
5452import { TRANSACTION_PROGRESS } from './reticket';
5553
56−const ONE_SECOND = 1000;
57−
5854interface UpdateParams {
5955 point: number;
6056 message?: string;
@@ -90,11 +86,8 @@ export default function useRoller() {
9086 const allPoints: any = usePointCache();
9187 const getDetails = allPoints?.getDetails;
9288
93− const { setNextRoll } = useTimerStore();
94−
9589 const {
9690 invitesLoading,
97− nextBatchTime,
9891 point,
9992 points,
10093 pointList,
@@ -1050,31 +1043,6 @@ export default function useRoller() {
10501043 fetchConfig();
10511044 }, [config, fetchConfig]);
10521045
1053− useEffect(() => {
1054− const time = ONE_SECOND;
1055−
1056− const interval = setInterval(() => {
1057− const nextRoll = getTimeToNextBatch(nextBatchTime, new Date().getTime());
1058− setNextRoll(nextRoll);
1059−
1060− if (nextBatchTime - ONE_SECOND <= new Date().getTime()) {
1061− api.getRollerConfig().then(response => {
1062− setNextBatchTime(response.nextBatch);
1063− });
1064−
1065− getPendingTransactions();
1066−
1067− setTimeout(() => {
1068− if (!point.isDefault) {
1069− getInvites(); // This will also get pending txns
1070− }
1071− }, TEN_SECONDS); // Should this be more like a minute?
1072− }
1073− }, time);
1074−
1075− return () => clearInterval(interval);
1076− }, [point, nextBatchTime, getPendingTransactions, getInvites]); // eslint-disable-line react-hooks/exhaustive-deps
1077−
10781046 return {
10791047 api,
10801048 changeSponsorship,
src/lib/useRollerPoller.tsnew file+42
@@ -0,0 +1,42 @@
1+import { useEffect, useState } from 'react';
2+import { useRollerStore } from 'store/rollerStore';
3+import { useTimerStore } from 'store/timerStore';
4+import { ONE_SECOND, TEN_SECONDS } from './constants';
5+import useRoller from './useRoller';
6+import { getTimeToNextBatch } from './utils/roller';
7+
8+export function useRollerPoller() {
9+ const { nextBatchTime, setNextBatchTime, setNextRoll } = useTimerStore();
10+ const { point } = useRollerStore();
11+ const { api, getInvites, getPendingTransactions } = useRoller();
12+ const [time, setTime] = useState(ONE_SECOND);
13+
14+ useEffect(() => {
15+ const interval = setInterval(async () => {
16+ const nextRoll = getTimeToNextBatch(nextBatchTime, new Date().getTime());
17+ setNextRoll(nextRoll);
18+
19+ if (nextBatchTime - ONE_SECOND <= new Date().getTime()) {
20+ const response = await api.getRollerConfig();
21+
22+ if (response.nextBatch === nextBatchTime) {
23+ // exponentially back off or cap at polling every minute
24+ setTime(Math.min(60 * ONE_SECOND, time + time));
25+ return;
26+ }
27+
28+ setTime(ONE_SECOND); // reset the timer
29+ setNextBatchTime(response.nextBatch);
30+ getPendingTransactions();
31+
32+ setTimeout(() => {
33+ if (!point.isDefault) {
34+ getInvites(); // This will also get pending txns
35+ }
36+ }, TEN_SECONDS); // Should this be more like a minute?
37+ }
38+ }, time);
39+
40+ return () => clearInterval(interval);
41+ }, [time, point, nextBatchTime, getPendingTransactions, getInvites]); // eslint-disable-line react-hooks/exhaustive-deps
42+}