UI: Small tickets/ bug fixes for DBSE (#10976)

* small fix 1 * error handling * empty state and catch conditional on displayArray empty * add link to connection from role view
2026-02-03 20:40:45 -05:00 · 2021-02-23 08:59:30 -07:00 · 2021-02-23 08:59:30 -07:00 · 7c2c54b25c
commit 7c2c54b25c
parent c25680ad4a
10 changed files with 69 additions and 13 deletions
--- a/ui/app/components/generate-credentials-database.js
+++ b/ui/app/components/generate-credentials-database.js
@ -26,6 +26,9 @@ export default class GenerateCredentialsDatabase extends Component {
  roleName = null;
  @tracked roleType = '';
  @tracked model = null;
+  @tracked errorMessage = '';
+  @tracked errorHttpStatus = '';
+  @tracked errorTitle = 'Something went wrong';

  constructor() {
    super(...arguments);
@ -34,19 +37,24 @@ export default class GenerateCredentialsDatabase extends Component {

  @task(function*() {
    let { roleName, backendPath } = this.args;
-    let errors = [];
    try {
      let newModel = yield this.store.queryRecord('database/credential', {
        backend: backendPath,
        secret: roleName,
        roleType: 'static',
      });
-      // if successful will return result
      this.model = newModel;
      this.roleType = 'static';
      return;
    } catch (error) {
-      errors.push(error.errors);
+      this.errorHttpStatus = error.httpStatus; // set default http
+      this.errorMessage = `We ran into a problem and could not continue: ${error.errors[0]}`;
+      if (error.httpStatus === 403) {
+        // 403 is forbidden
+        this.errorTitle = 'You are not authorized';
+        this.errorMessage =
+          "Role wasn't found or you do not have permissions. Ask your administrator if you think you should have access.";
+      }
    }
    try {
      let newModel = yield this.store.queryRecord('database/credential', {
@ -58,7 +66,19 @@ export default class GenerateCredentialsDatabase extends Component {
      this.roleType = 'dynamic';
      return;
    } catch (error) {
-      errors.push(error.errors);
+      if (error.httpStatus === 403) {
+        // 403 is forbidden
+        this.errorHttpStatus = error.httpStatus; // override default httpStatus which could be 400 which always happens on either dynamic or static depending on which kind of role you're querying
+        this.errorTitle = 'You are not authorized';
+        this.errorMessage =
+          "Role wasn't found or you do not have permissions. Ask your administrator if you think you should have access.";
+      }
+      if (error.httpStatus == 500) {
+        // internal server error happens when empty creation statement on dynamic role creation only
+        this.errorHttpStatus = error.httpStatus;
+        this.errorTitle = 'Internal Error';
+        this.errorMessage = error.errors[0];
+      }
    }
    this.roleType = 'noRoleFound';
  })
--- a/ui/app/serializers/database/role.js
+++ b/ui/app/serializers/database/role.js
@ -25,8 +25,14 @@ export default RESTSerializer.extend({
      database = [payload.data.db_name];
    }
    // Copy to singular for MongoDB
-    const creation_statement = payload.data.creation_statements[0];
-    const revocation_statement = payload.data.revocation_statements[0];
+    let creation_statement = '';
+    let revocation_statement = '';
+    if (payload.data.creation_statements) {
+      creation_statement = payload.data.creation_statements[0];
+    }
+    if (payload.data.revocation_statements) {
+      revocation_statement = payload.data.revocation_statements[0];
+    }
    return {
      id: payload.secret,
      name: payload.secret,
--- a/ui/app/styles/components/empty-state.scss
+++ b/ui/app/styles/components/empty-state.scss
@ -13,6 +13,7 @@
 }

 .empty-state-title {
+  white-space: nowrap;
  color: $grey;
  font-size: $size-4;
  font-weight: $font-weight-semibold;
--- a/ui/app/templates/components/database-connection.hbs
+++ b/ui/app/templates/components/database-connection.hbs
@ -226,9 +226,29 @@
  {{#each @model.showAttrs as |attr|}}
    {{#let attr.options.defaultDisplay as |defaultDisplay|}}
      {{#if (eq attr.type "object")}}
-        <InfoTableRow @alwaysRender={{true}} @defaultShown={{attr.options.defaultShown}} @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}} @value={{stringify (get @model attr.name)}} />
+        <InfoTableRow 
+          @alwaysRender={{true}}
+          @defaultShown={{attr.options.defaultShown}}
+          @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
+          @value={{stringify (get @model attr.name)}} 
+        />
+      {{else if (eq attr.type "array")}}
+        <InfoTableRow
+          @alwaysRender={{true}}
+          @defaultShown={{attr.options.defaultShown}}
+          @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
+          @value={{or (get @model attr.name) defaultDisplay}}
+          @isLink={{true}}
+          @queryParam="role"
+          @type={{attr.type}}
+        />
      {{else}}
-        <InfoTableRow @alwaysRender={{true}} @defaultShown={{attr.options.defaultShown}} @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}} @value={{or (get @model attr.name) defaultDisplay}} />
+        <InfoTableRow
+          @alwaysRender={{true}}
+          @defaultShown={{attr.options.defaultShown}}
+          @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
+          @value={{or (get @model attr.name) defaultDisplay}}
+        />
      {{/if}}
    {{/let}}
  {{/each}}
--- a/ui/app/templates/components/database-role-edit.hbs
+++ b/ui/app/templates/components/database-role-edit.hbs
@ -69,6 +69,7 @@
          @defaultShown={{attr.options.defaultShown}}
          @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}}
          @value={{or (get @model attr.name) defaultDisplay}}
+          @isLink={{eq attr.name 'database'}}
        />
      {{/if}}
    {{/let}}
--- a/ui/app/templates/components/generate-credentials-database.hbs
+++ b/ui/app/templates/components/generate-credentials-database.hbs
@ -22,11 +22,11 @@
  {{!-- ROLE TYPE NOT FOUND, returned when query on the creds and static creds both returned error --}}
  {{#if (eq this.roleType 'noRoleFound') }}
    <EmptyState
-      @title="You are not authorized"
-      @subTitle="Something went wrong"
+      @title={{this.errorTitle}}
+      @subTitle="Error {{this.errorHttpStatus}}"
      @icon="alert-circle-outline"
      @bottomBorder={{true}}
-      @message="Role wasn't found or you do not have permissions. Ask your administrator if you think you should have access."
+      @message={{this.errorMessage}}
    >
      <nav class="breadcrumb">
        <ul class="is-grouped-split">
--- a/ui/app/templates/vault/cluster/secrets/backend/list.hbs
+++ b/ui/app/templates/vault/cluster/secrets/backend/list.hbs
@ -73,7 +73,7 @@
  {{else}}
    {{#if (eq baseKey.id '')}}
      <EmptyState
-        @title="No {{pluralize options.item}} in this backend yet"
+        @title="No {{pluralize options.item}} in this backend"
        @message="Secrets in this backend will be listed here. Add a secret to get started."
      >
        <SecretLink @mode="create" @secret="" @queryParams={{query-params initialKey=(or filter baseKey.id) itemType=tab}} @class="link">
--- a/ui/lib/core/addon/components/info-table-item-array.js
+++ b/ui/lib/core/addon/components/info-table-item-array.js
@ -35,6 +35,9 @@ export default Component.extend({
  store: service(),
  displayArrayAmended: computed('displayArray', function() {
    let { displayArray } = this;
+    if (!displayArray) {
+      return;
+    }
    if (displayArray.length >= 10) {
      // if array greater than 10 in length only display the first 5
      displayArray = displayArray.slice(0, 5);
@ -44,6 +47,9 @@ export default Component.extend({
  }),

  checkWildcardInArray: task(function*() {
+    if (!this.displayArray) {
+      return;
+    }
    let filteredArray = yield this.displayArray.filter(item => isWildcardString(item));
    this.set('wildcardInDisplayArray', filteredArray.length > 0 ? true : false);
  }).on('didInsertElement'),
--- a/ui/lib/core/addon/templates/components/info-table-row.hbs
+++ b/ui/lib/core/addon/templates/components/info-table-row.hbs
@ -42,6 +42,8 @@
          @viewAll={{viewAll}}
          @wildcardLabel={{wildcardLabel}}
        />
+      {{else if isLink}}
+        <LinkTo @route="vault.cluster.secrets.backend.show" @model={{value.[0]}} >{{value}}</LinkTo>
      {{else}}
        {{#if tooltipText}}
          <ToolTip
--- a/ui/lib/kmip/addon/templates/configuration.hbs
+++ b/ui/lib/kmip/addon/templates/configuration.hbs
@ -25,7 +25,7 @@
  />
 {{else}}
  <EmptyState
-    @title="No configuration for this secrets engine yet"
+    @title="No configuration for this secrets engine"
    @message="We'll need to configure a few things before getting started."
  >
    {{#link-to "configure"}}