Create usePolling custom hook

This commit is contained in:
Ken Hibino
2020-11-29 15:04:24 -08:00
parent b9cb9211ce
commit 3dd6fdc0b0
10 changed files with 53 additions and 47 deletions

View File

@@ -1,4 +1,4 @@
import React, { useEffect, useState } from "react";
import React, { useCallback, useState } from "react";
import { connect, ConnectedProps } from "react-redux";
import { makeStyles } from "@material-ui/core/styles";
import Table from "@material-ui/core/Table";
@@ -28,6 +28,7 @@ import TablePaginationActions, {
import { listPendingTasksAsync } from "../actions/tasksActions";
import { AppState } from "../store";
import { PendingTask } from "../api";
import { usePolling } from "../hooks";
const useStyles = makeStyles({
table: {
@@ -74,14 +75,12 @@ function PendingTasksTable(props: Props & ReduxProps) {
setPage(0);
};
useEffect(() => {
const fetchData = useCallback(() => {
const pageOpts = { page: page + 1, size: pageSize };
listPendingTasksAsync(queue, pageOpts);
const interval = setInterval(() => {
listPendingTasksAsync(queue, pageOpts);
}, pollInterval * 1000);
return () => clearInterval(interval);
}, [pollInterval, listPendingTasksAsync, queue, page, pageSize]);
}, [page, pageSize, queue, listPendingTasksAsync]);
usePolling(fetchData, pollInterval);
if (props.tasks.length === 0) {
return (