Update users navigation section

- Changed the section name to be access-control
- Moved LDAP Settings and Certificate Management to access-control navigation
- Changed Manage User Account subsection name to Local User Management

Resolves: openbmc/phosphor-webui#619

Signed-off-by: Mira Murali <miramurali23@gmail.com>
Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I0d94c80c295b997d94c04330fd87f4fc4d229bf8

26 files changed, 141 insertions, 161 deletions

diff --git a/app/configuration/controllers/certificate-controller.html b/app/access-control/controllers/certificate-controller.html
index 4226262..4226262 100644
--- a/app/configuration/controllers/certificate-controller.html
+++ b/app/access-control/controllers/certificate-controller.html
diff --git a/app/configuration/controllers/certificate-controller.js b/app/access-control/controllers/certificate-controller.js
index 06b2fff..2e6a92c 100644
--- a/app/configuration/controllers/certificate-controller.js
+++ b/app/access-control/controllers/certificate-controller.js
@@ -1,7 +1,7 @@
 /**
  * Controller for Certificate Management
  *
- * @module app/configuration
+ * @module app/access-control
  * @exports certificateController
  * @name certificateController
  */
@@ -9,9 +9,9 @@
 window.angular && (function(angular) {
   'use strict';
 
-  angular.module('app.configuration').controller('certificateController', [
-    '$scope', 'APIUtils', '$q', 'Constants', 'toastService', '$timeout',
-    function($scope, APIUtils, $q, Constants, toastService, $timeout) {
+  angular.module('app.accessControl').controller('certificateController', [
+    '$scope', 'APIUtils', '$q', 'Constants', 'toastService',
+    function($scope, APIUtils, $q, Constants, toastService) {
       $scope.loading = false;
       $scope.certificates = [];
       $scope.availableCertificateTypes = [];
diff --git a/app/configuration/controllers/ldap-controller.html b/app/access-control/controllers/ldap-controller.html
index daace8e..294dbb3 100644
--- a/app/configuration/controllers/ldap-controller.html
+++ b/app/access-control/controllers/ldap-controller.html
@@ -1,7 +1,7 @@
 <loader loading="loading"></loader>
 <div class="ldap" id="configuration-ldap">
   <div class="row column">
-    <h1>LDAP role group settings</h1>
+    <h1>LDAP</h1>
   </div>
   <div class="row column">
     <p>Configure LDAP settings and manage role groups.</p>
@@ -46,7 +46,7 @@
               <span>SSL certificates must be uploaded to secure LDAP using SSL.</span>
             </div>
             <div class="ldap__certificate-info">
-              <a href="#/configuration/certificate">Go to SSL certificates</a>
+              <a href="#/access-control/ssl-certificates">Go to SSL certificates</a>
             </div>
           </div>
           <div class="large-9 columns ldap__server-info">
diff --git a/app/configuration/controllers/ldap-controller.js b/app/access-control/controllers/ldap-controller.js
index 129e3db..cfdab50 100644
--- a/app/configuration/controllers/ldap-controller.js
+++ b/app/access-control/controllers/ldap-controller.js
@@ -1,7 +1,7 @@
 /**
  * Controller for LDAP
  *
- * @module app/configuration
+ * @module app/access-control
  * @exports ldapController
  * @name ldapController
  */
@@ -9,7 +9,7 @@
 window.angular && (function(angular) {
   'use strict';
 
-  angular.module('app.configuration').controller('ldapController', [
+  angular.module('app.accessControl').controller('ldapController', [
     '$scope', 'APIUtils', '$q', 'toastService',
     function($scope, APIUtils, $q, toastService) {
       $scope.loading = false;
diff --git a/app/users/controllers/user-accounts-modal-remove.html b/app/access-control/controllers/user-accounts-modal-remove.html
index 4a3efce..4a3efce 100644
--- a/app/users/controllers/user-accounts-modal-remove.html
+++ b/app/access-control/controllers/user-accounts-modal-remove.html
diff --git a/app/users/controllers/user-accounts-modal-settings.html b/app/access-control/controllers/user-accounts-modal-settings.html
index d48809f..d48809f 100644
--- a/app/users/controllers/user-accounts-modal-settings.html
+++ b/app/access-control/controllers/user-accounts-modal-settings.html
diff --git a/app/users/controllers/user-accounts-modal-user.html b/app/access-control/controllers/user-accounts-modal-user.html
index 4e646b1..4e646b1 100644
--- a/app/users/controllers/user-accounts-modal-user.html
+++ b/app/access-control/controllers/user-accounts-modal-user.html
diff --git a/app/users/controllers/user-accounts-controller.html b/app/access-control/controllers/user-controller.html
index 31ba62d..31ba62d 100644
--- a/app/users/controllers/user-accounts-controller.html
+++ b/app/access-control/controllers/user-controller.html
diff --git a/app/users/controllers/user-accounts-controller.js b/app/access-control/controllers/user-controller.js
index 2e7605c..8ee8f88 100644
--- a/app/users/controllers/user-accounts-controller.js
+++ b/app/access-control/controllers/user-controller.js
@@ -1,15 +1,15 @@
 /**
  * Controller for user Accounts
  *
- * @module app/users
- * @exports userAccountsController
- * @name userAccountsController
+ * @module app/access-control
+ * @exports userController
+ * @name userController
  */
 
 window.angular && (function(angular) {
   'use strict';
 
-  angular.module('app.users').controller('userAccountsController', [
+  angular.module('app.accessControl').controller('userController', [
     '$scope', 'APIUtils', 'toastService', '$uibModal', '$q',
     function($scope, APIUtils, toastService, $uibModal, $q) {
       $scope.loading;
diff --git a/app/users/directives/role-table.html b/app/access-control/directives/role-table.html
index 95b4c31..95b4c31 100644
--- a/app/users/directives/role-table.html
+++ b/app/access-control/directives/role-table.html
diff --git a/app/users/directives/role-table.js b/app/access-control/directives/role-table.js
index c23fed8..0a3169f 100644
--- a/app/users/directives/role-table.js
+++ b/app/access-control/directives/role-table.js
@@ -5,7 +5,7 @@ window.angular && (function(angular) {
    * Role table
    * Table of privilege role descriptions
    */
-  angular.module('app.users').directive('roleTable', [
+  angular.module('app.accessControl').directive('roleTable', [
     '$sce',
     function($sce) {
       return {
diff --git a/app/access-control/directives/username-validator.js b/app/access-control/directives/username-validator.js
new file mode 100644
index 0000000..395e635
--- /dev/null
+++ b/app/access-control/directives/username-validator.js
@@ -0,0 +1,39 @@
+window.angular && (function(angular) {
+  'use strict';
+
+  /**
+   * Username validator
+   *
+   * Checks if entered username is a duplicate
+   * Provide existingUsernames scope that should be an array of
+   * existing usernames
+   *
+   * <input username-validator  existing-usernames="[]"/>
+   *
+   */
+  angular.module('app.accessControl')
+      .directive('usernameValidator', function() {
+        return {
+          restrict: 'A', require: 'ngModel', scope: {existingUsernames: '='},
+              link: function(scope, element, attrs, controller) {
+                if (scope.existingUsernames === undefined) {
+                  return;
+                }
+                controller.$validators.duplicateUsername =
+                    (modelValue, viewValue) => {
+                      const enteredUsername = modelValue || viewValue;
+                      const matchedExisting = scope.existingUsernames.find(
+                          (username) => username === enteredUsername);
+                      if (matchedExisting) {
+                        return false;
+                      } else {
+                        return true;
+                      }
+                    };
+                element.on('blur', () => {
+                  controller.$validate();
+                });
+              }
+        }
+      });
+})(window.angular);
diff --git a/app/access-control/index.js b/app/access-control/index.js
new file mode 100644
index 0000000..45668ed
--- /dev/null
+++ b/app/access-control/index.js
@@ -0,0 +1,41 @@
+/**
+ * A module for the access control
+ *
+ * @module app/access-control/index
+ * @exports app/access-control/index
+ */
+
+window.angular && (function(angular) {
+  'use strict';
+
+  angular
+      .module('app.accessControl', ['ngRoute', 'app.common.services'])
+      // Route access-control
+      .config([
+        '$routeProvider',
+        function($routeProvider) {
+          $routeProvider
+              .when('/access-control', {
+                'template': require('./controllers/ldap-controller.html'),
+                'controller': 'ldapController',
+                authenticated: true
+              })
+              .when('/access-control/ldap', {
+                'template': require('./controllers/ldap-controller.html'),
+                'controller': 'ldapController',
+                authenticated: true
+              })
+              .when('/access-control/local-users', {
+                'template': require('./controllers/user-controller.html'),
+                'controller': 'userController',
+                authenticated: true
+              })
+              .when('/access-control/ssl-certificates', {
+                'template':
+                    require('./controllers/certificate-controller.html'),
+                'controller': 'certificateController',
+                authenticated: true
+              });
+        }
+      ]);
+})(window.angular);
diff --git a/app/configuration/styles/certificate.scss b/app/access-control/styles/certificate.scss
index a7c57f2..a7c57f2 100644
--- a/app/configuration/styles/certificate.scss
+++ b/app/access-control/styles/certificate.scss
diff --git a/app/access-control/styles/index.scss b/app/access-control/styles/index.scss
new file mode 100644
index 0000000..dff0b5d
--- /dev/null
+++ b/app/access-control/styles/index.scss
@@ -0,0 +1,3 @@
+@import "./user-accounts.scss";
+@import "./certificate.scss";
+@import "./ldap.scss";
diff --git a/app/configuration/styles/ldap.scss b/app/access-control/styles/ldap.scss
index a18ac70..a18ac70 100644
--- a/app/configuration/styles/ldap.scss
+++ b/app/access-control/styles/ldap.scss
diff --git a/app/users/styles/user-accounts.scss b/app/access-control/styles/user-accounts.scss
index fa0c5d7..fa0c5d7 100644
--- a/app/users/styles/user-accounts.scss
+++ b/app/access-control/styles/user-accounts.scss
diff --git a/app/assets/icons/icon-key.svg b/app/assets/icons/icon-key.svg
new file mode 100644
index 0000000..44a811c
--- /dev/null
+++ b/app/assets/icons/icon-key.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40">
+    <path id="a" d="M19.9 7.056a2.144 2.144 0 0 0 1.515 3.658 2.141 2.141 0 0 0 1.514-3.658 2.143 2.143 0 0 0-3.028 0zM20.345 0a9.633 9.633 0 0 0-7.74 3.898 9.646 9.646 0 0 0-1.481 8.543L0 23.571V30h6.424l11.124-11.13a9.642 9.642 0 0 0 8.216-1.251 9.655 9.655 0 0 0 4.196-7.179 9.426 9.426 0 0 0-1.746-6.393A9.706 9.706 0 0 0 20.344 0zm0 17.143c-.737 0-1.47-.11-2.176-.324l-1.227-.373-.908.908-3.406 3.408-1.476-1.476L9.637 20.8l1.476 1.477-1.698 1.7L7.939 22.5l-1.515 1.515 1.477 1.477-2.364 2.365H2.141V24.46l10.496-10.502.907-.908-.307-1.016a7.643 7.643 0 0 1 3.642-9.046 7.509 7.509 0 0 1 7.253.184 7.519 7.519 0 0 1 3.716 6.235 7.199 7.199 0 0 1-1.17 4.282 7.565 7.565 0 0 1-6.334 3.455z"/>
+</svg>
\ No newline at end of file
diff --git a/app/common/directives/app-navigation.html b/app/common/directives/app-navigation.html
index 02b7194..6205a18 100644
--- a/app/common/directives/app-navigation.html
+++ b/app/common/directives/app-navigation.html
@@ -7,30 +7,22 @@
       </a>
     </li>
     <li>
-      <button class="btn-health"
-      ng-class="{opened: firstLevel == 'server-health'}"
-      ng-click="change('server-health')">
+      <button class="btn-health" ng-class="{opened: firstLevel == 'server-health'}" ng-click="change('server-health')">
         <icon class="nav-icon" file="icon-health.svg"></icon>
         Server health
       </button>
-      <ul class="nav__second-level btn-health"
-        ng-style="navStyle"
-        ng-class="{opened: (showSubMenu && firstLevel == 'server-health')}">
+      <ul class="nav__second-level btn-health" ng-style="navStyle" ng-class="{opened: (showSubMenu && firstLevel == 'server-health')}">
         <li ng-class="{'active': (path == '/server-health/event-log')}">
-          <a href="#/server-health/event-log" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">Event log</a>
+          <a href="#/server-health/event-log" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">Event log</a>
         </li>
         <li ng-class="{'active': (path == '/server-health/inventory-overview' || path == '/server-health/inventory')}">
-          <a href="#/server-health/inventory-overview" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">Hardware status</a>
+          <a href="#/server-health/inventory-overview" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">Hardware status</a>
         </li>
         <li ng-class="{'active': (path == '/server-health/sensors-overview' || path == '/server-health/sensors')}">
-          <a href="#/server-health/sensors-overview" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">Sensors</a>
+          <a href="#/server-health/sensors-overview" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">Sensors</a>
         </li>
         <li ng-class="{'active': (path == '/server-health/sys-log')}" ng-show="!dataService.configJson.redfishEventLogDisabled">
-          <a href="#/server-health/sys-log" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">System logs</a>
+          <a href="#/server-health/sys-log" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-health') ? 0 : -1}}">System logs</a>
         </li>
       </ul>
     </li>
@@ -39,32 +31,24 @@
         <icon class="nav-icon  nav-icon__control" file="icon-control.svg"></icon>
         Server control
       </button>
-      <ul class="nav__second-level btn-control"
-        ng-style="navStyle"
-        ng-class="{opened: (showSubMenu && firstLevel == 'server-control')}">
+      <ul class="nav__second-level btn-control" ng-style="navStyle" ng-class="{opened: (showSubMenu && firstLevel == 'server-control')}">
         <li ng-class="{'active': (path == '/server-control' || path == '/server-control/power-operations')}">
-          <a href="#/server-control/power-operations" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Server power operations</a>
+          <a href="#/server-control/power-operations" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Server power operations</a>
         </li>
         <li ng-class="{'active': (path == '/server-control/power-usage')}">
-          <a href="#/server-control/power-usage" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Manage power usage</a>
+          <a href="#/server-control/power-usage" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Manage power usage</a>
         </li>
         <li ng-class="{'active': (path == '/server-control/server-led')}">
-          <a href="#/server-control/server-led" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Server LED</a>
+          <a href="#/server-control/server-led" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Server LED</a>
         </li>
         <li ng-class="{'active': (path == '/server-control/bmc-reboot')}">
-          <a href="#/server-control/bmc-reboot" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Reboot BMC</a>
+          <a href="#/server-control/bmc-reboot" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Reboot BMC</a>
         </li>
         <li ng-class="{'active': (path == '/server-control/remote-console')}">
-          <a href="#/server-control/remote-console" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Serial over LAN console</a>
+          <a href="#/server-control/remote-console" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">Serial over LAN console</a>
         </li>
         <li ng-class="{'active': (path == '/server-control/kvm')}">
-          <a href="#/server-control/kvm" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">KVM</a>
+          <a href="#/server-control/kvm" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'server-control') ? 0 : -1}}">KVM</a>
         </li>
         <li ng-class="{'active': (path == '/server-control/virtual-media')}">
           <a href="#/server-control/virtual-media" ng-click="closeSubnav()"
@@ -77,45 +61,37 @@
         <icon class="nav-icon" file="icon-config.svg"></icon>
         Server configuration
       </button>
-      <ul class="nav__second-level btn-firmware"
-        ng-style="navStyle"
-        ng-class="{opened: (showSubMenu && firstLevel == 'configuration')}">
+      <ul class="nav__second-level btn-firmware" ng-style="navStyle" ng-class="{opened: (showSubMenu && firstLevel == 'configuration')}">
         <li ng-class="{'active': (path == '/configuration' || path == '/configuration/network')}">
-          <a href="#/configuration/network" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Network settings</a>
-        </li>
-        <li ng-class="{'active': (path == '/configuration' || path == '/configuration/certificate')}">
-          <a href="#/configuration/certificate" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Certificate management</a>
+          <a href="#/configuration/network" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Network settings</a>
         </li>
         <li ng-class="{'active': (path == '/configuration' || path == '/configuration/snmp')}">
-          <a href="#/configuration/snmp" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">SNMP settings</a>
+          <a href="#/configuration/snmp" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">SNMP settings</a>
         </li>
         <li ng-class="{'active': (path == '/configuration' || path == '/configuration/firmware')}">
-          <a href="#/configuration/firmware" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Firmware</a>
+          <a href="#/configuration/firmware" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Firmware</a>
         </li>
         <li ng-class="{'active': (path == '/configuration' || path == '/configuration/date-time')}">
-          <a href="#/configuration/date-time" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Date and time settings</a>
+          <a href="#/configuration/date-time" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">Date and time settings</a>
         </li>
-        <li ng-class="{'active': (path == '/configuration' || path == '/configuration/ldap')}">
-          <a href="#/configuration/ldap" ng-click="closeSubnav()"
-            tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">LDAP settings</a></li>
       </ul>
     </li>
     <li>
-      <button class="btn-users" ng-class="{opened: firstLevel == 'users'}" ng-click="change('users')">
-        <icon class="nav-icon" file="icon-user.svg"></icon>
-        Users
+      <button class="btn-access-control" ng-class="{opened: firstLevel == 'access-control'}" ng-click="change('access-control')">
+        <span>
+          <icon class="nav-icon" file="icon-key.svg"></icon>
+          Access control
+        </span>
       </button>
-      <ul class="nav__second-level btn-users"
-        ng-style="navStyle"
-        ng-class="{opened: (showSubMenu && firstLevel == 'users')}">
-        <li ng-class="{'active': (path == '/users' || path == '/users/manage-accounts')}">
-          <a href="#/users/manage-accounts" ng-click="closeSubnav()"
-            tabindex="{{ (showSubMenu && firstLevel == 'users') ? 0 : -1}}">Manage user account</a>
+      <ul class="nav__second-level btn-access-control" ng-style="navStyle" ng-class="{opened: (showSubMenu && firstLevel == 'access-control')}">
+        <li ng-class="{'active': (path == '/access-control' || path == '/access-control/ldap')}">
+          <a href="#/access-control/ldap" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">LDAP</a>
+        </li>
+        <li ng-class="{'active': (path == '/access-control' || path == '/access-control/local-users')}">
+          <a href="#/access-control/local-users" ng-click="closeSubnav()" tabindex="{{ (showSubMenu && firstLevel == 'access-control') ? 0 : -1}}">Local users</a>
+        </li>
+        <li ng-class="{'active': (path == '/access-control' || path == '/access-control/ssl-certificates')}">
+          <a href="#/access-control/ssl-certificates" ng-click="closeSubnav()" tabindex="{{(showSubMenu && firstLevel == 'configuration') ? 0 : -1}}">SSL certificates</a>
         </li>
       </ul>
     </li>
diff --git a/app/configuration/index.js b/app/configuration/index.js
index 4ad7ff9..b418295 100644
--- a/app/configuration/index.js
+++ b/app/configuration/index.js
@@ -35,17 +35,6 @@ window.angular && (function(angular) {
                 'controller': 'snmpController',
                 authenticated: true
               })
-              .when('/configuration/certificate', {
-                'template':
-                    require('./controllers/certificate-controller.html'),
-                'controller': 'certificateController',
-                authenticated: true
-              })
-              .when('/configuration/ldap', {
-                'template': require('./controllers/ldap-controller.html'),
-                'controller': 'ldapController',
-                authenticated: true
-              })
               .when('/configuration/firmware', {
                 'template': require('./controllers/firmware-controller.html'),
                 'controller': 'firmwareController',
diff --git a/app/configuration/styles/index.scss b/app/configuration/styles/index.scss
index 2e70e84..e532583 100644
--- a/app/configuration/styles/index.scss
+++ b/app/configuration/styles/index.scss
@@ -2,5 +2,3 @@
 @import "./snmp.scss";
 @import "./date-time.scss";
 @import "./firmware.scss";
-@import "./certificate.scss";
-@import "./ldap.scss";
diff --git a/app/index.js b/app/index.js
index 3f25a72..66ebdb7 100644
--- a/app/index.js
+++ b/app/index.js
@@ -99,16 +99,17 @@ import redfish_index from './redfish/index.js';
 import redfish_controller from './redfish/controllers/redfish-controller.js';
 import configuration_index from './configuration/index.js';
 import date_time_controller from './configuration/controllers/date-time-controller.js';
-import certificate_controller from './configuration/controllers/certificate-controller.js';
 import network_controller from './configuration/controllers/network-controller.js';
 import snmp_controller from './configuration/controllers/snmp-controller.js';
-import ldap_controller from './configuration/controllers/ldap-controller.js';
 import firmware_controller from './configuration/controllers/firmware-controller.js';
 
-import users_index from './users/index.js';
-import user_accounts_controller from './users/controllers/user-accounts-controller.js';
-import username_validator from './users/directives/username-validator.js';
-import role_table from './users/directives/role-table.js';
+import access_control from './access-control/index.js';
+import user_controller from './access-control/controllers/user-controller.js';
+import username_validator from './access-control/directives/username-validator.js';
+import role_table from './access-control/directives/role-table.js';
+import certificate_controller from './access-control/controllers/certificate-controller.js';
+import ldap_controller from './access-control/controllers/ldap-controller.js';
+
 
 window.angular && (function(angular) {
   'use strict';
@@ -126,7 +127,8 @@ window.angular && (function(angular) {
             'app.common.filters', 'app.common.components',
             // Model resources
             'app.login', 'app.overview', 'app.serverControl',
-            'app.serverHealth', 'app.configuration', 'app.users', 'app.redfish'
+            'app.serverHealth', 'app.configuration', 'app.accessControl',
+            'app.redfish'
           ])
       // Route configuration
       .config([
diff --git a/app/styles/index.scss b/app/styles/index.scss
index b59ed44..d54e20c 100644
--- a/app/styles/index.scss
+++ b/app/styles/index.scss
@@ -6,5 +6,5 @@ $charset: "UTF-8";
 @import "../server-control/styles/index.scss";
 @import "../server-health/styles/index.scss";
 @import "../configuration/styles/index.scss";
-@import "../users/styles/index.scss";
+@import "../access-control/styles/index.scss";
 @import "../redfish/styles/index.scss";
diff --git a/app/users/directives/username-validator.js b/app/users/directives/username-validator.js
deleted file mode 100644
index d8c5848..0000000
--- a/app/users/directives/username-validator.js
+++ /dev/null
@@ -1,38 +0,0 @@
-window.angular && (function(angular) {
-  'use strict';
-
-  /**
-   * Username validator
-   *
-   * Checks if entered username is a duplicate
-   * Provide existingUsernames scope that should be an array of
-   * existing usernames
-   *
-   * <input username-validator  existing-usernames="[]"/>
-   *
-   */
-  angular.module('app.users').directive('usernameValidator', function() {
-    return {
-      restrict: 'A', require: 'ngModel', scope: {existingUsernames: '='},
-          link: function(scope, element, attrs, controller) {
-            if (scope.existingUsernames === undefined) {
-              return;
-            }
-            controller.$validators.duplicateUsername =
-                (modelValue, viewValue) => {
-                  const enteredUsername = modelValue || viewValue;
-                  const matchedExisting = scope.existingUsernames.find(
-                      (username) => username === enteredUsername);
-                  if (matchedExisting) {
-                    return false;
-                  } else {
-                    return true;
-                  }
-                };
-            element.on('blur', () => {
-              controller.$validate();
-            });
-          }
-    }
-  });
-})(window.angular);
diff --git a/app/users/index.js b/app/users/index.js
deleted file mode 100644
index 534653d..0000000
--- a/app/users/index.js
+++ /dev/null
@@ -1,32 +0,0 @@
-/**
- * A module for the users
- *
- * @module app/users/index
- * @exports app/users/index
- */
-
-window.angular && (function(angular) {
-  'use strict';
-
-  angular
-      .module('app.users', ['ngRoute', 'app.common.services'])
-      // Route configuration
-      .config([
-        '$routeProvider',
-        function($routeProvider) {
-          $routeProvider
-              .when('/users/manage-accounts', {
-                'template':
-                    require('./controllers/user-accounts-controller.html'),
-                'controller': 'userAccountsController',
-                authenticated: true
-              })
-              .when('/users', {
-                'template':
-                    require('./controllers/user-accounts-controller.html'),
-                'controller': 'userAccountsController',
-                authenticated: true
-              });
-        }
-      ]);
-})(window.angular);
diff --git a/app/users/styles/index.scss b/app/users/styles/index.scss
deleted file mode 100644
index da9c25e..0000000
--- a/app/users/styles/index.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import "./user-accounts.scss";