fix(nui): Set resource name overflow to ellipsis

overextended · Jan 6, 2022 · cbf47dc · cbf47dc
1 parent 1948c78
commit cbf47dc
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/ui/src/components/NavBars/LeftBar.tsx b/ui/src/components/NavBars/LeftBar.tsx
@@ -16,7 +16,13 @@ const LeftBar: React.FC = () => {
       <VStack align="left">
         {initData.resources.map((resource, index) => (
           <Link to={resource} key={`${resource}-${index}`}>
-            <Box _hover={{ transform: 'scale(1.1)', color: 'white' }} color="grey">
+            <Box
+              _hover={{ transform: 'scale(1.1)', color: 'white' }}
+              color="grey"
+              textOverflow="ellipsis"
+              overflow="hidden"
+              whiteSpace="nowrap"
+            >
               {resource}
             </Box>
           </Link>

diff --git a/ui/src/components/Resource.tsx b/ui/src/components/Resource.tsx
@@ -56,7 +56,7 @@ const Resource: React.FC = () => {
         accessor: 'query',
       },
       {
-        Header: 'Execution time',
+        Header: 'Execution time (ms)',
         accessor: 'executionTime',
       },
     ],