sort folder contents the same as we do for the tree

Author: brendan-kellam

packages/web/src/features/fileTree/api.ts

@@ -10,6 +10,7 @@ import path from 'path';
 import { simpleGit } from 'simple-git';
 import { FileTreeItem } from './types';
 import { buildFileTree, getPathspecs, isPathValid, normalizePath } from './utils';
+import { compareFileTreeItems } from './utils';
 
 const logger = createLogger('file-tree');
 
@@ -136,6 +137,9 @@ export const getFolderContents = async (params: { repoName: string, revisionName
             }
         });
 
+        // Sort the contents in place, first by type (trees before blobs), then by name.
+        contents.sort(compareFileTreeItems);
+
         return contents;
     }));
 

packages/web/src/features/fileTree/utils.ts

@@ -1,4 +1,4 @@
-import { FileTreeNode } from "./types";
+import { FileTreeItem, FileTreeNode } from "./types";
 
 export const normalizePath = (path: string): string => {
     // Normalize the path by...
@@ -83,12 +83,7 @@ export const buildFileTree = (flatList: { type: string, path: string }[]): FileT
 
         const sortedChildren = node.children
             .map(sortTree)
-            .sort((a: FileTreeNode, b: FileTreeNode) => {
-                if (a.type !== b.type) {
-                    return a.type === 'tree' ? -1 : 1;
-                }
-                return a.name.localeCompare(b.name, undefined, { sensitivity: 'base' });
-            });
+            .sort(compareFileTreeItems);
 
         return {
             ...node,
@@ -98,3 +93,10 @@ export const buildFileTree = (flatList: { type: string, path: string }[]): FileT
 
     return sortTree(root);
 }
+
+export const compareFileTreeItems = (a: FileTreeItem, b: FileTreeItem): number => {
+    if (a.type !== b.type) {
+        return a.type === 'tree' ? -1 : 1;
+    }
+    return a.name.localeCompare(b.name, undefined, { sensitivity: 'base' });
+}