1 files changed, 21 insertions, 4 deletions

diff --git a/web/react/components/navbar_dropdown.jsx b/web/react/components/navbar_dropdown.jsx
index e0410800f..1cb13bbe5 100644
--- a/web/react/components/navbar_dropdown.jsx
+++ b/web/react/components/navbar_dropdown.jsx
@@ -11,7 +11,24 @@ var AboutBuildModal = require('./about_build_modal.jsx');
 var Constants = require('../utils/constants.jsx');
 
 function getStateFromStores() {
-    return {teams: UserStore.getTeams()};
+    let teams = [];
+    let teamsObject = UserStore.getTeams();
+    for (let teamId in teamsObject) {
+        if (teamsObject.hasOwnProperty(teamId)) {
+            teams.push(teamsObject[teamId]);
+        }
+    }
+    teams.sort(function sortByDisplayName(teamA, teamB) {
+        let teamADisplayName = teamA.display_name.toLowerCase();
+        let teamBDisplayName = teamB.display_name.toLowerCase();
+        if (teamADisplayName < teamBDisplayName) {
+            return -1;
+        } else if (teamADisplayName > teamBDisplayName) {
+            return 1;
+        }
+        return 0;
+    });
+    return {teams};
 }
 
 export default class NavbarDropdown extends React.Component {
@@ -154,9 +171,9 @@ export default class NavbarDropdown extends React.Component {
                 </li>
             );
 
-            this.state.teams.forEach((teamName) => {
-                if (teamName !== this.props.teamName) {
-                    teams.push(<li key={teamName}><a href={Utils.getWindowLocationOrigin() + '/' + teamName}>{'Switch to ' + teamName}</a></li>);
+            this.state.teams.forEach((team) => {
+                if (team.name !== this.props.teamName) {
+                    teams.push(<li key={team.name}><a href={Utils.getWindowLocationOrigin() + '/' + team.name}>{'Switch to ' + team.display_name}</a></li>);
                 }
             });
         }