forked from hashicorp/vault
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
UI: PKI Read Role Details (hashicorp#17985)
- Loading branch information
Showing
12 changed files
with
258 additions
and
9 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,98 @@ | ||
<PageHeader as |p|> | ||
<p.top> | ||
{{! TODO: This should be replaced with HDS::Breadcrumbs }} | ||
<nav class="key-value-header breadcrumb" aria-label="breadcrumbs" data-test-breadcrumbs="role-details"> | ||
<ul> | ||
<li> | ||
<span class="sep">/</span> | ||
<LinkToExternal @route="secrets">secrets</LinkToExternal> | ||
</li> | ||
{{#each this.breadcrumbs as |breadcrumb|}} | ||
<li> | ||
<span class="sep">/</span> | ||
{{#if breadcrumb.path}} | ||
<LinkTo @route={{breadcrumb.path}}> | ||
{{breadcrumb.label}} | ||
</LinkTo> | ||
{{else}} | ||
{{breadcrumb.label}} | ||
{{/if}} | ||
</li> | ||
{{/each}} | ||
</ul> | ||
</nav> | ||
</p.top> | ||
<p.levelLeft> | ||
<h1 class="title is-3" data-test-role-details-title> | ||
<Icon @name="file-text" @size="24" class="has-text-grey-light" /> | ||
PKI Role | ||
<code>{{@role.name}}</code> | ||
</h1> | ||
</p.levelLeft> | ||
</PageHeader> | ||
<Toolbar> | ||
<ToolbarActions> | ||
<ConfirmAction | ||
@buttonClasses="toolbar-link" | ||
@onConfirmAction={{this.deleteRole}} | ||
@confirmTitle="Delete role?" | ||
@confirmButtonText="Delete" | ||
data-test-pki-role-delete | ||
> | ||
Delete | ||
</ConfirmAction> | ||
<div class="toolbar-separator"></div> | ||
<LinkTo class="toolbar-link" @route="overview">Generate Certificate <Icon @name="chevron-right" /></LinkTo> | ||
<LinkTo class="toolbar-link" @route="overview">Sign Certificate <Icon @name="chevron-right" /></LinkTo> | ||
<LinkTo class="toolbar-link" @route="roles.role.edit" @model={{@role.id}}>Edit <Icon @name="chevron-right" /></LinkTo> | ||
</ToolbarActions> | ||
</Toolbar> | ||
{{#each @role.fieldGroups as |fg|}} | ||
{{#each-in fg as |group fields|}} | ||
{{#if (not-eq group "default")}} | ||
<h3 class="is-size-4 has-text-semibold has-top-margin-m">{{group}}</h3> | ||
{{/if}} | ||
{{#each fields as |attr|}} | ||
{{#let (get @role attr.name) as |val|}} | ||
{{#if (eq attr.name "issuerRef")}} | ||
<InfoTableRow | ||
@label={{capitalize (or attr.options.detailsLabel attr.options.label (humanize (dasherize attr.name)))}} | ||
@value={{val}} | ||
@alwaysRender={{true}} | ||
> | ||
<LinkTo @route="issuers.issuer.details" @model={{val}}>{{val}}</LinkTo> | ||
</InfoTableRow> | ||
{{else if (includes attr.name this.arrayAttrs)}} | ||
<InfoTableRow | ||
@label={{capitalize (or attr.options.detailsLabel attr.options.label (humanize (dasherize attr.name)))}} | ||
@value={{val}} | ||
@alwaysRender={{true}} | ||
> | ||
{{#if (gt val.length 0)}} | ||
{{#each val as |key|}} | ||
<span>{{key}},</span> | ||
{{/each}} | ||
{{else}} | ||
None | ||
{{/if}} | ||
</InfoTableRow> | ||
{{else if (eq attr.name "noStore")}} | ||
<InfoTableRow | ||
@label={{capitalize (or attr.options.detailsLabel attr.options.label (humanize (dasherize attr.name)))}} | ||
@value={{not val}} | ||
@alwaysRender={{true}} | ||
/> | ||
{{else}} | ||
<InfoTableRow | ||
@label={{capitalize (or attr.options.detailsLabel attr.options.label (humanize (dasherize attr.name)))}} | ||
@value={{val}} | ||
@alwaysRender={{true}} | ||
@formatDate={{eq attr.name "customTtl"}} | ||
@type={{or attr.type attr.options.type}} | ||
@defaultShown={{attr.options.defaultShown}} | ||
/> | ||
{{/if}} | ||
{{/let}} | ||
{{/each}} | ||
{{/each-in}} | ||
{{/each}} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
import { action } from '@ember/object'; | ||
import Component from '@glimmer/component'; | ||
|
||
// interface Attribute { | ||
// name: string; | ||
// options?: { | ||
// label?: string; | ||
// }; | ||
// } | ||
|
||
// TODO: pull this in from route model once it's TS | ||
interface Args { | ||
role: { | ||
backend: string; | ||
id: string; | ||
}; | ||
} | ||
|
||
export default class DetailsPage extends Component<Args> { | ||
get breadcrumbs() { | ||
return [ | ||
{ label: this.args.role.backend || 'pki', path: 'overview' }, | ||
{ label: 'roles', path: 'roles.index' }, | ||
{ label: this.args.role.id }, | ||
]; | ||
} | ||
|
||
get arrayAttrs() { | ||
return ['keyUsage', 'extKeyUsage', 'extKeyUsageOids']; | ||
} | ||
|
||
@action deleteRole() { | ||
// TODO: delete role | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,11 @@ | ||
import Route from '@ember/routing/route'; | ||
import PkiRolesIndexRoute from '../index'; | ||
|
||
export default class PkiRoleDetailsRoute extends Route {} | ||
export default class RolesRoleDetailsRoute extends PkiRolesIndexRoute { | ||
model() { | ||
const { role } = this.paramsFor('roles/role'); | ||
return this.store.queryRecord('pki/role', { | ||
backend: this.secretMountPath.currentPath, | ||
id: role, | ||
}); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1 @@ | ||
roles.role.details | ||
<PkiRoleDetailsPage @role={{this.model}} /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
export const SELECTORS = { | ||
breadcrumbContainer: '[data-test-breadcrumbs="role-details"]', | ||
breadcrumbs: '[data-test-breadcrumbs="role-details"] li', | ||
title: '[data-test-role-details-title]', | ||
issuerLabel: '[data-test-row-label="Issuer"]', | ||
noStoreValue: '[data-test-value-div="Store in storage backend"]', | ||
keyUsageValue: '[data-test-value-div="Key usage"]', | ||
extKeyUsageValue: '[data-test-value-div="Ext key usage"]', | ||
}; |
42 changes: 42 additions & 0 deletions
42
ui/tests/integration/components/pki/page-role-detail-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
import { module, test } from 'qunit'; | ||
import { setupRenderingTest } from 'ember-qunit'; | ||
import { render } from '@ember/test-helpers'; | ||
import { hbs } from 'ember-cli-htmlbars'; | ||
import { setupEngine } from 'ember-engines/test-support'; | ||
import { SELECTORS } from 'vault/tests/helpers/pki/page-role-details'; | ||
|
||
module('Integration | Component | pki role details page', function (hooks) { | ||
setupRenderingTest(hooks); | ||
setupEngine(hooks, 'pki'); | ||
|
||
hooks.beforeEach(function () { | ||
this.store = this.owner.lookup('service:store'); | ||
this.model = this.store.createRecord('pki/role', { | ||
name: 'Foobar', | ||
noStore: false, | ||
keyUsage: [], | ||
extKeyUsage: ['bar', 'baz'], | ||
}); | ||
this.model.backend = 'pki'; | ||
}); | ||
|
||
test('it should render the page component', async function (assert) { | ||
assert.expect(7); | ||
await render( | ||
hbs` | ||
<PkiRoleDetailsPage @role={{this.model}} /> | ||
`, | ||
{ owner: this.engine } | ||
); | ||
assert.dom(SELECTORS.breadcrumbContainer).exists({ count: 1 }, 'breadcrumb containers exist'); | ||
assert.dom(SELECTORS.breadcrumbs).exists({ count: 4 }, 'Shows 4 breadcrumbs'); | ||
assert.dom(SELECTORS.title).containsText('PKI Role Foobar', 'Title includes type and name of role'); | ||
// Attribute-specific checks | ||
assert.dom(SELECTORS.issuerLabel).hasText('Issuer', 'Label is'); | ||
assert.dom(SELECTORS.keyUsageValue).hasText('None', 'Key usage shows none when array is empty'); | ||
assert | ||
.dom(SELECTORS.extKeyUsageValue) | ||
.hasText('bar, baz,', 'Key usage shows comma-joined values when array has items'); | ||
assert.dom(SELECTORS.noStoreValue).containsText('Yes', 'noStore shows opposite of what the value is'); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters