sorted branches and show defaultbranch label

scm-ui/src/repos/branches/components/BranchRow.js

@@ -9,8 +9,12 @@ type Props = {
 };
 
 export default class BranchRow extends React.Component<Props> {
-  renderLink(to: string, label: string) {
-    return <Link to={to}>{label} <span className="tag is-dark">Default</span></Link>;
+  renderLink(to: string, label: string, defaultBranch: boolean) {
+    let showLabel = null;
+    if(defaultBranch) {
+      showLabel = <span className="tag is-dark">Default</span>;
+    }
+    return <Link to={to}>{label} {showLabel}</Link>;
   }
 
   render() {
@@ -18,7 +22,7 @@ export default class BranchRow extends React.Component<Props> {
     const to = `${baseUrl}/${encodeURIComponent(branch.name)}/info`;
     return (
       <tr>
-        <td>{this.renderLink(to, branch.name)}</td>
+        <td>{this.renderLink(to, branch.name, branch.defaultBranch)}</td>
       </tr>
     );
   }

scm-ui/src/repos/branches/containers/BranchesOverview.js

@@ -35,16 +35,47 @@ type Props = {
   match: any,
   t: string => string
 };
+
+// master, default should always be the first one,
+// followed by develop the rest should be ordered by its name
+export function orderBranches(branches: Branch[]) {
+  branches.sort((a, b) => {
+    if (a.defaultBranch && !b.defaultBranch ) {
+      return -20;
+    } else if (!a.defaultBranch && b.defaultBranch ) {
+      return 20;
+    } else if (a.name === "master" && b.name !== "master") {
+      return -10;
+    } else if (a.name !== "master" && b.name === "master") {
+      return 10;
+    } else if (a.name === "default" && b.name !== "default") {
+      return -10;
+    } else if (a.name !== "default" && b.name === "default") {
+      return 10;
+    } else if (a.name === "develop" && b.name !== "develop") {
+      return -5;
+    } else if (a.name !== "develop" && b.name === "develop") {
+      return 5;
+    } else if (a.name < b.name) {
+      return -1;
+    } else if (a.name > b.name) {
+      return 1;
+    }
+    return 0;
+  });
+}
+
 class BranchesOverview extends React.Component<Props> {
   componentDidMount() {
     const { fetchBranches, repository } = this.props;
-
     fetchBranches(repository);
   }
 
   render() {
     const { baseUrl, loading, error, branches, t } = this.props;
 
+    orderBranches(branches);
+
     if (error) {
       return <ErrorNotification error={error} />;
     }
@@ -64,9 +95,13 @@ class BranchesOverview extends React.Component<Props> {
 
   renderCreateButton() {
     const { showCreateButton, t } = this.props;
-    if (showCreateButton || true ) { // TODO
+    if (showCreateButton || true) {
+      // TODO
       return (
-        <CreateButton label={t("branches.overview.createButton")} link="./create" />
+        <CreateButton
+          label={t("branches.overview.createButton")}
+          link="./create"
+        />
       );
     }
     return null;

scm-ui/src/repos/modules/branches.js

@@ -16,9 +16,7 @@ export const FETCH_BRANCHES_FAILURE = `${FETCH_BRANCHES}_${FAILURE_SUFFIX}`;
 
 // Fetching branches
 
-export function fetchBranch(repositroy: Repository, branchName: string) {
-
-}
+export function fetchBranch(repositroy: Repository, branchName: string) {}
 
 export function fetchBranches(repository: Repository) {
   if (!repository._links.branches) {