diff --git a/www/src/app/pages/settings/settings.page.controller.js b/www/src/app/pages/settings/settings.page.controller.js
index 9fd1a60e1..6afe4cb67 100644
--- a/www/src/app/pages/settings/settings.page.controller.js
+++ b/www/src/app/pages/settings/settings.page.controller.js
@@ -6,8 +6,10 @@ export default class SettingsPageController {
     $scope,
     $state,
     UserService,
+    ModalService,
     NotificationService,
-    resizeService
+    resizeService,
+    clipboard
   ) {
     'ngInject';
 
@@ -16,8 +18,10 @@ export default class SettingsPageController {
     this.$state = $state;
 
     this.UserService = UserService;
+    this.ModalService = ModalService;
     this.NotificationService = NotificationService;
     this.resizeService = resizeService;
+    this.clipboard = clipboard;
 
     this.basicData = {};
     this.passData = {
@@ -26,6 +30,7 @@ export default class SettingsPageController {
       password: '',
       passwordConfirm: ''
     };
+    this.keyData = {};
   }
 
   $onInit() {
@@ -41,6 +46,9 @@ export default class SettingsPageController {
     this.canChangePass =
       this.config.config.capabilities.indexOf('changePassword') !== -1;
 
+    this.canChangeKey =
+      this.config.config.capabilities.indexOf('authByKey') !== -1;
+
     this.$scope.$watch('$ctrl.avatar', value => {
       if (!value) {
         return;
@@ -93,7 +101,11 @@ export default class SettingsPageController {
       this.passData.password !== '' &&
       this.passData.password === this.passData.passwordConfirm
     ) {
-      this.UserService.changePass(this.currentUser.id, this.passData.currentPassword, this.passData.password)
+      this.UserService.changePass(
+        this.currentUser.id,
+        this.passData.currentPassword,
+        this.passData.password
+      )
         .then(() => {
           this.NotificationService.log(
             'Your password has been successfully updated',
@@ -134,4 +146,43 @@ export default class SettingsPageController {
     form.avatar.$setValidity('maxsize', true);
     form.avatar.$setPristine(true);
   }
+
+  getKey() {
+    this.UserService.getKey(this.currentUser.id).then(key => {
+      this.keyData.key = key;
+    });
+  }
+
+  createKey() {
+    let modalInstance = this.ModalService.confirm(
+      'Renew API Key',
+      'Are you sure you want to renew your API Key?',
+      {
+        flavor: 'danger',
+        okText: 'Yes, renew it'
+      }
+    );
+
+    modalInstance.result
+      .then(() => this.UserService.setKey(this.currentUser.id))
+      .then(() => {
+        delete this.keyData.key;
+        this.NotificationService.success(
+          'API key has been successfully renewed.'
+        );
+      })
+      .catch(err => {
+        if (!_.isString(err)) {
+          this.NotificationService.error('Unable to lock the user.');
+        }
+      });
+  }
+
+  copyKey() {
+    this.clipboard.copyText(this.keyData.key);
+    delete this.keyData.key;
+    this.NotificationService.success(
+      'API key has been successfully copied to clipboard.'
+    );
+  }
 }
diff --git a/www/src/app/pages/settings/settings.page.html b/www/src/app/pages/settings/settings.page.html
index 3cf8fa8f7..5d51b3c0d 100644
--- a/www/src/app/pages/settings/settings.page.html
+++ b/www/src/app/pages/settings/settings.page.html
@@ -127,6 +127,36 @@ <h3 class="box-title">
       </div>
     </form>
 
+    <!-- Update API Key -->
+    <form ng-if="$ctrl.canChangeKey">
+      <div class="box box-primary">
+        <div class="box-header" ng-if="$ctrl.currentUser.hasKey">
+          <h3 class="box-title">API Key</h3>
+        </div>
+        <div class="box-body">          
+          <div class="callout callout-warning mv-0" ng-if="!$ctrl.currentUser.hasKey">
+            <h4>You don't have any API key.</h4>          
+            <p> Please contact your organization's administrator.</p>
+          </div>
+          <div class="form-group" ng-if="$ctrl.currentUser.hasKey">
+            <p>You have an API key defined. You can renew it if needed.</p>
+            <div class="input-group">
+              <span class="input-group-btn">
+                <span class="btn btn-default" ng-click="$ctrl.createKey()">Renew</span>
+                <span class="btn btn-primary" ng-click="$ctrl.getKey()" ng-if="!$ctrl.keyData.key">Reveal</span>
+              </span>
+              <input class="form-control" readonly ng-model="$ctrl.keyData.key" ng-if="$ctrl.keyData.key">
+              <span class="input-group-btn" ng-if="$ctrl.keyData.key">
+                <button class="btn btn-primary" type="button" ng-click="$ctrl.copyKey()">
+                  <i class="fa fa-copy"></i>
+                </button>
+              </span>
+            </div>            
+          </div>
+        </div>
+      </div>
+    </form>
+
   </div>
 </div>