diff --git a/ui/src/components/ActiveTasksTable.tsx b/ui/src/components/ActiveTasksTable.tsx index 65156ce..539f179 100644 --- a/ui/src/components/ActiveTasksTable.tsx +++ b/ui/src/components/ActiveTasksTable.tsx @@ -36,6 +36,7 @@ import { ActiveTaskExtended } from "../reducers/tasksReducer"; import { durationBefore, timeAgo, uuidPrefix, prettifyPayload } from "../utils"; import { TableColumn } from "../types/table"; import { taskDetailsPath } from "../paths"; +import FileCopyOutlinedIcon from '@material-ui/icons/FileCopyOutlined'; const useStyles = makeStyles((theme) => ({ table: { @@ -264,8 +265,14 @@ function ActiveTasksTable(props: Props & ReduxProps) { const useRowStyles = makeStyles((theme) => ({ root: { cursor: "pointer", + "& #copy-button": { + display: "none" + }, "&:hover": { boxShadow: theme.shadows[2], + "& #copy-button": { + display: "inline-block" + } }, "&:hover .MuiTableCell-root": { borderBottomColor: theme.palette.background.paper, @@ -306,6 +313,19 @@ function Row(props: RowProps) { {uuidPrefix(task.id)} + + { + e.stopPropagation() + navigator.clipboard.writeText(task.id) + } + } + size="small" + id="copy-button" + > + + + {task.type} diff --git a/ui/src/components/ArchivedTasksTable.tsx b/ui/src/components/ArchivedTasksTable.tsx index 9686e7c..8e18ca8 100644 --- a/ui/src/components/ArchivedTasksTable.tsx +++ b/ui/src/components/ArchivedTasksTable.tsx @@ -21,6 +21,7 @@ import Alert from "@material-ui/lab/Alert"; import AlertTitle from "@material-ui/lab/AlertTitle"; import SyntaxHighlighter from "./SyntaxHighlighter"; import { AppState } from "../store"; +import FileCopyOutlinedIcon from '@material-ui/icons/FileCopyOutlined'; import { batchDeleteArchivedTasksAsync, batchRunArchivedTasksAsync, @@ -294,8 +295,14 @@ function ArchivedTasksTable(props: Props & ReduxProps) { const useRowStyles = makeStyles((theme) => ({ root: { cursor: "pointer", + "& #copy-button": { + display: "none" + }, "&:hover": { boxShadow: theme.shadows[2], + "& #copy-button": { + display: "inline-block" + } }, "&:hover .MuiTableCell-root": { borderBottomColor: theme.palette.background.paper, @@ -345,6 +352,19 @@ function Row(props: RowProps) { {uuidPrefix(task.id)} + + { + e.stopPropagation() + navigator.clipboard.writeText(task.id) + } + } + size="small" + id="copy-button" + > + + + {task.type} diff --git a/ui/src/components/CompletedTasksTable.tsx b/ui/src/components/CompletedTasksTable.tsx index 1782dac..73da0da 100644 --- a/ui/src/components/CompletedTasksTable.tsx +++ b/ui/src/components/CompletedTasksTable.tsx @@ -20,6 +20,7 @@ import Alert from "@material-ui/lab/Alert"; import AlertTitle from "@material-ui/lab/AlertTitle"; import SyntaxHighlighter from "./SyntaxHighlighter"; import { AppState } from "../store"; +import FileCopyOutlinedIcon from '@material-ui/icons/FileCopyOutlined'; import { listCompletedTasksAsync, deleteAllCompletedTasksAsync, @@ -270,8 +271,14 @@ function CompletedTasksTable(props: Props & ReduxProps) { const useRowStyles = makeStyles((theme) => ({ root: { cursor: "pointer", + "& #copy-button": { + display: "none" + }, "&:hover": { boxShadow: theme.shadows[2], + "& #copy-button": { + display: "inline-block" + } }, "&:hover .MuiTableCell-root": { borderBottomColor: theme.palette.background.paper, @@ -320,6 +327,19 @@ function Row(props: RowProps) { {uuidPrefix(task.id)} + + { + e.stopPropagation() + navigator.clipboard.writeText(task.id) + } + } + size="small" + id="copy-button" + > + + + {task.type} diff --git a/ui/src/components/PendingTasksTable.tsx b/ui/src/components/PendingTasksTable.tsx index e74a0ca..9fbfe24 100644 --- a/ui/src/components/PendingTasksTable.tsx +++ b/ui/src/components/PendingTasksTable.tsx @@ -346,14 +346,12 @@ function Row(props: RowProps) { {uuidPrefix(task.id)} - { + onClick={(e) =>{ e.stopPropagation() navigator.clipboard.writeText(task.id) } } size="small" id="copy-button" - className={classes.actionButton} > diff --git a/ui/src/components/RetryTasksTable.tsx b/ui/src/components/RetryTasksTable.tsx index 3897581..abced21 100644 --- a/ui/src/components/RetryTasksTable.tsx +++ b/ui/src/components/RetryTasksTable.tsx @@ -44,6 +44,7 @@ import { usePolling } from "../hooks"; import { TaskInfoExtended } from "../reducers/tasksReducer"; import { TableColumn } from "../types/table"; import { taskDetailsPath } from "../paths"; +import FileCopyOutlinedIcon from '@material-ui/icons/FileCopyOutlined'; const useStyles = makeStyles((theme) => ({ table: { @@ -327,8 +328,14 @@ function RetryTasksTable(props: Props & ReduxProps) { const useRowStyles = makeStyles((theme) => ({ root: { cursor: "pointer", + "& #copy-button": { + display: "none" + }, "&:hover": { boxShadow: theme.shadows[2], + "& #copy-button": { + display: "inline-block" + } }, "&:hover .MuiTableCell-root": { borderBottomColor: theme.palette.background.paper, @@ -380,6 +387,19 @@ function Row(props: RowProps) { {uuidPrefix(task.id)} + + { + e.stopPropagation() + navigator.clipboard.writeText(task.id) + } + } + size="small" + id="copy-button" + > + + + {task.type} diff --git a/ui/src/components/ScheduledTasksTable.tsx b/ui/src/components/ScheduledTasksTable.tsx index b5ff758..b3b7f5a 100644 --- a/ui/src/components/ScheduledTasksTable.tsx +++ b/ui/src/components/ScheduledTasksTable.tsx @@ -44,6 +44,7 @@ import { usePolling } from "../hooks"; import { TaskInfoExtended } from "../reducers/tasksReducer"; import { TableColumn } from "../types/table"; import { taskDetailsPath } from "../paths"; +import FileCopyOutlinedIcon from '@material-ui/icons/FileCopyOutlined'; const useStyles = makeStyles((theme) => ({ table: { @@ -324,8 +325,14 @@ function ScheduledTasksTable(props: Props & ReduxProps) { const useRowStyles = makeStyles((theme) => ({ root: { cursor: "pointer", + "& #copy-button": { + display: "none" + }, "&:hover": { boxShadow: theme.shadows[2], + "& #copy-button": { + display: "inline-block" + } }, "&:hover .MuiTableCell-root": { borderBottomColor: theme.palette.background.paper, @@ -376,6 +383,19 @@ function Row(props: RowProps) { {uuidPrefix(task.id)} + + { + e.stopPropagation() + navigator.clipboard.writeText(task.id) + } + } + size="small" + id="copy-button" + > + + + {task.type}