added feat/-#220

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

@@ -1,22 +1,29 @@
 import React, { useState } from 'react';
-import { useSelector } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
-import { IconSearch, IconFolders } from '@tabler/icons';
+import { IconSearch, IconFolders, IconSortAZ } from '@tabler/icons';
 import Collection from '../Collections/Collection';
 import CreateCollection from '../CreateCollection';
 import StyledWrapper from './StyledWrapper';
 import CreateOrOpenCollection from './CreateOrOpenCollection';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
+import { sortCollections } from 'providers/ReduxStore/slices/collections/actions';
 
 const CollectionsBadge = () => {
+  const dispatch = useDispatch()
   return (
     <div className="items-center mt-2 relative">
-      <div className="collections-badge flex items-center pl-2 pr-2 py-1 select-none">
+      <div className='collections-badge flex items-center justify-between px-2'  >
+        <div className="flex items-center  py-1 select-none">
           <span className="mr-2">
             <IconFolders size={18} strokeWidth={1.5} />
           </span>
           <span>Collections</span>
         </div>
+        <button onClick={() => dispatch(sortCollections())} >
+          <IconSortAZ size={18} strokeWidth={1.5} />
+        </button>
+      </div>
     </div>
   );
 };

packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js

@@ -34,6 +34,7 @@ import {
   renameItem as _renameItem,
   cloneItem as _cloneItem,
   deleteItem as _deleteItem,
+  sortCollections as _sortCollections,
   saveRequest as _saveRequest,
   selectEnvironment as _selectEnvironment,
   createCollection as _createCollection,
@@ -353,6 +354,9 @@ export const deleteItem = (itemUid, collectionUid) => (dispatch, getState) => {
   });
 };
 
+export const sortCollections = () => (dispatch) => {
+  dispatch(_sortCollections())
+}
 export const moveItem = (collectionUid, draggedItemUid, targetItemUid) => (dispatch, getState) => {
   const state = getState();
   const collection = findCollectionByUid(state.collections.collections, collectionUid);

packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js

@@ -70,6 +70,9 @@ export const collectionsSlice = createSlice({
     removeCollection: (state, action) => {
       state.collections = filter(state.collections, (c) => c.uid !== action.payload.collectionUid);
     },
+    sortCollections: (state) => {
+      state.collections = state.collections.sort((a, b) => a.name.localeCompare(b.name))
+    },
     updateLastAction: (state, action) => {
       const { collectionUid, lastAction } = action.payload;
       const collection = findCollectionByUid(state.collections, collectionUid);
@@ -1141,6 +1144,7 @@ export const {
   brunoConfigUpdateEvent,
   renameCollection,
   removeCollection,
+  sortCollections,
   updateLastAction,
   collectionUnlinkEnvFileEvent,
   saveEnvironment,