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 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 1x 1x 43x 43x 43x 4x 4x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 13x 13x 13x 13x 13x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 43x 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;
|