diff --git a/admin/src/features/reqlog/components/RequestLogs.tsx b/admin/src/features/reqlog/components/RequestLogs.tsx index df505b0..daf17a3 100644 --- a/admin/src/features/reqlog/components/RequestLogs.tsx +++ b/admin/src/features/reqlog/components/RequestLogs.tsx @@ -1,4 +1,16 @@ -import { Alert, Box, Link, MenuItem, Snackbar } from "@mui/material"; +import ContentCopyIcon from "@mui/icons-material/ContentCopy"; +import { + Alert, + Box, + IconButton, + Link, + MenuItem, + Snackbar, + styled, + TableCell, + TableCellProps, + Tooltip, +} from "@mui/material"; import { useRouter } from "next/router"; import { useState } from "react"; @@ -10,6 +22,11 @@ import SplitPane from "lib/components/SplitPane"; import useContextMenu from "lib/components/useContextMenu"; import { useCreateSenderRequestFromHttpRequestLogMutation, useHttpRequestLogsQuery } from "lib/graphql/generated"; +const ActionsTableCell = styled(TableCell)(() => ({ + paddingTop: 0, + paddingBottom: 0, +})); + export function RequestLogs(): JSX.Element { const router = useRouter(); const id = router.query.id as string | undefined; @@ -17,7 +34,13 @@ export function RequestLogs(): JSX.Element { pollInterval: 1000, }); - const [createSenderReqFromLog] = useCreateSenderRequestFromHttpRequestLogMutation({}); + const [createSenderReqFromLog] = useCreateSenderRequestFromHttpRequestLogMutation({ + onCompleted({ createSenderRequestFromHttpRequestLog }) { + const { id } = createSenderRequestFromHttpRequestLog; + setNewSenderReqId(id); + setCopiedReqNotifOpen(true); + }, + }); const [copyToSenderId, setCopyToSenderId] = useState(""); const [Menu, handleContextMenu, handleContextMenuClose] = useContextMenu(); @@ -27,11 +50,6 @@ export function RequestLogs(): JSX.Element { variables: { id: copyToSenderId, }, - onCompleted({ createSenderRequestFromHttpRequestLog }) { - const { id } = createSenderRequestFromHttpRequestLog; - setNewSenderReqId(id); - setCopiedReqNotifOpen(true); - }, }); handleContextMenuClose(); }; @@ -54,6 +72,26 @@ export function RequestLogs(): JSX.Element { handleContextMenu(e); }; + const actionsCell = (id: string) => ( + + + { + setCopyToSenderId(id); + createSenderReqFromLog({ + variables: { + id, + }, + }); + }} + > + + + + + ); + return ( @@ -77,6 +115,7 @@ export function RequestLogs(): JSX.Element { diff --git a/admin/src/lib/components/RequestsTable.tsx b/admin/src/lib/components/RequestsTable.tsx index baa9b17..b3862de 100644 --- a/admin/src/lib/components/RequestsTable.tsx +++ b/admin/src/lib/components/RequestsTable.tsx @@ -62,12 +62,13 @@ interface HttpResponse { interface Props { requests: HttpRequest[]; activeRowId?: string; + actionsCell?: (id: string) => JSX.Element; onRowClick?: (id: string) => void; onContextMenu?: (e: React.MouseEvent, id: string) => void; } export default function RequestsTable(props: Props): JSX.Element { - const { requests, activeRowId, onRowClick, onContextMenu } = props; + const { requests, activeRowId, actionsCell, onRowClick, onContextMenu } = props; return ( @@ -78,6 +79,7 @@ export default function RequestsTable(props: Props): JSX.Element { Origin Path Status + {actionsCell && } @@ -104,6 +106,7 @@ export default function RequestsTable(props: Props): JSX.Element { {response && } + {actionsCell && actionsCell(id)} ); })}