From fa231aa713351b5424ecf36775fdc7b90d858cb6 Mon Sep 17 00:00:00 2001
From: Ken Hibino <ken.hibino7@gmail.com>
Date: Tue, 15 Dec 2020 07:20:53 -0800
Subject: [PATCH] Add action menu to DeadTasksTable

---
 ui/src/components/DeadTasksTable.tsx | 25 ++++++++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/ui/src/components/DeadTasksTable.tsx b/ui/src/components/DeadTasksTable.tsx
index eb72388..6652b29 100644
--- a/ui/src/components/DeadTasksTable.tsx
+++ b/ui/src/components/DeadTasksTable.tsx
@@ -14,6 +14,8 @@ import Paper from "@material-ui/core/Paper";
 import Box from "@material-ui/core/Box";
 import Collapse from "@material-ui/core/Collapse";
 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 KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown";
 import Typography from "@material-ui/core/Typography";
@@ -92,6 +94,7 @@ function DeadTasksTable(props: Props & ReduxProps) {
   const [page, setPage] = useState(0);
   const [pageSize, setPageSize] = useState(defaultPageSize);
   const [selectedKeys, setSelectedKeys] = useState<string[]>([]);
+  const [menuAnchor, setMenuAnchor] = useState<null | HTMLElement>(null);
 
   const handleChangePage = (
     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 pageOpts = { page: page + 1, size: pageSize };
     listDeadTasksAsync(queue, pageOpts);
@@ -146,9 +155,23 @@ function DeadTasksTable(props: Props & ReduxProps) {
   return (
     <div>
       <div className={classes.actionsContainer}>
-        <IconButton aria-label="actions" className={classes.moreIcon}>
+        <IconButton
+          aria-label="actions"
+          className={classes.moreIcon}
+          onClick={handleMenuClick}
+        >
           <MoreHorizIcon />
         </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 && (
           <ButtonGroup
             variant="text"