diff --git a/src/components/connection/connection-item.tsx b/src/components/connection/connection-item.tsx index 088ef55b24d3ecd231e0d938e1ff3b67a58ac946..e6379dfa654a15bb0e77e0454e2802497eb6fa30 100644 --- a/src/components/connection/connection-item.tsx +++ b/src/components/connection/connection-item.tsx @@ -1,11 +1,11 @@ import dayjs from "dayjs"; import { useLockFn } from "ahooks"; -import { styled, Box, ListItem, IconButton, ListItemText } from "@mui/material"; +import { styled, ListItem, IconButton, ListItemText } from "@mui/material"; import { CloseRounded } from "@mui/icons-material"; import { ApiType } from "../../services/types"; import { deleteConnection } from "../../services/api"; -const Tag = styled(Box)(({ theme }) => ({ +const Tag = styled("span")(({ theme }) => ({ display: "inline-block", fontSize: "12px", padding: "0 4px", @@ -37,16 +37,19 @@ const ConnectionItem = (props: Props) => { <ListItemText primary={value.metadata.host || value.metadata.destinationIP} secondary={ - <Box> + <> <Tag sx={{ textTransform: "uppercase", color: "success" }}> {value.metadata.network} </Tag> + <Tag>{value.metadata.type}</Tag> + {value.chains.length > 0 && ( <Tag>{value.chains[value.chains.length - 1]}</Tag> )} + <Tag>{dayjs(value.start).fromNow()}</Tag> - </Box> + </> } /> </ListItem> diff --git a/src/components/log/log-item.tsx b/src/components/log/log-item.tsx index 8fd17fcd55c248cbb32cfcf4798afd8a3b838152..9d99c8c4b6d333591ea90f4b72cf147eb31f3cde 100644 --- a/src/components/log/log-item.tsx +++ b/src/components/log/log-item.tsx @@ -6,6 +6,8 @@ const Item = styled(Box)(({ theme }) => ({ margin: "0 12px", lineHeight: 1.35, borderBottom: `1px solid ${theme.palette.divider}`, + fontSize: "0.875rem", + userSelect: "text", "& .time": {}, "& .type": { display: "inline-block",