keycloak-uncached

general settings split up

8/5/2014 9:26:29 PM

Details

diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/js/app.js b/forms/common-themes/src/main/resources/theme/admin/base/resources/js/app.js
index 1bbfcf6..4f7b83a 100755
--- a/forms/common-themes/src/main/resources/theme/admin/base/resources/js/app.js
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/js/app.js
@@ -94,6 +94,42 @@ module.config([ '$routeProvider', function($routeProvider) {
             },
             controller : 'RealmDetailCtrl'
         })
+        .when('/realms/:realm/login-settings', {
+            templateUrl : 'partials/realm-login-settings.html',
+            resolve : {
+                realm : function(RealmLoader) {
+                    return RealmLoader();
+                },
+                serverInfo : function(ServerInfoLoader) {
+                    return ServerInfoLoader();
+                }
+            },
+            controller : 'RealmLoginSettingsCtrl'
+        })
+        .when('/realms/:realm/theme-settings', {
+            templateUrl : 'partials/realm-theme-settings.html',
+            resolve : {
+                realm : function(RealmLoader) {
+                    return RealmLoader();
+                },
+                serverInfo : function(ServerInfoLoader) {
+                    return ServerInfoLoader();
+                }
+            },
+            controller : 'RealmThemeCtrl'
+        })
+        .when('/realms/:realm/cache-settings', {
+            templateUrl : 'partials/realm-cache-settings.html',
+            resolve : {
+                realm : function(RealmLoader) {
+                    return RealmLoader();
+                },
+                serverInfo : function(ServerInfoLoader) {
+                    return ServerInfoLoader();
+                }
+            },
+            controller : 'RealmCacheCtrl'
+        })
         .when('/realms', {
             templateUrl : 'partials/realm-list.html',
             controller : 'RealmListCtrl'
diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/js/controllers/realm.js b/forms/common-themes/src/main/resources/theme/admin/base/resources/js/controllers/realm.js
index 80738f8..e89401d 100755
--- a/forms/common-themes/src/main/resources/theme/admin/base/resources/js/controllers/realm.js
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/js/controllers/realm.js
@@ -247,12 +247,12 @@ module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, ser
             }
         }
         /*
-        if (Current.realm == null || Current.realm.realm != realm.realm) {
-            console.log('should be unreachable');
-            console.log('Why? ' + Current.realms.length + ' ' + Current.realm);
-            return;
-        }
-        */
+         if (Current.realm == null || Current.realm.realm != realm.realm) {
+         console.log('should be unreachable');
+         console.log('Why? ' + Current.realms.length + ' ' + Current.realm);
+         return;
+         }
+         */
         $scope.realm = angular.copy(realm);
     }
 
@@ -332,6 +332,70 @@ module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, ser
     };
 });
 
+function genericRealmUpdate($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications, url) {
+    $scope.realm = angular.copy(realm);
+    $scope.serverInfo = serverInfo;
+    $scope.social = $scope.realm.social;
+    $scope.registrationAllowed = $scope.realm.registrationAllowed;
+
+    var oldCopy = angular.copy($scope.realm);
+
+
+
+    $scope.changed = false;
+
+    $scope.$watch('realm', function() {
+        if (!angular.equals($scope.realm, oldCopy)) {
+            $scope.changed = true;
+        }
+    }, true);
+
+    $scope.save = function() {
+        var realmCopy = angular.copy($scope.realm);
+        console.log('updating realm...');
+        $scope.changed = false;
+        console.log('oldCopy.realm - ' + oldCopy.realm);
+        Realm.update({ id : oldCopy.realm}, realmCopy, function () {
+            var data = Realm.query(function () {
+                Current.realms = data;
+                for (var i = 0; i < Current.realms.length; i++) {
+                    if (Current.realms[i].realm == realmCopy.realm) {
+                        Current.realm = Current.realms[i];
+                        oldCopy = angular.copy($scope.realm);
+                    }
+                }
+            });
+            $location.url(url);
+            Notifications.success("Your changes have been saved to the realm.");
+            $scope.social = $scope.realm.social;
+            $scope.registrationAllowed = $scope.realm.registrationAllowed;
+        });
+    };
+
+    $scope.reset = function() {
+        $scope.realm = angular.copy(oldCopy);
+        $scope.changed = false;
+    };
+
+    $scope.cancel = function() {
+        //$location.url("/realms");
+        window.history.back();
+    };
+
+}
+
+module.controller('RealmLoginSettingsCtrl', function($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications) {
+    genericRealmUpdate($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications, "/realms/" + realm.realm + "/login-settings")
+});
+
+module.controller('RealmThemeCtrl', function($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications) {
+    genericRealmUpdate($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications, "/realms/" + realm.realm + "/theme-settings")
+});
+
+module.controller('RealmCacheCtrl', function($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications) {
+    genericRealmUpdate($scope, Current, Realm, realm, serverInfo, $http, $location, Dialog, Notifications, "/realms/" + realm.realm + "/cache-settings")
+});
+
 module.controller('RealmRequiredCredentialsCtrl', function($scope, Realm, realm, $http, $location, Dialog, Notifications, PasswordPolicy) {
     console.log('RealmRequiredCredentialsCtrl');
 
diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-cache-settings.html b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-cache-settings.html
new file mode 100755
index 0000000..fec89ed
--- /dev/null
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-cache-settings.html
@@ -0,0 +1,38 @@
+<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
+<div id="content-area" class="col-sm-9" role="main">
+    <kc-navigation data-kc-current="general" data-kc-realm="realm.realm" data-kc-social="social"></kc-navigation>
+    <div id="content">
+        <ol class="breadcrumb" data-ng-hide="createRealm">
+            <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
+            <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
+            <li class="active">Cache</li>
+        </ol>
+        <div data-ng-show="access.viewRealm">
+            <h2><span>{{realm.realm}}</span> Cache Settings</h2>
+            <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
+                <fieldset class="border-top">
+                     <div class="form-group">
+                        <label class="col-sm-2 control-label" for="enabled">Realm Cache Enabled</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.realmCacheEnabled" name="realmCacheEnabled" id="realmCacheEnabled" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="enabled">User Cache Enabled</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.userCacheEnabled" name="userCacheEnabled" id="userCacheEnabled" onoffswitch />
+                        </div>
+                    </div>
+                </fieldset>
+                <div class="pull-right form-actions" data-ng-show="access.manageRealm">
+                    <button kc-reset data-ng-show="changed">Clear changes</button>
+                    <button kc-save  data-ng-show="changed">Save</button>
+                </div>
+            </form>
+        </div>
+        <div data-ng-hide="access.viewRealm">
+            <h2 ><span>{{realm.realm}}</span></h2>
+        </div>
+
+    </div>
+</div>
\ No newline at end of file
diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-detail.html b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-detail.html
index 8596f54..be95d88 100755
--- a/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-detail.html
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-detail.html
@@ -12,8 +12,7 @@
             <h2 data-ng-hide="createRealm"><span>{{realm.realm}}</span> General Settings</h2>
             <p class="subtitle" data-ng-show="createRealm"><span class="required">*</span> Required fields</p>
             <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
-                <fieldset>
-                    <legend class="aj-collapse open"><span class="text">Required Settings</span></legend>
+                <fieldset class="border-top">
                     <div class="form-group">
                         <label class="col-sm-2 control-label" for="name">Name <span class="required" data-ng-show="createRealm">*</span></label>
 
@@ -28,129 +27,6 @@
                         </div>
                     </div>
                 </fieldset>
-                <fieldset>
-                    <legend><span class="text">Login Options</span></legend>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="social">Social login</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.social" name="social" id="social" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group" data-ng-show="realm.social">
-                        <label class="col-sm-2 control-label" for="updateProfileOnInitialSocialLogin">Update profile on first social login</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.updateProfileOnInitialSocialLogin" name="updateProfileOnInitialSocialLogin" id="updateProfileOnInitialSocialLogin" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="registrationAllowed" class="col-sm-2 control-label">User registration</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.registrationAllowed" name="registrationAllowed" id="registrationAllowed" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="resetPasswordAllowed" class="col-sm-2 control-label">Forget password</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.resetPasswordAllowed" name="resetPasswordAllowed" id="resetPasswordAllowed" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="rememberMe">Remember Me</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.rememberMe" name="rememberMe" id="rememberMe" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="verifyEmail" class="col-sm-2 control-label">Verify email</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.verifyEmail" name="verifyEmail" id="verifyEmail" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="passwordCredentialGrantAllowed" class="col-sm-2 control-label">Direct Grant API</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.passwordCredentialGrantAllowed" name="passwordCredentialGrantAllowed" id="passwordCredentialGrantAllowed" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label for="sslRequired" class="col-sm-2 control-label">Require SSL</label>
-                        <div class="col-sm-4">
-                            <div class="select-kc">
-                                <select id="sslRequired" ng-model="realm.sslRequired">
-                                    <option value="all">all requests</option>
-                                    <option value="external">external requests</option>
-                                    <option value="none">none</option>
-                                </select>
-                            </div>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset>
-                    <legend><span class="text">Theme Settings</span></legend>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="loginTheme">Login Theme</label>
-                        <div class="col-sm-4">
-                            <div class="select-kc">
-                                <select id="loginTheme"
-                                        ng-model="realm.loginTheme"
-                                        ng-options="o as o for o in serverInfo.themes.login">
-                                    <option value="" disabled selected>Select one...</option>
-                                </select>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="accountTheme">Account Theme</label>
-                        <div class="col-sm-4">
-                            <div class="select-kc">
-                                <select id="accountTheme"
-                                        ng-model="realm.accountTheme"
-                                        ng-options="o as o for o in serverInfo.themes.account">
-                                    <option value="" disabled selected>Select one...</option>
-                                </select>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="adminTheme">Admin Console Theme</label>
-                        <div class="col-sm-4">
-                            <div class="select-kc">
-                                <select id="adminTheme"
-                                        ng-model="realm.adminTheme"
-                                        ng-options="o as o for o in serverInfo.themes.admin">
-                                    <option value="" disabled selected>Select one...</option>
-                                </select>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="emailTheme">Email Theme</label>
-                        <div class="col-sm-4">
-                            <div class="select-kc">
-                                <select id="emailTheme"
-                                        ng-model="realm.emailTheme"
-                                        ng-options="o as o for o in serverInfo.themes.email">
-                                    <option value="" disabled selected>Select one...</option>
-                                </select>
-                            </div>
-                        </div>
-                    </div>
-                </fieldset>
-                <fieldset>
-                    <legend><span class="text">Cache Settings</span></legend>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="enabled">Realm Cache Enabled</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.realmCacheEnabled" name="realmCacheEnabled" id="realmCacheEnabled" onoffswitch />
-                        </div>
-                    </div>
-                    <div class="form-group">
-                        <label class="col-sm-2 control-label" for="enabled">User Cache Enabled</label>
-                        <div class="col-sm-4">
-                            <input ng-model="realm.userCacheEnabled" name="userCacheEnabled" id="userCacheEnabled" onoffswitch />
-                        </div>
-                    </div>
-                </fieldset>
 
                 <div class="pull-right form-actions" data-ng-show="createRealm && access.manageRealm">
                     <button kc-cancel data-ng-click="cancel()">Cancel</button>
diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-login-settings.html b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-login-settings.html
new file mode 100755
index 0000000..ecc9344
--- /dev/null
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-login-settings.html
@@ -0,0 +1,80 @@
+<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
+<div id="content-area" class="col-sm-9" role="main">
+    <kc-navigation data-kc-current="general" data-kc-realm="realm.realm" data-kc-social="social"></kc-navigation>
+    <div id="content">
+        <ol class="breadcrumb" data-ng-hide="createRealm">
+            <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
+            <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
+            <li class="active">Login</li>
+        </ol>
+        <div data-ng-show="access.viewRealm">
+            <h2><span>{{realm.realm}}</span> Login Settings</h2>
+            <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
+                <fieldset class="border-top">
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="social">Social login</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.social" name="social" id="social" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group" data-ng-show="realm.social">
+                        <label class="col-sm-2 control-label" for="updateProfileOnInitialSocialLogin">Update profile on first social login</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.updateProfileOnInitialSocialLogin" name="updateProfileOnInitialSocialLogin" id="updateProfileOnInitialSocialLogin" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="registrationAllowed" class="col-sm-2 control-label">User registration</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.registrationAllowed" name="registrationAllowed" id="registrationAllowed" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="resetPasswordAllowed" class="col-sm-2 control-label">Forget password</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.resetPasswordAllowed" name="resetPasswordAllowed" id="resetPasswordAllowed" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="rememberMe">Remember Me</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.rememberMe" name="rememberMe" id="rememberMe" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="verifyEmail" class="col-sm-2 control-label">Verify email</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.verifyEmail" name="verifyEmail" id="verifyEmail" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="passwordCredentialGrantAllowed" class="col-sm-2 control-label">Direct Grant API</label>
+                        <div class="col-sm-4">
+                            <input ng-model="realm.passwordCredentialGrantAllowed" name="passwordCredentialGrantAllowed" id="passwordCredentialGrantAllowed" onoffswitch />
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="sslRequired" class="col-sm-2 control-label">Require SSL</label>
+                        <div class="col-sm-4">
+                            <div class="select-kc">
+                                <select id="sslRequired" ng-model="realm.sslRequired">
+                                    <option value="all">all requests</option>
+                                    <option value="external">external requests</option>
+                                    <option value="none">none</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                </fieldset>
+                <div class="pull-right form-actions" data-ng-show="access.manageRealm">
+                    <button kc-reset data-ng-show="changed">Clear changes</button>
+                    <button kc-save  data-ng-show="changed">Save</button>
+                </div>
+            </form>
+        </div>
+        <div data-ng-hide="access.viewRealm">
+            <h2 ><span>{{realm.realm}}</span></h2>
+        </div>
+
+    </div>
+</div>
\ No newline at end of file
diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-theme-settings.html b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-theme-settings.html
new file mode 100755
index 0000000..2710039
--- /dev/null
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/partials/realm-theme-settings.html
@@ -0,0 +1,74 @@
+<div class="bs-sidebar col-sm-3 " data-ng-include data-src="'partials/realm-menu.html'"></div>
+<div id="content-area" class="col-sm-9" role="main">
+    <kc-navigation data-kc-current="general" data-kc-realm="realm.realm" data-kc-social="social"></kc-navigation>
+    <div id="content">
+        <ol class="breadcrumb" data-ng-hide="createRealm">
+            <li><a href="#/realms/{{realm.realm}}">{{realm.realm}}</a></li>
+            <li><a href="#/realms/{{realm.realm}}">Settings</a></li>
+            <li class="active">Theme</li>
+        </ol>
+        <div data-ng-show="access.viewRealm">
+            <h2><span>{{realm.realm}}</span> Theme Settings</h2>
+            <form class="form-horizontal" name="realmForm" novalidate kc-read-only="!access.manageRealm">
+                <fieldset class="border-top">
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="loginTheme">Login Theme</label>
+                        <div class="col-sm-4">
+                            <div class="select-kc">
+                                <select id="loginTheme"
+                                        ng-model="realm.loginTheme"
+                                        ng-options="o as o for o in serverInfo.themes.login">
+                                    <option value="" disabled selected>Select one...</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="accountTheme">Account Theme</label>
+                        <div class="col-sm-4">
+                            <div class="select-kc">
+                                <select id="accountTheme"
+                                        ng-model="realm.accountTheme"
+                                        ng-options="o as o for o in serverInfo.themes.account">
+                                    <option value="" disabled selected>Select one...</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="adminTheme">Admin Console Theme</label>
+                        <div class="col-sm-4">
+                            <div class="select-kc">
+                                <select id="adminTheme"
+                                        ng-model="realm.adminTheme"
+                                        ng-options="o as o for o in serverInfo.themes.admin">
+                                    <option value="" disabled selected>Select one...</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label class="col-sm-2 control-label" for="emailTheme">Email Theme</label>
+                        <div class="col-sm-4">
+                            <div class="select-kc">
+                                <select id="emailTheme"
+                                        ng-model="realm.emailTheme"
+                                        ng-options="o as o for o in serverInfo.themes.email">
+                                    <option value="" disabled selected>Select one...</option>
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+                </fieldset>
+                <div class="pull-right form-actions" data-ng-show="access.manageRealm">
+                    <button kc-reset data-ng-show="changed">Clear changes</button>
+                    <button kc-save  data-ng-show="changed">Save</button>
+                </div>
+            </form>
+        </div>
+        <div data-ng-hide="access.viewRealm">
+            <h2 ><span>{{realm.realm}}</span></h2>
+        </div>
+
+    </div>
+</div>
\ No newline at end of file
diff --git a/forms/common-themes/src/main/resources/theme/admin/base/resources/templates/kc-navigation.html b/forms/common-themes/src/main/resources/theme/admin/base/resources/templates/kc-navigation.html
index d684fc5..9d2e019 100755
--- a/forms/common-themes/src/main/resources/theme/admin/base/resources/templates/kc-navigation.html
+++ b/forms/common-themes/src/main/resources/theme/admin/base/resources/templates/kc-navigation.html
@@ -1,9 +1,12 @@
 <ul class="nav nav-tabs nav-tabs-pf">
     <li ng-class="{active: !path[2]}"><a href="#/realms/{{realm.realm}}">General</a></li>
+    <li ng-class="{active: path[2] == 'login-settings'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/login-settings">Login</a></li>
     <li ng-class="{active: path[2] == 'social-settings'}" data-ng-show="realm.social && access.viewRealm"><a href="#/realms/{{realm.realm}}/social-settings">Social</a></li>
     <li ng-class="{active: path[2] == 'roles'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/roles">Roles</a></li>
     <li ng-class="{active: path[2] == 'default-roles'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/default-roles">Default Roles</a></li>
     <li ng-class="{active: path[2] == 'required-credentials'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/required-credentials">Credentials</a></li>
     <li ng-class="{active: path[2] == 'keys-settings'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/keys-settings">Keys</a></li>
     <li ng-class="{active: path[2] == 'smtp-settings'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/smtp-settings">Email</a></li>
+    <li ng-class="{active: path[2] == 'theme-settings'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/theme-settings">Themes</a></li>
+    <li ng-class="{active: path[2] == 'cache-settings'}" data-ng-show="access.viewRealm"><a href="#/realms/{{realm.realm}}/cache-settings">Cache Config</a></li>
 </ul>
\ No newline at end of file