UI/fix identity model

changelog/11641.txt

@@ -0,0 +1,3 @@
+```release-note:bug
+ui: Fix entity group membership and metadata not showing
+```

ui/app/models/identity/group.js

@@ -64,8 +64,8 @@ export default IdentityModel.extend({
     'memberGroupIds.[]',
     function() {
       let { memberEntityIds, memberGroupIds } = this;
-      let numEntities = (memberEntityIds && memberEntityIds.get('length')) || 0;
-      let numGroups = (memberGroupIds && memberGroupIds.get('length')) || 0;
+      let numEntities = (memberEntityIds && memberEntityIds.length) || 0;
+      let numGroups = (memberGroupIds && memberGroupIds.length) || 0;
       return numEntities + numGroups > 0;
     }
   ),

ui/app/templates/components/identity/item-details.hbs

@@ -1,32 +1,32 @@
 <div class="box is-shadowless is-marginless is-fullwidth">
-  {{#if model.disabled}}
+  {{#if @model.disabled}}
     <AlertBanner
       @type="warning"
       @title="Attention"
-      @message="This {{model.identityType}} is disabled. All associated tokens cannot be used, but are not revoked."
+      @message="This {{@model.identityType}} is disabled. All associated tokens cannot be used, but are not revoked."
       data-test-disabled-warning>
-      {{#if model.canEdit}}
-        <button onclick={{action 'enable' model}} type="button" class="link" data-test-enable=true>
+      {{#if @model.canEdit}}
+        <button onclick={{action 'enable' @model}} type="button" class="link" data-test-enable=true>
           Enable
         </button>
       {{/if}}
     </AlertBanner>
   {{/if}}
-  <InfoTableRow @label="Name" @value={{model.name}} @data-test-identity-item-name={{true}} />
-  <InfoTableRow @label="Type" @value={{model.type}} />
-  <InfoTableRow @label="ID" @value={{model.id}} />
-  <InfoTableRow @label="Merged Ids" @value={{model.mergedEntityIds}}>
+  <InfoTableRow @label="Name" @value={{@model.name}} @data-test-identity-item-name={{true}} />
+  <InfoTableRow @label="Type" @value={{@model.type}} />
+  <InfoTableRow @label="ID" @value={{@model.id}} />
+  <InfoTableRow @label="Merged Ids" @value={{@model.mergedEntityIds}}>
     <div>
-      {{#each model.mergedEntityIds as |id|}}
+      {{#each @model.mergedEntityIds as |id|}}
         <div>
           <code class="has-text-black">{{id}}</code>
         </div>
       {{/each}}
     </div>
   </InfoTableRow>
-  <InfoTableRow @label="Created" @value={{model.creationTime}}>
-    <time datetime={{model.creationTime}} title={{model.creationTime}}>
-      {{date-format model.creationTime 'MMM dd, yyyy [at] h:mm a'}}
+  <InfoTableRow @label="Created" @value={{@model.creationTime}}>
+    <time datetime={{@model.creationTime}} title={{@model.creationTime}}>
+      {{date-format @model.creationTime 'MMM dd, yyyy [at] h:mm a'}}
     </time>
   </InfoTableRow>
   <InfoTableRow @label="Last Updated" @value={{model.lastUpdateTime}}>

ui/app/templates/components/identity/item-groups.hbs

@@ -1,17 +1,19 @@
-{{#if model.groupIds}}
-  {{#each model.directGroupIds as |gid|}}
-    <LinkTo @route="vault.cluster.access.identity.show" @models={{array "groups" gid "details"}} class="list-item-row"><Icon
+{{#if @model.groupIds}}
+  {{#each @model.directGroupIds as |gid|}}
+    <LinkTo @route="vault.cluster.access.identity.show" @models={{array "groups" gid "details"}} class="list-item-row">
+      <Icon
         @glyph="folder-outline"
         class="has-text-grey-light"
       />{{gid}}
     </LinkTo>
   {{/each}}
-  {{#each model.inheritedGroupIds as |gid|}}
+  {{#each @model.inheritedGroupIds as |gid|}}
     {{#linked-block
        "vault.cluster.access.identity.show" "groups" gid "details"
         class="list-item-row"
     }}
-      <LinkTo @route="vault.cluster.access.identity.show" @models={{array "groups" gid "details"}} class="has-text-black"><Icon
+      <LinkTo @route="vault.cluster.access.identity.show" @models={{array "groups" gid "details"}} class="has-text-black">
+        <Icon
           @glyph="folder-outline"
           class="has-text-grey-light"
         />{{gid}}
@@ -21,6 +23,6 @@
   {{/each}}
 {{else}}
   <EmptyState
-    @title="{{model.name}} is not a member of any groups."
+    @title="{{@model.name}} is not a member of any groups."
   />
 {{/if}}

ui/app/templates/components/identity/item-members.hbs

@@ -1,5 +1,5 @@
-{{#if model.hasMembers}}
-  {{#each model.memberGroupIds as |gid|}}
+{{#if @model.hasMembers}}
+  {{#each @model.memberGroupIds as |gid|}}
     {{#linked-block
       "vault.cluster.access.identity.show"
       "groups"
@@ -15,14 +15,14 @@
             />{{gid}}</LinkTo>
         </div>
         <div class="column has-text-right">
-          {{#if model.canEdit}}
-            <Identity::PopupMembers @params={{array model "memberGroupIds" gid}} />
+          {{#if @model.canEdit}}
+            <Identity::PopupMembers @params={{array @model "memberGroupIds" gid}} />
           {{/if}}
         </div>
       </div>
     {{/linked-block}}
   {{/each}}
-  {{#each model.memberEntityIds as |gid|}}
+  {{#each @model.memberEntityIds as |gid|}}
     {{#linked-block
       "vault.cluster.access.identity.show"
       "groups"
@@ -32,14 +32,19 @@
     }}
       <div class="columns">
         <div class="column is-10">
-          <LinkTo @route="vault.cluster.access.identity.show" @models={{array "entities" gid "details"}} class="is-block has-text-black has-text-weight-semibold"><Icon
+          <LinkTo
+            @route="vault.cluster.access.identity.show"
+            @models={{array "entities" gid "details"}}
+            class="is-block has-text-black has-text-weight-semibold">
+              <Icon
                 @glyph="user-square-outline"
                 class="has-text-grey-light"
-              />{{gid}}</LinkTo>
+              />{{gid}}
+          </LinkTo>
         </div>
         <div class="column has-text-right">
-          {{#if model.canEdit}}
-            <Identity::PopupMembers @params={{array model "memberEntityIds" gid}} />
+          {{#if @model.canEdit}}
+            <Identity::PopupMembers @params={{array @model "memberEntityIds" gid}} />
           {{/if}}
         </div>
       </div>

ui/app/templates/components/identity/item-metadata.hbs

@@ -1,4 +1,5 @@
-{{#each-in model.metadata as |key value|}}
+{{log "model" model this.model @model}}
+{{#each-in @model.metadata as |key value|}}
   <div class="info-table-row is-mobile">
     <div class="is-flex is-fullwidth">
       <div class="column is-one-quarter">
@@ -10,19 +11,19 @@
         {{value}}
       </div>
       <div class="column has-text-right">
-        {{#if model.canEdit}}
-          <Identity::PopupMetadata @params={{array model key}} />
+        {{#if @model.canEdit}}
+          <Identity::PopupMetadata @params={{array @model key}} />
         {{/if}}
       </div>
     </div>
   </div>
 {{else}}
   <EmptyState
-    @title="No metadata for {{model.name}}"
-    @message="You can store custom data that you want to associate with a {{lowercase (humanize model.identityType)}}. Edit this {{lowercase (humanize model.identityType)}} to get started."
+    @title="No metadata for {{@model.name}}"
+    @message="You can store custom data that you want to associate with a {{lowercase (humanize @model.identityType)}}. Edit this {{lowercase (humanize @model.identityType)}} to get started."
   >
-    <LinkTo @route="vault.cluster.access.identity.edit" @model={{model.id}} @tagName="button" class="link">
-      Edit {{lowercase (humanize model.identityType)}}
+    <LinkTo @route="vault.cluster.access.identity.edit" @model={{@model.id}} @tagName="button" class="link">
+      Edit {{lowercase (humanize @model.identityType)}}
     </LinkTo>
     <LearnLink @path="/vault/identity-access-management/iam-identity">
       Learn more

ui/app/templates/components/identity/item-parent-groups.hbs

@@ -1,5 +1,5 @@
-{{#if model.parentGroupIds.length}}
-  {{#each model.parentGroupIds as |gid|}}
+{{#if @model.parentGroupIds.length}}
+  {{#each @model.parentGroupIds as |gid|}}
     {{#linked-block
       "vault.cluster.access.identity.show"
       "groups"
@@ -9,7 +9,8 @@
     }}
       <div class="columns is-mobile">
         <div class="column is-10">
-          <LinkTo @route="vault.cluster.access.identity.show" @models={{array "groups" gid "details"}} class="is-block has-text-black has-text-weight-semibold"><Icon
+          <LinkTo @route="vault.cluster.access.identity.show" @models={{array "groups" gid "details"}} class="is-block has-text-black has-text-weight-semibold">
+            <Icon
               @glyph="folder-outline"
               class="has-text-grey-light"
             />{{gid}}

ui/app/templates/components/identity/item-policies.hbs

@@ -7,12 +7,13 @@
   }}
     <div class="columns is-mobile">
       <div class="column is-10">
-        <LinkTo @route="vault.cluster.policy.show" @models={{array "acl" policyName}} class="is-block has-text-black has-text-weight-semibold"><span class="is-underline">{{policyName}}</span>
+        <LinkTo @route="vault.cluster.policy.show" @models={{array "acl" policyName}} class="is-block has-text-black has-text-weight-semibold">
+          <span class="is-underline">{{policyName}}</span>
         </LinkTo>
       </div>
       <div class="column has-text-right">
-        {{#if model.canEdit}}
-          <Identity::PopupPolicy @params={{array model policyName}} />
+        {{#if @model.canEdit}}
+          <Identity::PopupPolicy @params={{array @model policyName}} />
         {{/if}}
       </div>
     </div>

ui/app/templates/vault/cluster/access/identity/show.hbs

@@ -21,7 +21,7 @@
   <nav class="tabs sub-nav">
     <ul>
       {{#each (tabs-for-identity-show model.identityType model.type) as |tab|}}
-        <LinkTo @route="vault.cluster.access.identity.show" @models={{array (pluralize model.identityType) model.id tab}} @tagName="li">
+        <LinkTo @route="vault.cluster.access.identity.show" @models={{array (pluralize model.identityType) model.id tab}} @tagName="li" data-test-tab-subnav={{tab}}>
           <LinkTo @route="vault.cluster.access.identity.show" @models={{array (pluralize model.identityType) model.id tab}}>
             {{capitalize (humanize tab)}}
           </LinkTo>

ui/tests/acceptance/access/identity/_shared-tests.js

@@ -1,4 +1,5 @@
-import { settled, currentRouteName } from '@ember/test-helpers';
+import { settled, currentRouteName, click, findAll } from '@ember/test-helpers';
+import { selectChoose, clickTrigger } from 'ember-power-select/test-support/helpers';
 import page from 'vault/tests/pages/access/identity/create';
 import showPage from 'vault/tests/pages/access/identity/show';
 import indexPage from 'vault/tests/pages/access/identity/index';
@@ -42,8 +43,17 @@ export const testCRUD = async (name, itemType, assert) => {
 export const testDeleteFromForm = async (name, itemType, assert) => {
   await page.visit({ item_type: itemType });
   await settled();
-  await page.editForm.name(name).submit();
-  await settled();
+  await page.editForm.name(name);
+  await page.editForm.metadataKey('hello');
+  await page.editForm.metadataValue('goodbye');
+  await clickTrigger('#policies');
+  // first option should be "default"
+  await selectChoose('#policies', '.ember-power-select-option', 0);
+  await page.editForm.submit();
+  await click('[data-test-tab-subnav="policies"]');
+  assert.equal(findAll('.list-item-row').length, 1, 'One item is under policies');
+  await click('[data-test-tab-subnav="metadata"]');
+  assert.dom('.info-table-row').hasText('hello goodbye', 'Metadata shows on tab');
   await showPage.edit();
   assert.equal(
     currentRouteName(),

ui/tests/pages/components/identity/edit-form.js

@@ -7,6 +7,8 @@ export default {
   cancelLink: clickable('[data-test-cancel-link]'),
   name: fillable('[data-test-input="name"]'),
   disabled: clickable('[data-test-input="disabled"]'),
+  metadataKey: fillable('[data-test-kv-key]'),
+  metadataValue: fillable('[data-test-kv-value]'),
   type: fillable('[data-test-input="type"]'),
   submit: clickable('[data-test-identity-submit]'),
   delete: clickable('[data-test-confirm-action-trigger]'),