fix(archive): Add default sort order (#1162)

* fix(archive): Add default sort order
* add default sort order
* fix sorting of file sizes with a size of 0

* fix(archive): PR Feedback

* fix(archive): Add more testing for sorting

* fix(archive): Handle undefined in sort

Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com>

src/lib/viewers/archive/ArchiveExplorer.js

@@ -50,8 +50,8 @@ class ArchiveExplorer extends React.Component {
         this.state = {
             fullPath: ROOT_FOLDER,
             searchQuery: '',
-            sortBy: '',
-            sortDirection: SortDirection.ASC,
+            sortBy: 'name',
+            sortDirection: SortDirection.DESC,
             view: VIEW_FOLDER,
         };
     }
@@ -168,18 +168,29 @@ class ArchiveExplorer extends React.Component {
         }
 
         const sortedItems = itemList.sort((a = {}, b = {}) => {
-            if (!a[sortBy] || !b[sortBy]) {
+            const aItem = a[sortBy];
+            const bItem = b[sortBy];
+
+            if (aItem === null || aItem === undefined) {
+                return 1;
+            }
+
+            if (bItem === null || bItem === undefined) {
                 return -1;
             }
 
-            if (typeof a[sortBy] === 'number' && typeof b[sortBy] === 'number') {
-                return a[sortBy] - b[sortBy];
+            if (typeof aItem === 'number' && typeof bItem === 'number') {
+                return aItem - bItem;
+            }
+
+            if (typeof aItem === 'string' && typeof bItem === 'string') {
+                return aItem.localeCompare(bItem);
             }
 
-            return a[sortBy].localeCompare(b[sortBy]);
+            return 0;
         });
 
-        return sortDirection === SortDirection.ASC ? sortedItems : sortedItems.reverse();
+        return sortDirection === SortDirection.DESC ? sortedItems : sortedItems.reverse();
     }
 
     /**

src/lib/viewers/archive/__tests__/ArchiveExplorer-test-react.js

@@ -181,34 +181,34 @@ describe('lib/viewers/archive/ArchiveExplorer', () => {
     });
 
     describe('sortItemList()', () => {
-        it('should sort itemList by size and be in ASC order', () => {
+        it('should sort itemList by size and be in DESC order', () => {
             const component = getComponent({ filename, itemCollection: data });
             const instance = component.instance();
             const itemList = instance.getItemList(data, 'test/');
 
-            instance.handleSort({ sortBy: 'size', sortDirection: 'ASC' });
+            instance.handleSort({ sortBy: 'size', sortDirection: 'DESC' });
             const sortedList = instance.sortItemList(itemList);
 
             expect(sortedList[0]).to.equal(data[2]);
         });
 
-        it('should sort itemList by name and be in DESC order', () => {
+        it('should sort itemList by name and be in ASC order', () => {
             const component = getComponent({ filename, itemCollection: data });
             const instance = component.instance();
             const itemList = instance.getItemList(data, 'test/');
 
-            instance.handleSort({ sortBy: 'name', sortDirection: 'DESC' });
+            instance.handleSort({ sortBy: 'name', sortDirection: 'ASC' });
             const sortedList = instance.sortItemList(itemList);
 
             expect(sortedList[0]).to.equal(data[2]);
         });
 
-        it('should sort itemList by name and be in ASC order', () => {
+        it('should sort itemList by name and be in DESC order', () => {
             const component = getComponent({ filename, itemCollection: data });
             const instance = component.instance();
             const itemList = instance.getItemList(data, 'test/');
 
-            instance.handleSort({ sortBy: 'name', sortDirection: 'ASC' });
+            instance.handleSort({ sortBy: 'name', sortDirection: 'DESC' });
             const sortedList = instance.sortItemList(itemList);
 
             expect(sortedList[0]).to.equal(data[1]);
@@ -224,7 +224,7 @@ describe('lib/viewers/archive/ArchiveExplorer', () => {
             expect(sortedList[0]).to.equal(itemList[0]);
         });
 
-        it('should sort item list with null values', () => {
+        it('should sort item list with string values and null', () => {
             data[1].modified_at = null;
             data[2].modified_at = null;
 
@@ -238,5 +238,34 @@ describe('lib/viewers/archive/ArchiveExplorer', () => {
 
             expect(sortedList[0]).to.equal(itemList[0]);
         });
+
+        it('should sort items with number values and null', () => {
+            const mockData = [
+                { size: 1 },
+                { size: 1 },
+                { size: 130 },
+                { size: null },
+                { size: 100 },
+                { size: undefined },
+            ];
+            const sortedMockData = [
+                { size: null },
+                { size: undefined },
+                { size: 130 },
+                { size: 100 },
+                { size: 1 },
+                { size: 1 },
+            ];
+            const component = getComponent({ filename, itemCollection: data });
+            const instance = component.instance();
+
+            instance.handleSort({ sortBy: 'size' });
+
+            expect(instance.sortItemList(mockData).toString()).to.equal(sortedMockData.toString());
+
+            instance.handleSort({ sortBy: 'size', sortDirection: 'ASC' });
+
+            expect(instance.sortItemList(mockData).toString()).to.equal(sortedMockData.reverse().toString());
+        });
     });
 });