diff --git a/packages/bruno-app/src/components/Sidebar/Collections/index.js b/packages/bruno-app/src/components/Sidebar/Collections/index.js
index 57b14a0d7..4d427ee35 100644
--- a/packages/bruno-app/src/components/Sidebar/Collections/index.js
+++ b/packages/bruno-app/src/components/Sidebar/Collections/index.js
@@ -1,6 +1,6 @@
import React, { useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
-import { IconSearch, IconFolders, IconSortAZ } from '@tabler/icons';
+import { IconSearch, IconFolders, IconArrowsSort, IconSortAscendingLetters, IconSortDescendingLetters } from '@tabler/icons';
import Collection from '../Collections/Collection';
import CreateCollection from '../CreateCollection';
import StyledWrapper from './StyledWrapper';
@@ -11,6 +11,23 @@ import { sortCollections } from 'providers/ReduxStore/slices/collections/actions
const CollectionsBadge = () => {
const dispatch = useDispatch()
+ const { collections } = useSelector((state) => state.collections);
+ const { collectionSortOrder } = useSelector((state) => state.collections);
+ const sortCollectionOrder = () => {
+ let order;
+ switch (collectionSortOrder) {
+ case 'default':
+ order = 'alphabetical'
+ break;
+ case 'alphabetical':
+ order = 'reverseAlphabetical'
+ break;
+ case 'reverseAlphabetical':
+ order = 'default'
+ break;
+ }
+ dispatch(sortCollections({ order }))
+ }
return (
@@ -20,9 +37,16 @@ const CollectionsBadge = () => {
Collections
-
+ {
+ collections.length >= 1 &&
+ }
+
);
diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
index b91c7c8fe..856431e9b 100644
--- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
+++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
@@ -34,12 +34,12 @@ import {
renameItem as _renameItem,
cloneItem as _cloneItem,
deleteItem as _deleteItem,
- sortCollections as _sortCollections,
saveRequest as _saveRequest,
selectEnvironment as _selectEnvironment,
createCollection as _createCollection,
renameCollection as _renameCollection,
removeCollection as _removeCollection,
+ sortCollections as _sortCollections,
collectionAddEnvFileEvent as _collectionAddEnvFileEvent
} from './index';
@@ -145,7 +145,10 @@ export const cancelRequest = (cancelTokenUid, item, collection) => (dispatch) =>
})
.catch((err) => console.log(err));
};
-
+export const sortCollections = (order) => (dispatch) => {
+ console.log("working")
+ dispatch(_sortCollections(order))
+}
export const runCollectionFolder = (collectionUid, folderUid, recursive) => (dispatch, getState) => {
const state = getState();
const collection = findCollectionByUid(state.collections.collections, collectionUid);
@@ -375,9 +378,6 @@ 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);
diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js
index 8227efc6b..24ad23a8d 100644
--- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js
+++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js
@@ -28,7 +28,8 @@ import { getSubdirectoriesFromRoot, getDirectoryName } from 'utils/common/platfo
const PATH_SEPARATOR = path.sep;
const initialState = {
- collections: []
+ collections: [],
+ collectionSortOrder: 'default'
};
export const collectionsSlice = createSlice({
@@ -38,13 +39,14 @@ export const collectionsSlice = createSlice({
createCollection: (state, action) => {
const collectionUids = map(state.collections, (c) => c.uid);
const collection = action.payload;
-
// last action is used to track the last action performed on the collection
// this is optional
// this is used in scenarios where we want to know the last action performed on the collection
// and take some extra action based on that
// for example, when a env is created, we want to auto select it the env modal
+ collection.importedAt = new Date().getTime()
collection.lastAction = null;
+ console.log(collection)
collapseCollection(collection);
addDepth(collection.items);
@@ -70,8 +72,19 @@ 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))
+ sortCollections: (state, action) => {
+ state.collectionSortOrder = action.payload.order
+ switch (action.payload.order) {
+ case 'default':
+ state.collections = state.collections.sort((a, b) => a.importedAt - b.importedAt)
+ break;
+ case 'alphabetical':
+ state.collections = state.collections.sort((a, b) => a.name.localeCompare(b.name))
+ break;
+ case 'reverseAlphabetical':
+ state.collections = state.collections.sort((a, b) => b.name.localeCompare(a.name))
+ break;
+ }
},
updateLastAction: (state, action) => {
const { collectionUid, lastAction } = action.payload;