From 86e85fbac0837e6df09bc8f8d5ac0a7ae1fbafa1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ren=C3=A9=20Pfeuffer?= <rene.pfeuffer@cloudogu.com>
Date: Wed, 17 Oct 2018 16:01:40 +0200
Subject: [PATCH] Sort files directories first and by name

---
 .../packages/ui-types/src/Sources.js          |  1 +
 .../src/repos/sources/components/FileTree.js  | 20 ++++++++++++++++++-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/scm-ui-components/packages/ui-types/src/Sources.js b/scm-ui-components/packages/ui-types/src/Sources.js
index 3852466635..c8b3fafe0c 100644
--- a/scm-ui-components/packages/ui-types/src/Sources.js
+++ b/scm-ui-components/packages/ui-types/src/Sources.js
@@ -14,6 +14,7 @@ export type File = {
   path: string,
   directory: boolean,
   description?: string,
+  revision: string,
   length: number,
   lastModified?: string,
   subRepository?: SubRepository, // TODO
diff --git a/scm-ui/src/repos/sources/components/FileTree.js b/scm-ui/src/repos/sources/components/FileTree.js
index a2c0445ba8..1ac98faa5e 100644
--- a/scm-ui/src/repos/sources/components/FileTree.js
+++ b/scm-ui/src/repos/sources/components/FileTree.js
@@ -45,6 +45,22 @@ class FileTree extends React.Component<Props> {
       baseUrlWithRevision += "/" + tree.revision;
     }
 
+    const compareFiles = function(f1: File, f2: File): number {
+      if (f1.directory) {
+        if (f2.directory) {
+          return f1.name.localeCompare(f2.name);
+        } else {
+          return -1;
+        }
+      } else {
+        if (f2.directory) {
+          return 1;
+        } else {
+          return f1.name.localeCompare(f2.name);
+        }
+      }
+    };
+
     const files = [];
     if (path) {
       files.push({
@@ -53,7 +69,8 @@ class FileTree extends React.Component<Props> {
         directory: true
       });
     }
-    files.push(...tree._embedded.children);
+
+    files.push(...tree._embedded.children.sort(compareFiles));
 
     return (
       <table className="table table-hover table-sm is-fullwidth">
@@ -79,4 +96,5 @@ class FileTree extends React.Component<Props> {
     );
   }
 }
+
 export default injectSheet(styles)(translate("repos")(FileTree));