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

Add tooltip to action buttons and links

Browse Source
This commit is contained in:
Ken Hibino
2021-01-09 17:58:03 -08:00
parent 251b262798
commit 95eb3e0855
3 changed files with 45 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
ui/src/components/ListItemLink.tsx
View File

@@ -3,6 +3,7 @@ import clsx from "clsx";
import ListItem from "@material-ui/core/ListItem";
import ListItemIcon from "@material-ui/core/ListItemIcon";
import ListItemText from "@material-ui/core/ListItemText";
import Tooltip from "@material-ui/core/Tooltip";
import { makeStyles } from "@material-ui/core/styles";
import {
useRouteMatch,
@@ -52,23 +53,25 @@ function ListItemLink(props: Props): ReactElement {
);
return (
<li>
<ListItem
button
component={renderLink}
className={clsx(classes.listItem, isMatch && classes.selected)}
>
{icon && (
<ListItemIcon className={clsx(isMatch && classes.selectedIcon)}>
{icon}
</ListItemIcon>
)}
<ListItemText
primary={primary}
classes={{
primary: isMatch ? classes.selectedText : undefined,
}}
/>
</ListItem>
<Tooltip title={primary} placement="right">
<ListItem
button
component={renderLink}
className={clsx(classes.listItem, isMatch && classes.selected)}
>
{icon && (
<ListItemIcon className={clsx(isMatch && classes.selectedIcon)}>
{icon}
</ListItemIcon>
)}
<ListItemText
primary={primary}
classes={{
primary: isMatch ? classes.selectedText : undefined,
}}
/>
</ListItem>
</Tooltip>
</li>
);
}