fix event triggered when hold mouse click and release at sidebar

packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/index.js

@@ -88,44 +88,41 @@ const CollectionItem = ({ item, collection, searchText }) => {
   });
 
   const handleClick = (event) => {
-    switch (event.button) {
+    if (isItemARequest(item)) {
-      case 0: // left click
+      dispatch(hideHomePage());
-        if (isItemARequest(item)) {
+      if (itemIsOpenedInTabs(item, tabs)) {
-          dispatch(hideHomePage());
-          if (itemIsOpenedInTabs(item, tabs)) {
-            dispatch(
-              focusTab({
-                uid: item.uid
-              })
-            );
-            return;
-          }
-          dispatch(
-            addTab({
-              uid: item.uid,
-              collectionUid: collection.uid,
-              requestPaneTab: getDefaultRequestPaneTab(item)
-            })
-          );
-          return;
-        }
         dispatch(
-          collectionFolderClicked({
+          focusTab({
-            itemUid: item.uid,
+            uid: item.uid
-            collectionUid: collection.uid
           })
         );
         return;
-      case 2: // right click
+      }
-        const _menuDropdown = dropdownTippyRef.current;
+      dispatch(
-        if (_menuDropdown) {
+        addTab({
-          let menuDropdownBehavior = 'show';
+          uid: item.uid,
-          if (_menuDropdown.state.isShown) {
+          collectionUid: collection.uid,
-            menuDropdownBehavior = 'hide';
+          requestPaneTab: getDefaultRequestPaneTab(item)
-          }
+        })
-          _menuDropdown[menuDropdownBehavior]();
+      );
-        }
+      return;
-        return;
+    }
+    dispatch(
+      collectionFolderClicked({
+        itemUid: item.uid,
+        collectionUid: collection.uid
+      })
+    );
+  };
+
+  const handleRightClick = (event) => {
+    const _menuDropdown = dropdownTippyRef.current;
+    if (_menuDropdown) {
+      let menuDropdownBehavior = 'show';
+      if (_menuDropdown.state.isShown) {
+        menuDropdownBehavior = 'hide';
+      }
+      _menuDropdown[menuDropdownBehavior]();
     }
   };
 
@@ -203,7 +200,8 @@ const CollectionItem = ({ item, collection, searchText }) => {
             ? indents.map((i) => {
                 return (
                   <div
-                    onMouseUp={handleClick}
+                    onClick={handleClick}
+                    onContextMenu={handleRightClick}
                     onDoubleClick={handleDoubleClick}
                     className="indent-block"
                     key={i}
@@ -219,7 +217,8 @@ const CollectionItem = ({ item, collection, searchText }) => {
               })
             : null}
           <div
-            onMouseUp={handleClick}
+            onClick={handleClick}
+            onContextMenu={handleRightClick}
             onDoubleClick={handleDoubleClick}
             className="flex flex-grow items-center h-full overflow-hidden"
             style={{

packages/bruno-app/src/components/Sidebar/Collections/Collection/index.js

@@ -66,20 +66,17 @@ const Collection = ({ collection, searchText }) => {
   });
 
   const handleClick = (event) => {
+    dispatch(collectionClicked(collection.uid));
+  };
+
+  const handleRightClick = (event) => {
     const _menuDropdown = menuDropdownTippyRef.current;
-    switch (event.button) {
+    if (_menuDropdown) {
-      case 0: // left click
+      let menuDropdownBehavior = 'show';
-        dispatch(collectionClicked(collection.uid));
+      if (_menuDropdown.state.isShown) {
-        return;
+        menuDropdownBehavior = 'hide';
-      case 2: // right click
+      }
-        if (_menuDropdown) {
+      _menuDropdown[menuDropdownBehavior]();
-          let menuDropdownBehavior = 'show';
-          if (_menuDropdown.state.isShown) {
-            menuDropdownBehavior = 'hide';
-          }
-          _menuDropdown[menuDropdownBehavior]();
-        }
-        return;
     }
   };
 
@@ -138,7 +135,11 @@ const Collection = ({ collection, searchText }) => {
         <CollectionProperties collection={collection} onClose={() => setCollectionPropertiesModal(false)} />
       )}
       <div className="flex py-1 collection-name items-center" ref={drop}>
-        <div className="flex flex-grow items-center overflow-hidden" onMouseUp={handleClick}>
+        <div
+          className="flex flex-grow items-center overflow-hidden"
+          onClick={handleClick}
+          onContextMenu={handleRightClick}
+        >
           <IconChevronRight
             size={16}
             strokeWidth={2}