feat: storage policies list view (#2071)

policies list view

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();
+  }
 }

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 });
+  }
+}

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
 }

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,
+    });
+  }
+}

ui/admin/app/templates/scopes/scope/policies/index.hbs

@@ -10,7 +10,144 @@
   <page.header>
     <h2>
       {{t 'resources.policy.title_plural'}}
+      {{! TODO: Add doc link here }}
     </h2>
-    <p>{{t 'resources.policy.description'}}</p>
   </page.header>
+  <page.actions>
+    {{#if (can 'create model' this.scope collection='policies')}}
+      {{#if @model}}
+        <Hds::Button
+          @route='scopes.scope.policies.new'
+          @text={{t 'resources.policy.titles.new'}}
+        />
+      {{/if}}
+    {{/if}}
+  </page.actions>
+  <page.body>
+    {{#if @model}}
+      <Hds::Table
+        @valign='middle'
+        @model={{@model}}
+        @columns={{array
+          (hash label=(t 'resources.policy.titles.policy_name'))
+          (hash label=(t 'resources.scope.title'))
+          (hash label=(t 'resources.policy.titles.retain_for'))
+          (hash label=(t 'resources.policy.titles.delete_after'))
+          (hash label='')
+        }}
+      >
+        <:body as |B|>
+          <B.Tr>
+            <B.Td>
+              {{#if (can 'read policy' B.data)}}
+                <LinkTo
+                  @route='scopes.scope.policies.policy'
+                  @model={{B.data.id}}
+                >
+                  {{B.data.displayName}}
+                </LinkTo>
+              {{else}}
+                {{B.data.displayName}}
+              {{/if}}
+              {{#if B.data.description}}
+                <p>{{B.data.description}}</p>
+              {{/if}}
+            </B.Td>
+            <B.Td>
+              {{#if B.data.scopeModel.isGlobal}}
+                <Hds::Badge @text={{t 'titles.global'}} @icon='globe' />
+              {{else}}
+                <Hds::Badge
+                  @text={{B.data.scopeModel.displayName}}
+                  @icon='org'
+                />
+              {{/if}}
+            </B.Td>
+            <B.Td>
+              {{#if B.data.retain_for.days}}
+                {{format-day-year B.data.retain_for.days}}
+              {{else}}
+                {{t 'resources.policy.titles.forever'}}
+              {{/if}}
+            </B.Td>
+            <B.Td>
+              {{#if B.data.delete_after.days}}
+                {{format-day-year B.data.delete_after.days}}
+              {{else}}
+                {{t 'resources.policy.titles.do_not_delete'}}
+              {{/if}}
+            </B.Td>
+            <B.Td>
+              {{#let
+                (hash
+                  canRead=(can 'read policy' B.data)
+                  canDelete=(can 'delete policy' B.data)
+                )
+                as |perms|
+              }}
+                {{#if (or perms.canRead perms.canDelete)}}
+                  <Hds::Dropdown as |dd|>
+                    <dd.ToggleIcon
+                      @icon='more-horizontal'
+                      @text={{t 'actions.manage'}}
+                      @hasChevron={{false}}
+                      @size='small'
+                    />
+                    {{#if perms.canRead}}
+                      <dd.Interactive
+                        @route='scopes.scope.policies.policy'
+                        @model={{B.data.id}}
+                        @text={{t 'actions.edit'}}
+                      />
+                    {{/if}}
+                    {{#if (and perms.canRead perms.canDelete)}}
+                      <dd.Separator />
+                    {{/if}}
+                    {{#if perms.canDelete}}
+                      <dd.Interactive
+                        @text={{t 'resources.policy.actions.delete'}}
+                        @color='critical'
+                        {{on 'click' (route-action 'delete' B.data)}}
+                      />
+                    {{/if}}
+                  </Hds::Dropdown>
+                {{/if}}
+              {{/let}}
+            </B.Td>
+          </B.Tr>
+        </:body>
+      </Hds::Table>
+    {{else}}
+      <Rose::Layout::Centered>
+        <Rose::Message
+          @title={{t 'resources.policy.messages.none.title'}}
+          as |message|
+        >
+          <message.description>
+            {{#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}}
+          </message.description>
+          {{#if (can 'create model' this.scope collection='policies')}}
+            <Hds::Link::Standalone
+              @icon='plus-circle'
+              @iconPosition='leading'
+              @route='scopes.scope.policies.new'
+              @text={{t 'resources.policy.messages.none.link'}}
+            />
+          {{/if}}
+        </Rose::Message>
+      </Rose::Layout::Centered>
+    {{/if}}
+  </page.body>
 </Rose::Layout::Page>

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);
+  });
+});