Show Tooltips only when drawer is minimized (#140)

* Show Tooltips only when drawer is minimized Signed-off-by: Snehil Shah <[email protected]> * Fix Failing ESLint `Audit` Workflow Signed-off-by: Snehil Shah <[email protected]> --------- Signed-off-by: Snehil Shah <[email protected]>
qdrant · Feb 16, 2024 · f036023 · f036023
1 parent 3119264
commit f036023
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 17 deletions.
diff --git a/src/components/Sidebar/Sidebar.jsx b/src/components/Sidebar/Sidebar.jsx
@@ -64,7 +64,7 @@ export default function Sidebar({ open, version }) {
       <Divider />
       <List>
         <ListItem key={'Console'} disablePadding sx={{ display: 'block' }}>
-          <Tooltip title={'Console'} placement={'right'} arrow={true}>
+          <Tooltip title={'Console'} placement={'right'} arrow={true} disableHoverListener={open}>
             <ListItemButton
               sx={{
                 minHeight: 48,
@@ -88,7 +88,7 @@ export default function Sidebar({ open, version }) {
           </Tooltip>
         </ListItem>
         <ListItem key={'Collections'} disablePadding sx={{ display: 'block' }}>
-          <Tooltip title={'Collections'} placement={'right'} arrow={true}>
+          <Tooltip title={'Collections'} placement={'right'} arrow={true} disableHoverListener={open}>
             <ListItemButton
               sx={{
                 minHeight: 48,

diff --git a/src/components/Sidebar/SidebarTutorialSection.jsx b/src/components/Sidebar/SidebarTutorialSection.jsx
@@ -10,20 +10,18 @@ const TutorialsList = tutorialSubPages.map((page) => {
   const [slug, pageObject] = page;
   return (
     <ListItem key={slug} disablePadding sx={{ display: 'block' }}>
-      <Tooltip title={pageObject.title} placement={'right'} arrow={true}>
-        <ListItemButton
-          sx={{
-            minHeight: 48,
-            justifyContent: 'initial',
-            pr: 2.5,
-            pl: 5,
-          }}
-          component={Link}
-          to={`/tutorial/${slug}`}
-        >
-          <ListItemText primary={pageObject.title} />
-        </ListItemButton>
-      </Tooltip>
+      <ListItemButton
+        sx={{
+          minHeight: 48,
+          justifyContent: 'initial',
+          pr: 2.5,
+          pl: 5,
+        }}
+        component={Link}
+        to={`/tutorial/${slug}`}
+      >
+        <ListItemText primary={pageObject.title} />
+      </ListItemButton>
     </ListItem>
   );
 });
@@ -43,7 +41,7 @@ export const SidebarTutorialSection = ({ isSidebarOpen }) => {
 
   return (
     <>
-      <Tooltip title={'Tutorial'} placement={'right'} arrow={true}>
+      <Tooltip title={'Tutorial'} placement={'right'} arrow={true} disableHoverListener={isSidebarOpen}>
         <ListItemButton
           sx={{
             minHeight: 48,