disable tooltip if menu open

instill-ai · Jul 31, 2024 · a9e9d46 · a9e9d46
1 parent 8ffca60
commit a9e9d46
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/packages/toolkit/package.json b/packages/toolkit/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@instill-ai/toolkit",
-  "version": "0.97.0-rc.30",
+  "version": "0.97.0-rc.34",
   "description": "Instill AI's frontend toolkit",
   "repository": "https://github.com/instill-ai/design-system.git",
   "bugs": "https://github.com/instill-ai/design-system/issues",

diff --git a/packages/toolkit/src/view/knowledge/components/CreateKnowledgeBaseCard.tsx b/packages/toolkit/src/view/knowledge/components/CreateKnowledgeBaseCard.tsx
@@ -25,13 +25,15 @@ type MenuProps = {
   onEdit: (e: React.MouseEvent) => void;
   onDuplicate: (e: React.MouseEvent) => void;
   disabled: boolean;
+  isOpen: boolean;
+  setIsOpen: (isOpen: boolean) => void
 };
 
-const Menu = ({ onDelete, onEdit, onDuplicate, disabled }: MenuProps) => {
+const Menu = ({ onDelete, onEdit, onDuplicate, disabled, isOpen, setIsOpen }: MenuProps) => {
   return (
     <React.Fragment>
       <div className="flex justify-center z-10">
-        <DropdownMenu.Root>
+        <DropdownMenu.Root open={isOpen} onOpenChange={setIsOpen}>
           <DropdownMenu.Trigger asChild>
             <Button className="" variant="tertiaryGrey">
               <Icons.DotsHorizontal className="h-4 w-4 stroke-semantic-fg-secondary" />
@@ -101,6 +103,7 @@ export const CreateKnowledgeBaseCard = ({
   const [editDialogIsOpen, setEditDialogIsOpen] = React.useState(false);
   const [isHovered, setIsHovered] = React.useState(false);
   const [mousePosition, setMousePosition] = React.useState({ x: 0, y: 0 });
+  const [isMenuOpen, setIsMenuOpen] = React.useState(false);
 
   const { accessToken, enabledQuery, selectedNamespace } = useInstillStore(
     useShallow((store: InstillStore) => ({
@@ -186,7 +189,7 @@ Text Chunks #: ${totalChunks}
   return (
     <React.Fragment>
       <Tooltip.Provider>
-        <Tooltip.Root>
+        <Tooltip.Root disableHoverableContent={isMenuOpen}>
           <Tooltip.Trigger asChild>
             <div
               className="flex h-[175px] w-[360px] cursor-pointer flex-col rounded-md border border-semantic-bg-line bg-semantic-bg-primary p-5 shadow hover:bg-semantic-bg-base-bg"
@@ -213,6 +216,8 @@ Text Chunks #: ${totalChunks}
                   onEdit={handleEdit}
                   onDuplicate={handleDuplicate}
                   disabled={disabled}
+                  isOpen={isMenuOpen}
+                  setIsOpen={setIsMenuOpen}
                 />
               </div>
             </div>