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

Wrap Checkbox with IconButton

Browse Source
This commit is contained in:
Ken Hibino
2021-07-13 19:00:29 -07:00
parent 9ec399926b
commit f9d9166248
5 changed files with 90 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -191,14 +191,16 @@ function ActiveTasksTable(props: Props & ReduxProps) {
padding="checkbox" padding="checkbox"
classes={{ stickyHeader: classes.stickyHeaderCell }} classes={{ stickyHeader: classes.stickyHeaderCell }}
> >
<Checkbox <IconButton>
indeterminate={numSelected > 0 && numSelected < rowCount} <Checkbox
checked={rowCount > 0 && numSelected === rowCount} indeterminate={numSelected > 0 && numSelected < rowCount}
onChange={handleSelectAllClick} checked={rowCount > 0 && numSelected === rowCount}
inputProps={{ onChange={handleSelectAllClick}
"aria-label": "select all tasks shown in the table", inputProps={{
}} "aria-label": "select all tasks shown in the table",
/> }}
/>
</IconButton>
</TableCell> </TableCell>
{columns.map((col) => ( {columns.map((col) => (
<TableCell <TableCell
@@ -293,12 +295,14 @@ function Row(props: RowProps) {
onClick={() => history.push(taskDetailsPath(task.queue, task.id))} onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
> >
<TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}> <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
<Checkbox <IconButton>
onChange={(event: React.ChangeEvent<HTMLInputElement>) => <Checkbox
props.onSelectChange(event.target.checked) onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
} props.onSelectChange(event.target.checked)
checked={props.isSelected} }
/> checked={props.isSelected}
/>
</IconButton>
</TableCell> </TableCell>
<TableCell component="th" scope="row"> <TableCell component="th" scope="row">
{uuidPrefix(task.id)} {uuidPrefix(task.id)}

32
ui/src/components/ArchivedTasksTable.tsx
View File

@@ -218,14 +218,16 @@ function ArchivedTasksTable(props: Props & ReduxProps) {
padding="checkbox" padding="checkbox"
classes={{ stickyHeader: classes.stickyHeaderCell }} classes={{ stickyHeader: classes.stickyHeaderCell }}
> >
<Checkbox <IconButton>
indeterminate={numSelected > 0 && numSelected < rowCount} <Checkbox
checked={rowCount > 0 && numSelected === rowCount} indeterminate={numSelected > 0 && numSelected < rowCount}
onChange={handleSelectAllClick} checked={rowCount > 0 && numSelected === rowCount}
inputProps={{ onChange={handleSelectAllClick}
"aria-label": "select all tasks shown in the table", inputProps={{
}} "aria-label": "select all tasks shown in the table",
/> }}
/>
</IconButton>
</TableCell> </TableCell>
{columns.map((col) => ( {columns.map((col) => (
<TableCell <TableCell
@@ -332,12 +334,14 @@ function Row(props: RowProps) {
onClick={() => history.push(taskDetailsPath(task.queue, task.id))} onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
> >
<TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}> <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
<Checkbox <IconButton>
onChange={(event: React.ChangeEvent<HTMLInputElement>) => <Checkbox
props.onSelectChange(event.target.checked) onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
} props.onSelectChange(event.target.checked)
checked={props.isSelected} }
/> checked={props.isSelected}
/>
</IconButton>
</TableCell> </TableCell>
<TableCell component="th" scope="row"> <TableCell component="th" scope="row">
{uuidPrefix(task.id)} {uuidPrefix(task.id)}

32
ui/src/components/PendingTasksTable.tsx
View File

@@ -218,14 +218,16 @@ function PendingTasksTable(props: Props & ReduxProps) {
padding="checkbox" padding="checkbox"
classes={{ stickyHeader: classes.stickyHeaderCell }} classes={{ stickyHeader: classes.stickyHeaderCell }}
> >
<Checkbox <IconButton>
indeterminate={numSelected > 0 && numSelected < rowCount} <Checkbox
checked={rowCount > 0 && numSelected === rowCount} indeterminate={numSelected > 0 && numSelected < rowCount}
onChange={handleSelectAllClick} checked={rowCount > 0 && numSelected === rowCount}
inputProps={{ onChange={handleSelectAllClick}
"aria-label": "select all tasks shown in the table", inputProps={{
}} "aria-label": "select all tasks shown in the table",
/> }}
/>
</IconButton>
</TableCell> </TableCell>
{columns.map((col) => ( {columns.map((col) => (
<TableCell <TableCell
@@ -334,12 +336,14 @@ function Row(props: RowProps) {
onClick={() => history.push(taskDetailsPath(task.queue, task.id))} onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
> >
<TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}> <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
<Checkbox <IconButton>
onChange={(event: React.ChangeEvent<HTMLInputElement>) => <Checkbox
props.onSelectChange(event.target.checked) onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
} props.onSelectChange(event.target.checked)
checked={props.isSelected} }
/> checked={props.isSelected}
/>
</IconButton>
</TableCell> </TableCell>
<TableCell component="th" scope="row"> <TableCell component="th" scope="row">
{uuidPrefix(task.id)} {uuidPrefix(task.id)}

32
ui/src/components/RetryTasksTable.tsx
View File

@@ -248,14 +248,16 @@ function RetryTasksTable(props: Props & ReduxProps) {
padding="checkbox" padding="checkbox"
classes={{ stickyHeader: classes.stickyHeaderCell }} classes={{ stickyHeader: classes.stickyHeaderCell }}
> >
<Checkbox <IconButton>
indeterminate={numSelected > 0 && numSelected < rowCount} <Checkbox
checked={rowCount > 0 && numSelected === rowCount} indeterminate={numSelected > 0 && numSelected < rowCount}
onChange={handleSelectAllClick} checked={rowCount > 0 && numSelected === rowCount}
inputProps={{ onChange={handleSelectAllClick}
"aria-label": "select all tasks shown in the table", inputProps={{
}} "aria-label": "select all tasks shown in the table",
/> }}
/>
</IconButton>
</TableCell> </TableCell>
{columns.map((col) => ( {columns.map((col) => (
<TableCell <TableCell
@@ -367,12 +369,14 @@ function Row(props: RowProps) {
onClick={() => history.push(taskDetailsPath(task.queue, task.id))} onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
> >
<TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}> <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
<Checkbox <IconButton>
onChange={(event: React.ChangeEvent<HTMLInputElement>) => <Checkbox
props.onSelectChange(event.target.checked) onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
} props.onSelectChange(event.target.checked)
checked={props.isSelected} }
/> checked={props.isSelected}
/>
</IconButton>
</TableCell> </TableCell>
<TableCell component="th" scope="row"> <TableCell component="th" scope="row">
{uuidPrefix(task.id)} {uuidPrefix(task.id)}

32
ui/src/components/ScheduledTasksTable.tsx
View File

@@ -245,14 +245,16 @@ function ScheduledTasksTable(props: Props & ReduxProps) {
padding="checkbox" padding="checkbox"
classes={{ stickyHeader: classes.stickyHeaderCell }} classes={{ stickyHeader: classes.stickyHeaderCell }}
> >
<Checkbox <IconButton>
indeterminate={numSelected > 0 && numSelected < rowCount} <Checkbox
checked={rowCount > 0 && numSelected === rowCount} indeterminate={numSelected > 0 && numSelected < rowCount}
onChange={handleSelectAllClick} checked={rowCount > 0 && numSelected === rowCount}
inputProps={{ onChange={handleSelectAllClick}
"aria-label": "select all tasks shown in the table", inputProps={{
}} "aria-label": "select all tasks shown in the table",
/> }}
/>
</IconButton>
</TableCell> </TableCell>
{columns.map((col) => ( {columns.map((col) => (
<TableCell <TableCell
@@ -363,12 +365,14 @@ function Row(props: RowProps) {
onClick={() => history.push(taskDetailsPath(task.queue, task.id))} onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
> >
<TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}> <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
<Checkbox <IconButton>
onChange={(event: React.ChangeEvent<HTMLInputElement>) => <Checkbox
props.onSelectChange(event.target.checked) onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
} props.onSelectChange(event.target.checked)
checked={props.isSelected} }
/> checked={props.isSelected}
/>
</IconButton>
</TableCell> </TableCell>
<TableCell component="th" scope="row"> <TableCell component="th" scope="row">
{uuidPrefix(task.id)} {uuidPrefix(task.id)}