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 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 37x 1x 1x 37x 39x 37x 4x 4x 37x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 12x 12x 12x 12x 12x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 39x 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;
|