From b79eebf73a8b4ce9ab3f213217acc761f6dbc7fe Mon Sep 17 00:00:00 2001 From: Dharini Jeeva Date: Mon, 8 Jan 2024 15:12:49 -0800 Subject: [PATCH] feat: storage policies list view (#2071) policies list view --- addons/api/addon/abilities/policy.js | 46 +++++ addons/api/app/abilities/policy.js | 6 + addons/api/mirage/factories/policy.js | 4 +- addons/core/addon/helpers/format-day-year.js | 35 ++++ addons/core/app/helpers/format-day-year.js | 6 + .../helpers/format-day-year-test.js | 38 ++++ addons/core/translations/en-us.yaml | 3 + addons/core/translations/resources/en-us.yaml | 12 ++ ui/admin/app/routes/scopes/scope/policies.js | 28 ++- .../app/routes/scopes/scope/policies/index.js | 10 +- .../app/routes/scopes/scope/policies/new.js | 1 + .../routes/scopes/scope/policies/policy.js | 21 +- .../templates/scopes/scope/policies/index.hbs | 139 ++++++++++++- ui/admin/tests/acceptance/policy/list-test.js | 195 ++++++++++++++++++ 14 files changed, 538 insertions(+), 6 deletions(-) create mode 100644 addons/api/addon/abilities/policy.js create mode 100644 addons/api/app/abilities/policy.js create mode 100644 addons/core/addon/helpers/format-day-year.js create mode 100644 addons/core/app/helpers/format-day-year.js create mode 100644 addons/core/tests/integration/helpers/format-day-year-test.js create mode 100644 ui/admin/tests/acceptance/policy/list-test.js diff --git a/addons/api/addon/abilities/policy.js b/addons/api/addon/abilities/policy.js new file mode 100644 index 000000000..f34f8c7d2 --- /dev/null +++ b/addons/api/addon/abilities/policy.js @@ -0,0 +1,46 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +import ModelAbility from './model'; +import { service } from '@ember/service'; + +/** + * Provides abilities for storage policies. + */ +export default class PolicyAbility extends ModelAbility { + // =services + @service features; + // =permissions + + /** + * This ensures that storage policies may be read only if the + * session-recording feature flag is enabled. + */ + get canRead() { + return this.features.isEnabled('ssh-session-recording') + ? super.canRead + : false; + } + + /** + * This ensures that storage policies may be updated only if the + * session-recording feature flag is enabled. + */ + get canUpdate() { + return this.features.isEnabled('ssh-session-recording') + ? super.canUpdate + : false; + } + + /** + * This ensures that storage policies may be deleted only if the + * session-recording feature flag is enabled. + */ + get canDelete() { + return this.features.isEnabled('ssh-session-recording') + ? super.canDelete + : false; + } +} diff --git a/addons/api/app/abilities/policy.js b/addons/api/app/abilities/policy.js new file mode 100644 index 000000000..5ce53b548 --- /dev/null +++ b/addons/api/app/abilities/policy.js @@ -0,0 +1,6 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +export { default } from 'api/abilities/policy'; diff --git a/addons/api/mirage/factories/policy.js b/addons/api/mirage/factories/policy.js index f17d94e0b..88ea7a2dc 100644 --- a/addons/api/mirage/factories/policy.js +++ b/addons/api/mirage/factories/policy.js @@ -22,12 +22,12 @@ export default factory.extend({ attributes() { return { retain_for: { - days: faker.number.int({ min: 10, max: 700 }), + days: faker.number.int({ min: 10, max: 100 }), overridable: faker.datatype.boolean(), }, delete_after: { - days: faker.number.int({ min: 1, max: 500 }), + days: faker.number.int({ min: 101, max: 500 }), overridable: faker.datatype.boolean(), }, }; diff --git a/addons/core/addon/helpers/format-day-year.js b/addons/core/addon/helpers/format-day-year.js new file mode 100644 index 000000000..352f8a2ec --- /dev/null +++ b/addons/core/addon/helpers/format-day-year.js @@ -0,0 +1,35 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +import Helper from '@ember/component/helper'; +import { inject as service } from '@ember/service'; + +/** + * Takes a `Day` instance and returns in year format if there are no remainders, + * * @example + * {{format-day-year number}} + * + **/ +export default class extends Helper { + // =services + @service intl; + + // =compute method + + /** + * @param {number} days + * @return string + */ + + compute([days]) { + const remainder = days % 365; + if (remainder === 0) { + const numberOfYears = days / 365; + return this.intl.t('titles.year', { numberOfYears }); + } else { + return this.intl.t('titles.days', { days }); + } + } +} diff --git a/addons/core/app/helpers/format-day-year.js b/addons/core/app/helpers/format-day-year.js new file mode 100644 index 000000000..a455e4f32 --- /dev/null +++ b/addons/core/app/helpers/format-day-year.js @@ -0,0 +1,6 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +export { default } from 'core/helpers/format-day-year'; diff --git a/addons/core/tests/integration/helpers/format-day-year-test.js b/addons/core/tests/integration/helpers/format-day-year-test.js new file mode 100644 index 000000000..728aae242 --- /dev/null +++ b/addons/core/tests/integration/helpers/format-day-year-test.js @@ -0,0 +1,38 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +import { module, test } from 'qunit'; +import { setupRenderingTest } from 'ember-qunit'; +import { render } from '@ember/test-helpers'; +import { hbs } from 'ember-cli-htmlbars'; +import { setupIntl } from 'ember-intl/test-support'; + +module('Integration | Helper | format-day-year', function (hooks) { + setupRenderingTest(hooks); + setupIntl(hooks); + + test('it renders correctly when it is 1 year', async function (assert) { + this.set('inputValue', 365); + await render(hbs`{{format-day-year this.inputValue}}`); + assert.strictEqual(this.element.textContent.trim(), '1 year'); + }); + + test('it renders correctly when it is more than 1 year', async function (assert) { + this.set('inputValue', 730); + await render(hbs`{{format-day-year this.inputValue}}`); + assert.strictEqual(this.element.textContent.trim(), '2 years'); + }); + + test('it renders correctly when it is not a whole year', async function (assert) { + this.set('inputValue', 800); + await render(hbs`{{format-day-year this.inputValue}}`); + assert.strictEqual(this.element.textContent.trim(), '800 days'); + }); + test('it renders when null', async function (assert) { + this.set('inputValue', null); + await render(hbs`{{format-date-iso this.inputValue}}`); + assert.strictEqual(this.element.textContent.trim(), ''); + }); +}); diff --git a/addons/core/translations/en-us.yaml b/addons/core/translations/en-us.yaml index 97bfa823d..2af1f30dc 100644 --- a/addons/core/translations/en-us.yaml +++ b/addons/core/translations/en-us.yaml @@ -38,6 +38,9 @@ titles: create-resources: Create Resources choose-an-option: Choose an option feature-edition: 'Edition: {edition}' + unit: Unit + year: '{numberOfYears, plural, =1 {# year} other {# years}}' + days: '{days, plural, =1 {# day} other {# days}}' descriptions: empty-set: There are no items to display yet. You may be able to add items or try back later. cluster-url-initialization: To get started, please enter your cluster URL diff --git a/addons/core/translations/resources/en-us.yaml b/addons/core/translations/resources/en-us.yaml index 46ea6b1a5..90aac18f9 100644 --- a/addons/core/translations/resources/en-us.yaml +++ b/addons/core/translations/resources/en-us.yaml @@ -920,3 +920,15 @@ policy: title_plural: Storage Policies titles: new: New Storage Policy + policy_name: Policy name + retain_for: Retain for + delete_after: Delete After + do_not_delete: Do not delete + forever: Forever + actions: + delete: Delete Storage Policy + messages: + none: + title: No storage policies yet + description: Storage policies define how long to store recordings before they are automatically deleted. We recommend checking your data retention policies for compliance requirements. + link: Create a new storage policy diff --git a/ui/admin/app/routes/scopes/scope/policies.js b/ui/admin/app/routes/scopes/scope/policies.js index dd6416002..c8fcbeddb 100644 --- a/ui/admin/app/routes/scopes/scope/policies.js +++ b/ui/admin/app/routes/scopes/scope/policies.js @@ -5,16 +5,29 @@ import Route from '@ember/routing/route'; import { inject as service } from '@ember/service'; +import { action } from '@ember/object'; +import { loading } from 'ember-loading'; +import { confirm } from 'core/decorators/confirm'; +import { notifySuccess, notifyError } from 'core/decorators/notify'; export default class ScopesScopePoliciesRoute extends Route { // =services @service store; @service can; + @service session; // =methods + /** - * Load all policies under current scope + * If arriving here unauthenticated, redirect to index for further processing. + */ + beforeModel() { + if (!this.session.isAuthenticated) this.router.transitionTo('index'); + } + + /** + * Load all storage policies under current scope * @return {Promise<[PolicyModel]>} */ async model() { @@ -29,4 +42,17 @@ export default class ScopesScopePoliciesRoute extends Route { return this.store.query('policy', { scope_id }); } } + + /** + * Deletes the policy. + * @param {PolicyModel} policy + */ + @action + @loading + @confirm('questions.delete-confirm') + @notifyError(({ message }) => message, { catch: true }) + @notifySuccess('notifications.delete-success') + async delete(policy) { + await policy.destroyRecord(); + } } diff --git a/ui/admin/app/routes/scopes/scope/policies/index.js b/ui/admin/app/routes/scopes/scope/policies/index.js index 1d8d75223..e38ecc4a8 100644 --- a/ui/admin/app/routes/scopes/scope/policies/index.js +++ b/ui/admin/app/routes/scopes/scope/policies/index.js @@ -5,4 +5,12 @@ import Route from '@ember/routing/route'; -export default class ScopesScopePoliciesIndexRoute extends Route {} +export default class ScopesScopePoliciesIndexRoute extends Route { + // =methods + + setupController(controller) { + const scope = this.modelFor('scopes.scope'); + super.setupController(...arguments); + controller.setProperties({ scope }); + } +} diff --git a/ui/admin/app/routes/scopes/scope/policies/new.js b/ui/admin/app/routes/scopes/scope/policies/new.js index 949ff3e2d..dd76d3a87 100644 --- a/ui/admin/app/routes/scopes/scope/policies/new.js +++ b/ui/admin/app/routes/scopes/scope/policies/new.js @@ -6,4 +6,5 @@ import Route from '@ember/routing/route'; export default class ScopesScopePoliciesNewRoute extends Route { + // =services } diff --git a/ui/admin/app/routes/scopes/scope/policies/policy.js b/ui/admin/app/routes/scopes/scope/policies/policy.js index 178b8b188..d5dd768fe 100644 --- a/ui/admin/app/routes/scopes/scope/policies/policy.js +++ b/ui/admin/app/routes/scopes/scope/policies/policy.js @@ -4,5 +4,24 @@ */ import Route from '@ember/routing/route'; +import { inject as service } from '@ember/service'; -export default class ScopesScopePoliciesPolicyRoute extends Route {} +export default class ScopesScopePoliciesPolicyRoute extends Route { + @service store; + @service can; + @service router; + + // =methods + + /** + * Load a policy in current scope. + * @param {object} params + * @param {string} params.policy_id + * @return {Promise{PolicyModel}} + */ + async model({ policy_id }) { + return this.store.findRecord('policy', policy_id, { + reload: true, + }); + } +} diff --git a/ui/admin/app/templates/scopes/scope/policies/index.hbs b/ui/admin/app/templates/scopes/scope/policies/index.hbs index 84db34bfe..ce799b60b 100644 --- a/ui/admin/app/templates/scopes/scope/policies/index.hbs +++ b/ui/admin/app/templates/scopes/scope/policies/index.hbs @@ -10,7 +10,144 @@

{{t 'resources.policy.title_plural'}} + {{! TODO: Add doc link here }}

-

{{t 'resources.policy.description'}}

+ + {{#if (can 'create model' this.scope collection='policies')}} + {{#if @model}} + + {{/if}} + {{/if}} + + + {{#if @model}} + + <:body as |B|> + + + {{#if (can 'read policy' B.data)}} + + {{B.data.displayName}} + + {{else}} + {{B.data.displayName}} + {{/if}} + {{#if B.data.description}} +

{{B.data.description}}

+ {{/if}} +
+ + {{#if B.data.scopeModel.isGlobal}} + + {{else}} + + {{/if}} + + + {{#if B.data.retain_for.days}} + {{format-day-year B.data.retain_for.days}} + {{else}} + {{t 'resources.policy.titles.forever'}} + {{/if}} + + + {{#if B.data.delete_after.days}} + {{format-day-year B.data.delete_after.days}} + {{else}} + {{t 'resources.policy.titles.do_not_delete'}} + {{/if}} + + + {{#let + (hash + canRead=(can 'read policy' B.data) + canDelete=(can 'delete policy' B.data) + ) + as |perms| + }} + {{#if (or perms.canRead perms.canDelete)}} + + + {{#if perms.canRead}} + + {{/if}} + {{#if (and perms.canRead perms.canDelete)}} + + {{/if}} + {{#if perms.canDelete}} + + {{/if}} + + {{/if}} + {{/let}} + +
+ +
+ {{else}} + + + + {{#if (can 'list model' this.scope collection='policies')}} + {{t 'resources.policy.messages.none.description'}} + {{else if (can 'create model' this.scope collection='policies')}} + {{t + 'descriptions.create-but-not-list' + resource=(t 'resources.policy.title_plural') + }} + {{else}} + {{t + 'descriptions.neither-list-nor-create' + resource=(t 'resources.policy.title_plural') + }} + {{/if}} + + {{#if (can 'create model' this.scope collection='policies')}} + + {{/if}} + + + {{/if}} +
\ No newline at end of file diff --git a/ui/admin/tests/acceptance/policy/list-test.js b/ui/admin/tests/acceptance/policy/list-test.js new file mode 100644 index 000000000..6977a41b8 --- /dev/null +++ b/ui/admin/tests/acceptance/policy/list-test.js @@ -0,0 +1,195 @@ +/** + * Copyright (c) HashiCorp, Inc. + * SPDX-License-Identifier: MPL-2.0 + */ + +import { module, test } from 'qunit'; +import { visit, click, currentURL, find } from '@ember/test-helpers'; +import { setupApplicationTest } from 'admin/tests/helpers'; +import setupMirage from 'ember-cli-mirage/test-support/setup-mirage'; +import { authenticateSession } from 'ember-simple-auth/test-support'; + +module('Acceptance | policies | list', function (hooks) { + setupApplicationTest(hooks); + setupMirage(hooks); + + let featuresService; + let intl; + + const STORAGE_POLICY_TITLE = 'Storage Policies'; + const MESSAGE_DESCRIPTION_SELECTOR = '.rose-message-description'; + const MESSAGE_LINK_SELECTOR = '.rose-message-body .hds-link-standalone'; + const DROPDOWN_BUTTON_SELECTOR = '.hds-dropdown-toggle-icon'; + const DROPDOWN_ITEM_SELECTOR = '.hds-dropdown-list-item a'; + + const instances = { + scopes: { + global: null, + org: null, + }, + policy: null, + }; + + const urls = { + globalScope: null, + policies: null, + policy: null, + }; + + hooks.beforeEach(function () { + instances.scopes.global = this.server.create('scope', { id: 'global' }); + instances.scopes.org = this.server.create('scope', { + type: 'org', + scope: { id: 'global', type: 'global' }, + }); + urls.globalScope = `/scopes/global`; + urls.policies = `${urls.globalScope}/policies`; + + intl = this.owner.lookup('service:intl'); + + authenticateSession({}); + featuresService = this.owner.lookup('service:features'); + }); + + test('users can navigate to policies with proper authorization', async function (assert) { + featuresService.enable('ssh-session-recording'); + await visit(urls.globalScope); + + assert.true( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('list'), + ); + assert.true( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('create'), + ); + assert.dom(`[href="${urls.policies}"]`).exists(); + + await click(`[href="${urls.policies}"]`); + + assert + .dom(MESSAGE_DESCRIPTION_SELECTOR) + .hasText(intl.t('resources.policy.messages.none.description')); + assert.dom(MESSAGE_LINK_SELECTOR).exists(); + }); + + test('user cannot navigate to index without either list or create actions', async function (assert) { + featuresService.enable('ssh-session-recording'); + + instances.scopes.global.authorized_collection_actions['policies'] = []; + + await visit(urls.globalScope); + + assert.false( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('list'), + ); + assert.false( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('create'), + ); + assert + .dom('[title="General"] a:nth-of-type(3)') + .doesNotIncludeText(STORAGE_POLICY_TITLE); + + await visit(urls.policies); + + assert.dom(MESSAGE_DESCRIPTION_SELECTOR).hasText( + intl.t('descriptions.neither-list-nor-create', { + resource: STORAGE_POLICY_TITLE, + }), + ); + assert.dom(MESSAGE_LINK_SELECTOR).doesNotExist(); + }); + + test('user can navigate to index with only create action', async function (assert) { + featuresService.enable('ssh-session-recording'); + + instances.scopes.global.authorized_collection_actions['policies'] = + instances.scopes.global.authorized_collection_actions['policies'].filter( + (item) => item !== 'list', + ); + + await visit(urls.globalScope); + + assert.false( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('list'), + ); + assert.true( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('create'), + ); + assert.dom(`[href="${urls.policies}"]`).exists(); + + await click(`[href="${urls.policies}"]`); + + assert.dom(MESSAGE_DESCRIPTION_SELECTOR).hasText( + intl.t('descriptions.create-but-not-list', { + resource: STORAGE_POLICY_TITLE, + }), + ); + assert.dom(MESSAGE_LINK_SELECTOR).exists(); + }); + + test('user can navigate to index with only list action', async function (assert) { + featuresService.enable('ssh-session-recording'); + + instances.scopes.global.authorized_collection_actions['policies'] = + instances.scopes.global.authorized_collection_actions['policies'].filter( + (item) => item !== 'create', + ); + + await visit(urls.globalScope); + + assert.true( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('list'), + ); + assert.false( + instances.scopes.global.authorized_collection_actions[ + 'policies' + ].includes('create'), + ); + assert.dom(`[href="${urls.policies}"]`).exists(); + + await click(`[href="${urls.policies}"]`); + + assert + .dom(MESSAGE_DESCRIPTION_SELECTOR) + .hasText(intl.t('resources.policy.messages.none.description')); + assert.dom(MESSAGE_LINK_SELECTOR).doesNotExist(); + }); + + test('user cannot navigate to index when feature is disabled', async function (assert) { + await visit(urls.globalScope); + + assert.false(featuresService.isEnabled('ssh-session-recording')); + + assert.notOk(find(`[href="${urls.policies}"]`)); + }); + + test('edit action in table directs user to appropriate page', async function (assert) { + featuresService.enable('ssh-session-recording'); + await visit(urls.globalScope); + instances.policy = this.server.create('policy', { + scope: instances.scopes.global, + }); + urls.policy = `${urls.policies}/${instances.policy.id}`; + + await click(`[href="${urls.policies}"]`); + await click(DROPDOWN_BUTTON_SELECTOR); + + assert.dom(DROPDOWN_ITEM_SELECTOR).exists(); + assert.dom(DROPDOWN_ITEM_SELECTOR).hasText('Edit'); + await click(DROPDOWN_ITEM_SELECTOR); + assert.strictEqual(currentURL(), urls.policy); + }); +});