Readd tab remember function to improve UX.

assets/js/app.js

@@ -43,7 +43,7 @@ require('bootstrap');
 import "./sidebar"
 import "./datatables";
 import "./error_handler";
-//import "./tab_remember";
+import "./tab_remember";
 import "./register_events";
 import "./tristate_checkboxes";
 

assets/js/datatables.js

@@ -17,7 +17,7 @@ import 'datatables.net-responsive-bs5';
 import './lib/datatables';
 
 
-const DatatablesHelper = class {
+class DatatablesHelper {
     constructor() {
         this.registerLoadHandler(() => this.initDataTables());
     }

assets/js/error_handler.js

@@ -4,7 +4,7 @@ import * as bootbox from "bootbox";
  * If this class is imported the user is shown an error dialog if he calls an page via Turbo and an error is responded.
  * @type {ErrorHandlerHelper}
  */
-const ErrorHandlerHelper = class {
+class ErrorHandlerHelper {
     constructor() {
         console.log('Error Handler registered');
 

assets/js/register_events.js

@@ -9,7 +9,7 @@ import "bootstrap-fileinput";
 
 
 
-const RegisterEventHelper = class {
+class RegisterEventHelper {
     constructor() {
         this.registerTooltips();
         this.registerJumpToTopBtn();

assets/js/sidebar.js

@@ -3,7 +3,7 @@
 import "patternfly-bootstrap-treeview/src/css/bootstrap-treeview.css"
 import "patternfly-bootstrap-treeview";
 
-const SidebarHelper = class {
+class SidebarHelper {
     constructor() {
         this.BASE = $("body").data("base-url");
         //If path doesn't end with slash, add it.

assets/js/tab_remember.js

@@ -5,42 +5,46 @@
  * that tab on reload. That means that if the user changes something, he does not have to switch back to the tab
  * where he was before submit.
  */
-let TabRememberHelper = new class {
+class TabRememberHelper {
     constructor() {
-        document.addEventListener("turbo:load", () => {
+        document.addEventListener("turbo:load", this.onLoad);
-            //Determine which tab should be shown (use hash if specified, otherwise use localstorage)
+    }
-            var $activeTab = null;
-            if (location.hash) {
-                $activeTab = $('a[href=\'' + location.hash + '\']');
-            } else if (localStorage.getItem('activeTab')) {
-                $activeTab = $('a[href="' + localStorage.getItem('activeTab') + '"]');
-            }
 
-            if ($activeTab) {
-                //Findout if the tab has any parent tab we have to show before
-                var parents = $($activeTab).parents('.tab-pane');
-                parents.each(function (n) {
-                    $('a[href="#' + $(this).attr('id') + '"]').tab('show');
-                });
-                //Finally show the active tab itself
-                $activeTab.tab('show');
-            }
 
-            $('body').on('click', 'a[data-toggle=\'tab\']', function (e) {
+    onLoad(event) {
-                e.preventDefault()
+        //Determine which tab should be shown (use hash if specified, otherwise use localstorage)
-                var tab_name = this.getAttribute('href')
+        let $activeTab = null;
-                if (history.replaceState) {
+        if (location.hash) {
-                    history.replaceState(null, null, tab_name)
+            $activeTab = $('a[href=\'' + location.hash + '\']');
-                } else {
+        } else if (localStorage.getItem('activeTab')) {
-                    location.hash = tab_name
+            $activeTab = $('a[href="' + localStorage.getItem('activeTab') + '"]');
-                }
+        }
-                localStorage.setItem('activeTab', tab_name)
 
-                $(this).tab('show');
+        if ($activeTab) {
-                return false;
+            //Findout if the tab has any parent tab we have to show before
+            var parents = $($activeTab).parents('.tab-pane');
+            parents.each(function (n) {
+                $('a[href="#' + $(this).attr('id') + '"]').tab('show');
             });
+            //Finally show the active tab itself
+            $activeTab.tab('show');
+        }
+
+        $('body').on('click', 'a[data-bs-toggle=\'tab\']', function (e) {
+            e.preventDefault()
+            var tab_name = this.getAttribute('href')
+            if (history.replaceState) {
+                history.replaceState(null, null, tab_name)
+            } else {
+                location.hash = tab_name
+            }
+            localStorage.setItem('activeTab', tab_name)
+
+            $(this).tab('show');
+            return false;
         });
     }
+
 }
 
-//export default new TabRememberHelper();
+export default new TabRememberHelper();

assets/js/tristate_checkboxes.js

@@ -2,7 +2,7 @@
 
 import "./lib/jquery.tristate"
 
-const TristateHelper = class {
+class TristateHelper {
     constructor() {
         this.registerTriStateCheckboxes();
         this.registerSubmitHandler();