Form design for proxy hosts, audit log base

src/frontend/js/app/ui/header/main.ejs

@@ -14,8 +14,11 @@
                     </span>
                 </a>
                 <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
-                    <a class="dropdown-item profile" href="/profile">
-                        <i class="dropdown-icon fe fe-user"></i> Profile
+                    <a class="dropdown-item edit-details" href="#">
+                        <i class="dropdown-icon fe fe-user"></i> Edit Details
+                    </a>
+                    <a class="dropdown-item change-password" href="#">
+                        <i class="dropdown-icon fe fe-lock"></i> Change Password
                     </a>
                     <div class="dropdown-divider"></div>
                     <a class="dropdown-item logout" href="/logout">

src/frontend/js/app/ui/header/main.js

@@ -13,10 +13,22 @@ module.exports = Mn.View.extend({
     template:  template,
 
     ui: {
-        link: 'a'
+        link:     'a',
+        details:  'a.edit-details',
+        password: 'a.change-password'
     },
 
     events: {
+        'click @ui.details': function (e) {
+            e.preventDefault();
+            Controller.showUserForm(Cache.User);
+        },
+
+        'click @ui.password': function (e) {
+            e.preventDefault();
+            Controller.showUserPasswordForm(Cache.User);
+        },
+
         'click @ui.link': function (e) {
             e.preventDefault();
             let href = $(e.currentTarget).attr('href');
@@ -25,9 +37,6 @@ module.exports = Mn.View.extend({
                 case '/':
                     Controller.showDashboard();
                     break;
-                case '/profile':
-                    Controller.showProfile();
-                    break;
                 case '/logout':
                     Controller.logout();
                     break;

src/frontend/js/app/ui/menu/main.ejs

@@ -30,10 +30,13 @@
                     <a href="/nginx/access" class="nav-link"><i class="fe fe-lock"></i> Access Lists</a>
                 </li>
                 <% } %>
-                <% if (showUsers()) { %>
+                <% if (isAdmin()) { %>
                 <li class="nav-item">
                     <a href="/users" class="nav-link"><i class="fe fe-users"></i> Users</a>
                 </li>
+                <li class="nav-item">
+                    <a href="/audit-log" class="nav-link"><i class="fe fe-book-open"></i> Audit Log</a>
+                </li>
                 <% } %>
             </ul>
         </div>

src/frontend/js/app/ui/menu/main.js

@@ -26,7 +26,7 @@ module.exports = Mn.View.extend({
     },
 
     templateContext: {
-        showUsers: function () {
+        isAdmin: function () {
             return Cache.User.isAdmin();
         },