From 4f823093f36fa05625d0b7b15609e949ec8d77ef Mon Sep 17 00:00:00 2001
From: patrickdemooij9 <patrickdemooij98@hotmail.com>
Date: Sat, 6 Mar 2021 23:35:41 +0100
Subject: [PATCH] 9940: Make sure that ordering is correct (#9944)

* 9940: Make sure that ordering is correct

* 9940: Removed unnecessary ordering

* replace i with umb-icon directive

Co-authored-by: Nathan Woulfe <nathan@nathanw.com.au>
---
 .../src/views/dictionary/list.html               | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/dictionary/list.html b/src/Umbraco.Web.UI.Client/src/views/dictionary/list.html
index de7beae0cc..84c138c180 100644
--- a/src/Umbraco.Web.UI.Client/src/views/dictionary/list.html
+++ b/src/Umbraco.Web.UI.Client/src/views/dictionary/list.html
@@ -32,19 +32,21 @@
                     </tr>
                 </thead>
                 <tbody>
-                    <tr ng-repeat="item in vm.items | orderBy:'displayName' track by item.id" style="cursor: pointer;">
+                    <tr ng-repeat="item in vm.items track by item.id" style="cursor: pointer;">
                         <th>
                             <button type="button" ng-style="item.style" class="btn-reset bold" ng-click="vm.clickItem(item.id)">{{item.name}}</button>
                         </th>
-                        <td ng-repeat="column in item.translations">
+                        <td ng-repeat="column in item.translations | orderBy:'displayName'">
                             <button type="button" class="btn-reset" ng-click="vm.clickItem(item.id)">
-                                <i ng-if="column.hasTranslation" class="icon-check color-green" aria-hidden="true"></i>
-                                <span ng-if="column.hasTranslation" class="sr-only"><localize key="visuallyHiddenTexts_hasTranslation"></localize></span>
-                                <i ng-if="!column.hasTranslation" class="icon-alert color-red" aria-hidden="true"></i>
-                                <span ng-if="!column.hasTranslation" class="sr-only"><localize key="visuallyHiddenTexts_noTranslation"></localize></span>
+                                <umb-icon icon="{{ column.hasTranslation ? 'icon-check' : 'icon-alert' }}" 
+                                    class="{{ column.hasTranslation ? 'color-green' : 'color-red' }}"></umb-icon>
+                                <span class="sr-only">
+                                    <localize ng-if="column.hasTranslation" key="visuallyHiddenTexts_hasTranslation"></localize>
+                                    <localize ng-if="!column.hasTranslation" key="visuallyHiddenTexts_noTranslation"></localize>
+                                </span>
                             </button>
                         </td>
-                    </tr>
+                    </tr> 
                 </tbody>
             </table>