go-pkg/asynqmon
2
0
Fork 0
mirror of https://github.com/hibiken/asynqmon.git synced 2025-01-19 03:05:53 +08:00
Code Issues Projects Releases Wiki Activity

Add cancel action button to ActiveTasksTable

Browse Source
This commit is contained in:
Ken Hibino 2020-12-22 06:05:24 -08:00
parent 3ab1ed31a6
commit 1d40ff520d
1 changed files with 85 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
ui/src/components/ActiveTasksTable.tsx
View File

@ -17,6 +17,7 @@ import Box from "@material-ui/core/Box";
import Checkbox from "@material-ui/core/Checkbox"; import Checkbox from "@material-ui/core/Checkbox";
import Collapse from "@material-ui/core/Collapse"; import Collapse from "@material-ui/core/Collapse";
import IconButton from "@material-ui/core/IconButton"; import IconButton from "@material-ui/core/IconButton";
import CancelIcon from "@material-ui/icons/Cancel";
import KeyboardArrowUpIcon from "@material-ui/icons/KeyboardArrowUp"; import KeyboardArrowUpIcon from "@material-ui/icons/KeyboardArrowUp";
import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown"; import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown";
import Typography from "@material-ui/core/Typography"; import Typography from "@material-ui/core/Typography";
@ -31,6 +32,7 @@ import TablePaginationActions, {
rowsPerPageOptions, rowsPerPageOptions,
defaultPageSize, defaultPageSize,
} from "./TablePaginationActions"; } from "./TablePaginationActions";
import TableActions from "./TableActions";
import { usePolling } from "../hooks"; import { usePolling } from "../hooks";
import { ActiveTaskExtended } from "../reducers/tasksReducer"; import { ActiveTaskExtended } from "../reducers/tasksReducer";
import { uuidPrefix } from "../utils"; import { uuidPrefix } from "../utils";
@ -115,6 +117,25 @@ function ActiveTasksTable(props: Props & ReduxProps) {
const rowCount = props.tasks.length; const rowCount = props.tasks.length;
const numSelected = selectedIds.length; const numSelected = selectedIds.length;
return ( return (
<div>
<TableActions
showIconButtons={numSelected > 0}
iconButtonActions={[
{
tooltip: "Cancel",
icon: <CancelIcon />,
onClick: () => console.log("TODO"),
disabled: false,
},
]}
menuItemActions={[
{
label: "Cancel All",
onClick: () => console.log("TODO"),
disabled: false,
},
]}
/>
<TableContainer component={Paper}> <TableContainer component={Paper}>
<Table <Table
stickyHeader={true} stickyHeader={true}
@ -181,6 +202,7 @@ function ActiveTasksTable(props: Props & ReduxProps) {
</TableFooter> </TableFooter>
</Table> </Table>
</TableContainer> </TableContainer>
</div>
); );
} }