Repository: hashicorp/vault
File: ui/app/components/database-role-edit.js (JavaScript)

Code before:
    this.errorMessage = this.invalidFormAlert = '';
    this.modelValidations = null;
  }

  get warningMessages() {
    const warnings = {};
    const { canCreateDynamic, canCreateStatic, type } = this.args.model;
    if (
      (type === 'dynamic' && canCreateDynamic === false) ||
      (type === 'static' && canCreateStatic === false)
    ) {
      warnings.type = `You don't have permissions to create this type of role.`;
    }
    return warnings;
  }

  get skipImport() {
    const backend = this.args.model?.backend;
    const dbs = this.args.model?.database || [];
    if (!backend || dbs.length === 0) {
      return null;
    }
    return this.store
      .queryRecord('database/connection', { id: dbs[0], backend })
      .then((record) => record.skip_static_role_rotation_import)
      .catch(() => null);
  }

  get databaseType() {
    const backend = this.args.model?.backend;
    const dbs = this.args.model?.database || [];
    if (!backend || dbs.length === 0) {
      return null;
    }
    return this.store
      .queryRecord('database/connection', { id: dbs[0], backend })
      .then((record) => record.plugin_name)
      .catch(() => null);
  }

  @action
  generateCreds(roleId, roleType = '') {
    this.router.transitionTo('vault.cluster.secrets.backend.credentials', roleId, {
      queryParams: { roleType },
    });
  }

  @action
  delete() {
    const secret = this.args.model;
    const backend = secret.backend;

Review comment (suggestion):
This adds another network request to the same endpoint, right? Since this logic is essentially the same as `get databaseType` I wonder if we can consolidate it so that we're only making a request 🤔 

One option is to update `databaseType` to return an object of pertinent params

```js
  get databaseParams() {
    const backend = this.args.model?.backend;
    const dbs = this.args.model?.database || [];
    if (!backend || dbs.length === 0) {
      return null;
    }
    return this.store
      .queryRecord('database/connection', { id: dbs[0], backend })
      .then(({ plugin_name, skip_static_role_rotation_import }) => { plugin_name, skip_static_role_rotation_import })
      .catch(() => null);
  }
  ```
and then update the params passed to `DatabaseRoleSettingForm`

Code after:
    this.errorMessage = this.invalidFormAlert = '';
    this.modelValidations = null;
  }

  get warningMessages() {
    const warnings = {};
    const { canCreateDynamic, canCreateStatic, type } = this.args.model;
    if (
      (type === 'dynamic' && canCreateDynamic === false) ||
      (type === 'static' && canCreateStatic === false)
    ) {
      warnings.type = `You don't have permissions to create this type of role.`;
    }
    return warnings;
  }

  get databaseParams() {
    const backend = this.args.model?.backend;
    const dbs = this.args.model?.database || [];
    if (!backend || dbs.length === 0) {
      return null;
    }
    return this.store
      .queryRecord('database/connection', { id: dbs[0], backend })
      .then(({ plugin_name, skip_static_role_rotation_import }) => ({
        plugin_name,
        skip_static_role_rotation_import,
      }))
      .catch(() => null);
  }

  @action
  generateCreds(roleId, roleType = '') {
    this.router.transitionTo('vault.cluster.secrets.backend.credentials', roleId, {
      queryParams: { roleType },
    });
  }

  @action
  delete() {
    const secret = this.args.model;
    const backend = secret.backend;
    return secret
      .destroyRecord()
      .then(() => {
        try {
          this.router.transitionTo(LIST_ROOT_ROUTE, backend, { queryParams: { tab: 'role' } });
        } catch (e) {
          console.debug(e); // eslint-disable-line
        }
      })