Add tool tips to the track button and the connection issues indicator.

kaspa-live · Mar 21, 2021 · d3036b5 · d3036b5
1 parent a0bb23a
commit d3036b5
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 12 deletions.
diff --git a/web/src/components/ConnectionIssuesIndicator.tsx b/web/src/components/ConnectionIssuesIndicator.tsx
@@ -1,14 +1,18 @@
-import {Box, CircularProgress, Typography} from "@material-ui/core";
+import {Box, CircularProgress, IconButton, Tooltip, Typography} from "@material-ui/core";
 
 const ConnectionIssuesIndicator = () => {
     return (
-        <Box position="relative" display="inline-flex">
-            <CircularProgress color="inherit" thickness={6.0} size="24px"/>
-            <Box top={3} left={0} bottom={0} right={0} position="absolute" display="flex"
-                 alignItems="center" justifyContent="center" fontWeight="fontWeightBold">
-                <Typography variant="button" component="div" color="inherit">!</Typography>
-            </Box>
-        </Box>
+        <Tooltip title="Connection is unstable">
+            <IconButton color="inherit">
+                <Box position="relative" display="inline-flex">
+                    <CircularProgress color="inherit" thickness={6.0} size="24px"/>
+                    <Box top={3} left={0} bottom={0} right={0} position="absolute" display="flex"
+                         alignItems="center" justifyContent="center" fontWeight="fontWeightBold">
+                        <Typography variant="button" component="div" color="inherit">!</Typography>
+                    </Box>
+                </Box>
+            </IconButton>
+        </Tooltip>
     );
 }
 

diff --git a/web/src/components/TrackButton.tsx b/web/src/components/TrackButton.tsx
@@ -1,11 +1,13 @@
 import FastForwardIcon from "@material-ui/icons/FastForward";
-import {IconButton} from "@material-ui/core";
+import {IconButton, Tooltip} from "@material-ui/core";
 
 const TrackButton = ({onClick}: { onClick: () => void }) => {
     return (
-        <IconButton color="inherit" onClick={onClick}>
-            <FastForwardIcon/>
-        </IconButton>
+        <Tooltip title="Track DAG tips">
+            <IconButton color="inherit" onClick={onClick}>
+                <FastForwardIcon/>
+            </IconButton>
+        </Tooltip>
     );
 }