feat: rename collection

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

@@ -52,6 +52,12 @@ const Wrapper = styled.div`
       }
     }
   }
+
+  #sidebar-collection-name {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
 `;
 
 export default Wrapper;

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

@@ -98,7 +98,7 @@ const Collection = ({ collection, searchText }) => {
       {showRenameCollectionModal && <RenameCollection collection={collection} onClose={() => setShowRenameCollectionModal(false)} />}
       {showRemoveCollectionModal && <RemoveCollection collection={collection} onClose={() => setShowRemoveCollectionModal(false)} />}
       <div className="flex py-1 collection-name items-center" ref={drop}>
-        <div className="flex flex-grow items-center" onClick={handleClick}>
+        <div className="flex flex-grow items-center overflow-hidden" onClick={handleClick}>
           <IconChevronRight size={16} strokeWidth={2} className={iconClassName} style={{ width: 16, color: 'rgb(160 160 160)' }} />
           <div className="ml-1" id="sidebar-collection-name">{collection.name}</div>
         </div>
@@ -122,8 +122,7 @@ const Collection = ({ collection, searchText }) => {
             >
               New Folder
             </div>
-            {/* Todo: implement rename collection */}
-            {/* <div
+            <div
               className="dropdown-item"
               onClick={(e) => {
                 menuDropdownTippyRef.current.hide();
@@ -131,7 +130,7 @@ const Collection = ({ collection, searchText }) => {
               }}
             >
               Rename
-            </div> */}
+            </div>
             <div
               className="dropdown-item"
               onClick={(e) => {