MFA Config

ui/app/adapters/mfa-login-enforcement.js

@@ -0,0 +1,29 @@
+import ApplicationAdapter from './application';
+
+export default class KeymgmtKeyAdapter extends ApplicationAdapter {
+  namespace = 'v1';
+
+  pathForType() {
+    return 'identity/mfa/login-enforcement';
+  }
+
+  _saveRecord(store, { modelName }, snapshot) {
+    const data = store.serializerFor(modelName).serialize(snapshot);
+    return this.ajax(this.urlForUpdateRecord(snapshot.attr('name'), modelName, snapshot), 'POST', {
+      data,
+    }).then(() => data);
+  }
+  // create does not return response similar to PUT request
+  async createRecord() {
+    return this._saveRecord(...arguments);
+  }
+  // update record via POST method
+  updateRecord() {
+    return this._saveRecord(...arguments);
+  }
+
+  async query(store, type, query) {
+    const url = this.urlForQuery(query, type.modelName);
+    return this.ajax(url, 'GET', { data: { list: true } });
+  }
+}

ui/app/adapters/mfa-method.js

@@ -0,0 +1,54 @@
+import ApplicationAdapter from './application';
+
+export default class MfaMethodAdapter extends ApplicationAdapter {
+  namespace = 'v1';
+
+  pathForType() {
+    return 'identity/mfa/method';
+  }
+
+  createOrUpdate(store, type, snapshot) {
+    const data = store.serializerFor(type.modelName).serialize(snapshot);
+    const { id } = snapshot;
+    return this.ajax(this.buildURL(type.modelName, id, snapshot, 'POST'), 'POST', {
+      data,
+    }).then((res) => {
+      // TODO: Check how 204's are handled by ember
+      return {
+        data: {
+          ...data,
+          id: res?.data?.method_id || id,
+        },
+      };
+    });
+  }
+
+  createRecord() {
+    return this.createOrUpdate(...arguments);
+  }
+
+  updateRecord() {
+    return this.createOrUpdate(...arguments);
+  }
+
+  urlForDeleteRecord(id, modelName, snapshot) {
+    return this.buildURL(modelName, id, snapshot, 'POST');
+  }
+
+  query(store, type, query) {
+    const url = this.urlForQuery(query, type.modelName);
+    return this.ajax(url, 'GET', {
+      data: {
+        list: true,
+      },
+    });
+  }
+
+  buildURL(modelName, id, snapshot, requestType) {
+    if (requestType === 'POST') {
+      let url = `${super.buildURL(modelName)}/${snapshot.attr('type')}`;
+      return id ? `${url}/${id}` : url;
+    }
+    return super.buildURL(...arguments);
+  }
+}

ui/app/adapters/mfa-setup.js

@@ -0,0 +1,13 @@
+import ApplicationAdapter from './application';
+
+export default class MfaSetupAdapter extends ApplicationAdapter {
+  adminGenerate(data) {
+    let url = `/v1/identity/mfa/method/totp/admin-generate`;
+    return this.ajax(url, 'POST', { data });
+  }
+
+  adminDestroy(data) {
+    let url = `/v1/identity/mfa/method/totp/admin-destroy`;
+    return this.ajax(url, 'POST', { data });
+  }
+}

ui/app/components/auth-info.js

@@ -20,8 +20,13 @@ export default class AuthInfoComponent extends Component {
   @service wizard;
   @service router;
 
-  @tracked
-  fakeRenew = false;
+  @tracked fakeRenew = false;
+
+  get hasEntityId() {
+    // root users will not have an entity_id because they are not associated with an entity.
+    // in order to use the MFA end user setup they need an entity_id
+    return this.auth.authData.entity_id ? true : false;
+  }
 
   get isRenewing() {
     return this.fakeRenew || this.auth.isRenewing;

ui/app/components/mfa-form.js

@@ -15,16 +15,29 @@ import { numberToWord } from 'vault/helpers/number-to-word';
  * @param {string} clusterId - id of selected cluster
  * @param {object} authData - data from initial auth request -- { mfa_requirement, backend, data }
  * @param {function} onSuccess - fired when passcode passes validation
+ * @param {function} onError - fired for multi-method or non-passcode method validation errors
  */
 
-export const VALIDATION_ERROR =
+export const TOTP_VALIDATION_ERROR =
   'The passcode failed to validate. If you entered the correct passcode, contact your administrator.';
 
 export default class MfaForm extends Component {
   @service auth;
 
   @tracked countdown;
   @tracked error;
+  @tracked codeDelayMessage;
+
+  constructor() {
+    super(...arguments);
+    // trigger validation immediately when passcode is not required
+    const passcodeOrSelect = this.constraints.filter((constraint) => {
+      return constraint.methods.length > 1 || constraint.methods.findBy('uses_passcode');
+    });
+    if (!passcodeOrSelect.length) {
+      this.validate.perform();
+    }
+  }
 
   get constraints() {
     return this.args.authData.mfa_requirement.mfa_constraints;
@@ -66,19 +79,26 @@ export default class MfaForm extends Component {
       });
       this.args.onSuccess(response);
     } catch (error) {
-      const codeUsed = (error.errors || []).find((e) => e.includes('code already used;'));
-      if (codeUsed) {
-        // parse validity period from error string to initialize countdown
-        const seconds = parseInt(codeUsed.split('in ')[1].split(' seconds')[0]);
-        this.newCodeDelay.perform(seconds);
+      const errors = error.errors || [];
+      const codeUsed = errors.find((e) => e.includes('code already used;'));
+      const rateLimit = errors.find((e) => e.includes('maximum TOTP validation attempts'));
+      const delayMessage = codeUsed || rateLimit;
+
+      if (delayMessage) {
+        const reason = codeUsed ? 'This code has already been used' : 'Maximum validation attempts exceeded';
+        this.codeDelayMessage = `${reason}. Please wait until a new code is available.`;
+        this.newCodeDelay.perform(delayMessage);
+      } else if (this.singlePasscode) {
+        this.error = TOTP_VALIDATION_ERROR;
       } else {
-        this.error = VALIDATION_ERROR;
+        this.args.onError(this.auth.handleError(error));
       }
     }
   }
 
-  @task *newCodeDelay(timePeriod) {
-    this.countdown = timePeriod;
+  @task *newCodeDelay(message) {
+    // parse validity period from error string to initialize countdown
+    this.countdown = parseInt(message.match(/(\d\w seconds)/)[0].split(' ')[0]);
     while (this.countdown) {
       yield timeout(1000);
       this.countdown--;

ui/app/components/mfa-login-enforcement-form.js

@@ -0,0 +1,165 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { methods } from 'vault/helpers/mountable-auth-methods';
+import { inject as service } from '@ember/service';
+import { task } from 'ember-concurrency';
+
+/**
+ * @module MfaLoginEnforcementForm
+ * MfaLoginEnforcementForm components are used to create and edit login enforcements
+ *
+ * @example
+ * ```js
+ * <MfaLoginEnforcementForm @model={{this.model}} @isInline={{false}} @onSave={{this.onSave}} @onClose={{this.onClose}} />
+ * ```
+ * @callback onSave
+ * @callback onClose
+ * @param {Object} model - login enforcement model
+ * @param {Object} [isInline] - toggles inline display of form -- method selector and actions are hidden and should be handled externally
+ * @param {Object} [modelErrors] - model validations state object if handling actions externally when displaying inline
+ * @param {onSave} [onSave] - triggered on save success
+ * @param {onClose} [onClose] - triggered on cancel
+ */
+
+export default class MfaLoginEnforcementForm extends Component {
+  @service store;
+  @service flashMessages;
+
+  targetTypes = [
+    { label: 'Authentication mount', type: 'accessor', key: 'auth_method_accessors' },
+    { label: 'Authentication method', type: 'method', key: 'auth_method_types' },
+    { label: 'Group', type: 'identity/group', key: 'identity_groups' },
+    { label: 'Entity', type: 'identity/entity', key: 'identity_entities' },
+  ];
+  authMethods = methods();
+  searchSelectOptions = null;
+
+  @tracked name;
+  @tracked targets = [];
+  @tracked selectedTargetType = 'accessor';
+  @tracked selectedTargetValue = null;
+  @tracked searchSelect = {
+    options: [],
+    selected: [],
+  };
+  @tracked modelErrors;
+
+  constructor() {
+    super(...arguments);
+    // aggregate different target array properties on model into flat list
+    this.flattenTargets();
+    // eagerly fetch identity groups and entities for use as search select options
+    this.resetTargetState();
+  }
+
+  async flattenTargets() {
+    for (let { label, key } of this.targetTypes) {
+      const targetArray = await this.args.model[key];
+      const targets = targetArray.map((value) => ({ label, key, value }));
+      this.targets.addObjects(targets);
+    }
+  }
+  async resetTargetState() {
+    this.selectedTargetValue = null;
+    const options = this.searchSelectOptions || {};
+    if (!this.searchSelectOptions) {
+      const types = ['identity/group', 'identity/entity'];
+      for (const type of types) {
+        try {
+          options[type] = (await this.store.query(type, {})).toArray();
+        } catch (error) {
+          options[type] = [];
+        }
+      }
+      this.searchSelectOptions = options;
+    }
+    if (this.selectedTargetType.includes('identity')) {
+      this.searchSelect = {
+        selected: [],
+        options: [...options[this.selectedTargetType]],
+      };
+    }
+  }
+
+  get selectedTarget() {
+    return this.targetTypes.findBy('type', this.selectedTargetType);
+  }
+  get errors() {
+    return this.args.modelErrors || this.modelErrors;
+  }
+
+  @task
+  *save() {
+    this.modelErrors = {};
+    // check validity state first and abort if invalid
+    const { isValid, state } = this.args.model.validate();
+    if (!isValid) {
+      this.modelErrors = state;
+    } else {
+      try {
+        yield this.args.model.save();
+        this.args.onSave();
+      } catch (error) {
+        const message = error.errors ? error.errors.join('. ') : error.message;
+        this.flashMessages.danger(message);
+      }
+    }
+  }
+
+  @action
+  async onMethodChange(selectedIds) {
+    const methods = await this.args.model.mfa_methods;
+    // first check for existing methods that have been removed from selection
+    methods.forEach((method) => {
+      if (!selectedIds.includes(method.id)) {
+        methods.removeObject(method);
+      }
+    });
+    // now check for selected items that don't exist and add them to the model
+    const methodIds = methods.mapBy('id');
+    selectedIds.forEach((id) => {
+      if (!methodIds.includes(id)) {
+        const model = this.store.peekRecord('mfa-method', id);
+        methods.addObject(model);
+      }
+    });
+  }
+  @action
+  onTargetSelect(type) {
+    this.selectedTargetType = type;
+    this.resetTargetState();
+  }
+  @action
+  setTargetValue(selected) {
+    const { type } = this.selectedTarget;
+    if (type.includes('identity')) {
+      // for identity groups and entities grab model from store as value
+      this.selectedTargetValue = this.store.peekRecord(type, selected[0]);
+    } else {
+      this.selectedTargetValue = selected;
+    }
+  }
+  @action
+  addTarget() {
+    const { label, key } = this.selectedTarget;
+    const value = this.selectedTargetValue;
+    this.targets.addObject({ label, value, key });
+    // add target to appropriate model property
+    this.args.model[key].addObject(value);
+    this.selectedTargetValue = null;
+    this.resetTargetState();
+  }
+  @action
+  removeTarget(target) {
+    this.targets.removeObject(target);
+    // remove target from appropriate model property
+    this.args.model[target.key].removeObject(target.value);
+  }
+  @action
+  cancel() {
+    // revert model changes
+    this.args.model.rollbackAttributes();
+    this.args.onClose();
+  }
+}

ui/app/components/mfa-login-enforcement-header.js

@@ -0,0 +1,52 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { action } from '@ember/object';
+
+/**
+ * @module MfaLoginEnforcementHeader
+ * MfaLoginEnforcementHeader components are used to display information when creating and editing login enforcements
+ *
+ * @example
+ * ```js
+ * <MfaLoginEnforcementHeader @heading="New enforcement" />
+ * <MfaLoginEnforcementHeader @radioCardGroupValue={{this.enforcementPreference}} @onRadioCardSelect={{fn (mut this.enforcementPreference)}} @onEnforcementSelect={{fn (mut this.enforcement)}} />
+ * ```
+ * @callback onRadioCardSelect
+ * @callback onEnforcementSelect
+ * @param {boolean} [isInline] - toggle component display when used inline with mfa method form -- overrides heading and shows radio cards and enforcement select
+ * @param {string} [heading] - page heading to display outside of inline mode
+ * @param {string} [radioCardGroupValue] - selected value of the radio card group in inline mode -- new, existing or skip are the accepted values
+ * @param {onRadioCardSelect} [onRadioCardSelect] - change event triggered on radio card select
+ * @param {onEnforcementSelect} [onEnforcementSelect] - change event triggered on enforcement select when radioCardGroupValue is set to existing
+ */
+
+export default class MfaLoginEnforcementHeaderComponent extends Component {
+  @service store;
+
+  constructor() {
+    super(...arguments);
+    if (this.args.isInline) {
+      this.fetchEnforcements();
+    }
+  }
+
+  @tracked enforcements = [];
+
+  async fetchEnforcements() {
+    try {
+      // cache initial values for lookup in select handler
+      this._enforcements = (await this.store.query('mfa-login-enforcement', {})).toArray();
+      this.enforcements = [...this._enforcements];
+    } catch (error) {
+      this.enforcements = [];
+    }
+  }
+
+  @action
+  onEnforcementSelect([name]) {
+    // search select returns array of strings, in this case enforcement name
+    // lookup model and pass to callback
+    this.args.onEnforcementSelect(this._enforcements.findBy('name', name));
+  }
+}