Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 | 1x 1x 1x 1x 1x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 40x 1x 1x 40x 42x 40x 4x 4x 40x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 13x 13x 13x 13x 13x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 42x 1x | import React from "react";
import OurTable, {
PlaintextColumn,
DateColumn,
} from "main/components/OurTable";
import { Button } from "react-bootstrap";
import { useBackend } from "main/utils/useBackend";
const PagedJobsTable = () => {
const testId = "PagedJobsTable";
const refreshJobsIntervalMilliseconds = 5000;
const [selectedPage, setSelectedPage] = React.useState(0);
const pageSize = 10;
// Stryker disable all
const { data: page } = useBackend(
["/api/jobs/all"],
{
method: "GET",
url: "/api/jobs/all/pageable",
params: {
page: selectedPage,
size: pageSize,
},
},
{ content: [], totalPages: 0 },
{ refetchInterval: refreshJobsIntervalMilliseconds },
);
// Stryker restore all
const testid = "PagedJobsTable";
const previousPageCallback = () => {
return () => {
setSelectedPage(selectedPage - 1);
};
};
const nextPageCallback = () => {
return () => {
setSelectedPage(selectedPage + 1);
};
};
const columns = [
{
Header: "id",
accessor: "id", // accessor is the "key" in the data
},
DateColumn("Created", (cell) => cell.row.original.createdAt),
DateColumn("Updated", (cell) => cell.row.original.updatedAt),
{
Header: "Status",
accessor: "status",
},
PlaintextColumn("Log", (cell) => cell.row.original.log),
];
const sortees = React.useMemo(
() => [
{
id: "id",
desc: true,
},
],
// Stryker disable next-line all
[],
);
return (
<>
<p>Page: {selectedPage + 1}</p>
<Button
data-testid={`${testId}-previous-button`}
onClick={previousPageCallback()}
disabled={selectedPage === 0}
>
Previous
</Button>
<Button
data-testid={`${testId}-next-button`}
onClick={nextPageCallback()}
disabled={page.totalPages === 0 || selectedPage === page.totalPages - 1}
>
Next
</Button>
<OurTable
data={page.content}
columns={columns}
testid={testid}
initialState={{ sortBy: sortees }}
/>
</>
);
};
export default PagedJobsTable;
|