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 action menu to DeadTasksTable

Browse Source
This commit is contained in:
Ken Hibino 2020-12-15 07:20:53 -08:00
parent 9bfd373f85
commit fa231aa713
1 changed files with 24 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
ui/src/components/DeadTasksTable.tsx
View File

@ -14,6 +14,8 @@ import Paper from "@material-ui/core/Paper";
import Box from "@material-ui/core/Box"; import Box from "@material-ui/core/Box";
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 Menu from "@material-ui/core/Menu";
import MenuItem from "@material-ui/core/MenuItem";
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";
@ -92,6 +94,7 @@ function DeadTasksTable(props: Props & ReduxProps) {
const [page, setPage] = useState(0); const [page, setPage] = useState(0);
const [pageSize, setPageSize] = useState(defaultPageSize); const [pageSize, setPageSize] = useState(defaultPageSize);
const [selectedKeys, setSelectedKeys] = useState<string[]>([]); const [selectedKeys, setSelectedKeys] = useState<string[]>([]);
const [menuAnchor, setMenuAnchor] = useState<null | HTMLElement>(null);
const handleChangePage = ( const handleChangePage = (
event: React.MouseEvent<HTMLButtonElement> | null, event: React.MouseEvent<HTMLButtonElement> | null,
@ -116,6 +119,12 @@ function DeadTasksTable(props: Props & ReduxProps) {
} }
}; };
const handleMenuClick = (event: React.MouseEvent<HTMLButtonElement>) => {
setMenuAnchor(event.currentTarget);
};
const handleMenuClose = () => setMenuAnchor(null);
const fetchData = useCallback(() => { const fetchData = useCallback(() => {
const pageOpts = { page: page + 1, size: pageSize }; const pageOpts = { page: page + 1, size: pageSize };
listDeadTasksAsync(queue, pageOpts); listDeadTasksAsync(queue, pageOpts);
@ -146,9 +155,23 @@ function DeadTasksTable(props: Props & ReduxProps) {
return ( return (
<div> <div>
<div className={classes.actionsContainer}> <div className={classes.actionsContainer}>
<IconButton aria-label="actions" className={classes.moreIcon}> <IconButton
aria-label="actions"
className={classes.moreIcon}
onClick={handleMenuClick}
>
<MoreHorizIcon /> <MoreHorizIcon />
</IconButton> </IconButton>
<Menu
id="action-menu"
keepMounted
anchorEl={menuAnchor}
open={Boolean(menuAnchor)}
onClose={handleMenuClose}
>
<MenuItem onClick={handleMenuClose}>Run All</MenuItem>
<MenuItem onClick={handleMenuClose}>Delete All</MenuItem>
</Menu>
{numSelected > 0 && ( {numSelected > 0 && (
<ButtonGroup <ButtonGroup
variant="text" variant="text"