Sort Settings by translated names (librenms#11280)

If browser language is different from the language set in LibreNMS, it might sort slightly incorrectly.
TheMysteriousX · Mar 12, 2020 · 82eddfc · 82eddfc
1 parent 36e2dc4
commit 82eddfc
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 10 deletions.
diff --git a/app/Http/Controllers/SettingsController.php b/app/Http/Controllers/SettingsController.php
@@ -17,17 +17,16 @@ class SettingsController extends Controller
      * @param DynamicConfig $dynamicConfig
      * @param string $tab
      * @param string $section
-     * @return \Illuminate\Http\Response
+     * @return \Illuminate\Http\Response|\Illuminate\View\View
      */
     public function index(DynamicConfig $dynamicConfig, $tab = 'global', $section = '')
     {
         $data = [
             'active_tab' => $tab,
             'active_section' => $section,
-            'groups' => $dynamicConfig->getGroups()->reduce(function ($groups, $group) {
-                /** @var Collection $groups */
-                return $groups->put($group, []);
-            }, new Collection())->forget('global'),
+            'groups' => $dynamicConfig->getGroups()->reject(function ($group) {
+                return $group == 'global';
+            }),
         ];
 
         return view('settings.index', $data);

diff --git a/html/js/app.js b/html/js/app.js
diff --git a/html/mix-manifest.json b/html/mix-manifest.json
@@ -1,5 +1,5 @@
 {
-    "/js/app.js": "/js/app.js?id=d074dd82ac08dba78c44",
+    "/js/app.js": "/js/app.js?id=1416a11a53d67bf51725",
     "/css/app.css": "/css/app.css?id=2a88c6515df894dc6f36",
     "/js/manifest.js": "/js/manifest.js?id=3c768977c2574a34506e",
     "/js/vendor.js": "/js/vendor.js?id=58c8fc0774b5843ec004",

diff --git a/package.json b/package.json
@@ -5,6 +5,8 @@
         "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
         "watch": "npm run development -- --watch",
         "watch-poll": "npm run watch -- --watch-poll",
+        "watch-production": "npm run production -- --watch --progress",
+        "watch-prod": "npm run watch-production",
         "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
         "prod": "npm run production",
         "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"

diff --git a/resources/js/components/LibrenmsSettings.vue b/resources/js/components/LibrenmsSettings.vue
@@ -118,6 +118,9 @@
 
                 return this.checkLogic(setting.when);
             },
+            translatedCompare(prefix, a, b) {
+                return this.$t(prefix + a).localeCompare(this.$t(prefix + b))
+            },
             checkLogic(logic) {
                 switch (logic.operator) {
                     case 'equals':
@@ -136,7 +139,12 @@
         computed: {
             groups() {
                 if (_.isEmpty(this.settings)) {
-                    return this.tabs;
+                    let sorted_tabs = {};
+                    this.tabs.sort((a, b) => this.translatedCompare('settings.groups.', a, b)).forEach(function (tab) {
+                        sorted_tabs[tab] = [];
+                    });
+
+                    return sorted_tabs;
                 }
 
                 // group data
@@ -163,9 +171,9 @@
 
                 // sort groups
                 let sorted = {};
-                Object.keys(groups).sort().forEach(group_key => {
+                Object.keys(groups).sort((a, b) => this.translatedCompare('settings.groups.', a, b)).forEach(group_key => {
                     sorted[group_key] = {};
-                    Object.keys(groups[group_key]).sort().forEach(section_key => {
+                    Object.keys(groups[group_key]).sort((a, b) => this.translatedCompare('settings.sections.', a , b)).forEach(section_key => {
                         sorted[group_key][section_key] = _.sortBy(groups[group_key][section_key], 'order').map(a => a.name);
                     });
                 });