Use consistent Display Name sorting code throughout the webapp #5159 (#5213)

* Use consistent Display Name sorting code throughout the webapp #5159

* fixed broken sorting of teams and channels

webapp/components/admin_console/admin_sidebar.jsx

@@ -114,19 +114,6 @@ export default class AdminSidebar extends React.Component {
         document.title = Utils.localizeMessage('sidebar_right_menu.console', 'System Console') + ' - ' + currentSiteName;
     }
 
-    sortTeams(a, b) {
-        const teamA = a.display_name.toLowerCase();
-        const teamB = b.display_name.toLowerCase();
-
-        if (teamA < teamB) {
-            return -1;
-        }
-        if (teamA > teamB) {
-            return 1;
-        }
-        return 0;
-    }
-
     renderAddTeamButton() {
         const addTeamTooltip = (
             <Tooltip id='add-team-tooltip'>
@@ -159,7 +146,7 @@ export default class AdminSidebar extends React.Component {
 
     renderTeams() {
         const teams = [];
-        const teamsArray = [];
+        let teamsArray = [];
 
         Reflect.ownKeys(this.state.selectedTeams).forEach((key) => {
             if (this.state.teams[key]) {
@@ -167,7 +154,7 @@ export default class AdminSidebar extends React.Component {
             }
         });
 
-        teamsArray.sort(this.sortTeams);
+        teamsArray = teamsArray.sort(Utils.sortTeamsByDisplayName);
 
         for (let i = 0; i < teamsArray.length; i++) {
             const team = teamsArray[i];