go-pkg/asynqmon
2
0
Fork 0
mirror of https://github.com/hibiken/asynqmon.git synced 2025-01-31 17:10:11 +08:00
Code Issues Projects Releases Wiki Activity

(ui): Make task action props optional

Browse Source
This commit is contained in:
Ken Hibino 2022-04-03 06:29:13 -07:00
parent 9e8dd34a88
commit 5ed0d74ba9
1 changed files with 90 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

167
ui/src/components/TasksTable.tsx
View File

@ -64,15 +64,15 @@ interface Props {
// actions // actions
listTasks: (qname: string, pgn: PaginationOptions) => void; listTasks: (qname: string, pgn: PaginationOptions) => void;
batchDeleteTasks: (qname: string, taskIds: string[]) => Promise<void>; batchDeleteTasks?: (qname: string, taskIds: string[]) => Promise<void>;
batchRunTasks: (qname: string, taskIds: string[]) => Promise<void>; batchRunTasks?: (qname: string, taskIds: string[]) => Promise<void>;
batchArchiveTasks: (qname: string, taskIds: string[]) => Promise<void>; batchArchiveTasks?: (qname: string, taskIds: string[]) => Promise<void>;
deleteAllTasks: (qname: string) => Promise<void>; deleteAllTasks?: (qname: string) => Promise<void>;
runAllTasks: (qname: string) => Promise<void>; runAllTasks?: (qname: string) => Promise<void>;
archiveAllTasks: (qname: string) => Promise<void>; archiveAllTasks?: (qname: string) => Promise<void>;
deleteTask: (qname: string, taskId: string) => Promise<void>; deleteTask?: (qname: string, taskId: string) => Promise<void>;
runTask: (qname: string, taskId: string) => Promise<void>; runTask?: (qname: string, taskId: string) => Promise<void>;
archiveTask: (qname: string, taskId: string) => Promise<void>; archiveTask?: (qname: string, taskId: string) => Promise<void>;
taskRowsPerPageChange: (n: number) => void; taskRowsPerPageChange: (n: number) => void;
} }
@ -106,29 +106,71 @@ export default function TasksTable(props: Props) {
} }
}; };
const handleRunAllClick = () => { function createAllTasksHandler(action: (qname: string) => Promise<void>) {
props.runAllTasks(queue); return () => action(queue);
}; }
const handleDeleteAllClick = () => { function createBatchTasksHandler(
props.deleteAllTasks(queue); action: (qname: string, taskIds: string[]) => Promise<void>
}; ) {
return () => action(queue, selectedIds).then(() => setSelectedIds([]));
}
const handleArchiveAllClick = () => { function createTaskAction(
props.archiveAllTasks(queue); action: (qname: string, taskId: string) => Promise<void>,
}; taskId: string
) {
return () => action(queue, taskId);
}
const handleBatchRunClick = () => { let allActions = [];
props.batchRunTasks(queue, selectedIds).then(() => setSelectedIds([])); if (props.deleteAllTasks) {
}; allActions.push({
label: "Delete All",
onClick: createAllTasksHandler(props.deleteAllTasks),
disabled: props.allActionPending,
});
}
if (props.archiveAllTasks) {
allActions.push({
label: "Archive All",
onClick: createAllTasksHandler(props.archiveAllTasks),
disabled: props.allActionPending,
});
}
if (props.runAllTasks) {
allActions.push({
label: "Run All",
onClick: createAllTasksHandler(props.runAllTasks),
disabled: props.allActionPending,
});
}
const handleBatchDeleteClick = () => { let batchActions = [];
props.batchDeleteTasks(queue, selectedIds).then(() => setSelectedIds([])); if (props.batchDeleteTasks) {
}; batchActions.push({
tooltip: "Delete",
const handleBatchArchiveClick = () => { icon: <DeleteIcon />,
props.batchArchiveTasks(queue, selectedIds).then(() => setSelectedIds([])); disabled: props.batchActionPending,
}; onClick: createBatchTasksHandler(props.batchDeleteTasks),
});
}
if (props.batchArchiveTasks) {
batchActions.push({
tooltip: "Archive",
icon: <ArchiveIcon />,
disabled: props.batchActionPending,
onClick: createBatchTasksHandler(props.batchArchiveTasks),
});
}
if (props.batchRunTasks) {
batchActions.push({
tooltip: "Run",
icon: <PlayArrowIcon />,
disabled: props.batchActionPending,
onClick: createBatchTasksHandler(props.batchRunTasks),
});
}
const fetchData = useCallback(() => { const fetchData = useCallback(() => {
const pageOpts = { page: page + 1, size: pageSize }; const pageOpts = { page: page + 1, size: pageSize };
@ -161,43 +203,8 @@ export default function TasksTable(props: Props) {
{!window.READ_ONLY && ( {!window.READ_ONLY && (
<TableActions <TableActions
showIconButtons={numSelected > 0} showIconButtons={numSelected > 0}
iconButtonActions={[ iconButtonActions={batchActions}
{ menuItemActions={allActions}
tooltip: "Delete",
icon: <DeleteIcon />,
onClick: handleBatchDeleteClick,
disabled: props.batchActionPending,
},
{
tooltip: "Archive",
icon: <ArchiveIcon />,
onClick: handleBatchArchiveClick,
disabled: props.batchActionPending,
},
{
tooltip: "Run",
icon: <PlayArrowIcon />,
onClick: handleBatchRunClick,
disabled: props.batchActionPending,
},
]}
menuItemActions={[
{
label: "Delete All",
onClick: handleDeleteAllClick,
disabled: props.allActionPending,
},
{
label: "Archive All",
onClick: handleArchiveAllClick,
disabled: props.allActionPending,
},
{
label: "Run All",
onClick: handleRunAllClick,
disabled: props.allActionPending,
},
]}
/> />
)} )}
<TableContainer component={Paper}> <TableContainer component={Paper}>
@ -256,15 +263,21 @@ export default function TasksTable(props: Props) {
setSelectedIds(selectedIds.filter((id) => id !== task.id)); setSelectedIds(selectedIds.filter((id) => id !== task.id));
} }
}} }}
onRunClick={() => { onRunClick={
props.runTask(queue, task.id); props.runTask
}} ? createTaskAction(props.runTask, task.id)
onDeleteClick={() => { : undefined
props.deleteTask(queue, task.id); }
}} onDeleteClick={
onArchiveClick={() => { props.deleteTask
props.archiveTask(queue, task.id); ? createTaskAction(props.deleteTask, task.id)
}} : undefined
}
onArchiveClick={
props.archiveTask
? createTaskAction(props.archiveTask, task.id)
: undefined
}
onActionCellEnter={() => setActiveTaskId(task.id)} onActionCellEnter={() => setActiveTaskId(task.id)}
onActionCellLeave={() => setActiveTaskId("")} onActionCellLeave={() => setActiveTaskId("")}
showActions={activeTaskId === task.id} showActions={activeTaskId === task.id}
@ -338,9 +351,9 @@ interface RowProps {
task: TaskInfoExtended; task: TaskInfoExtended;
isSelected: boolean; isSelected: boolean;
onSelectChange: (checked: boolean) => void; onSelectChange: (checked: boolean) => void;
onRunClick: () => void; onRunClick?: () => void;
onDeleteClick: () => void; onDeleteClick?: () => void;
onArchiveClick: () => void; onArchiveClick?: () => void;
allActionPending: boolean; allActionPending: boolean;
showActions: boolean; showActions: boolean;
onActionCellEnter: () => void; onActionCellEnter: () => void;