refactor: 💡 add permission to read a session recording (#167)

* refactor: 💡 add permission to read a session recording

* test: 💍 remove a11yAudit from test temporarily

* refactor: 💡 add aria-label to fix allyAudit violation (#168)

* refactor: 💡 add aria-label to fix allyAudit violation

* refactor: 💡 update standalone link to icon only button

addons/core/translations/resources/en-us.yaml

@@ -216,6 +216,7 @@ session-recording:
   title_plural: Session Recordings
   details: Session details
   related: Related
+  button-aria-label: Go to session recording {id}
   connection:
     title: Connection
     title_plural: Connections

ui/admin/app/templates/scopes/scope/session-recordings/index.hbs

@@ -61,14 +61,19 @@
               </div>
             </B.Td>
             <B.Td align='right'>
-              <Hds::Link::Standalone
-                @icon='arrow-right'
-                @iconPosition='trailing'
-                @color='secondary'
-                @text=''
-                @route='scopes.scope.session-recordings.session-recording'
-                @model={{B.data.id}}
-              />
+              {{#if (can 'read session-recording' B.data)}}
+                <Hds::Button
+                  @icon='arrow-right'
+                  @isIconOnly={{true}}
+                  @color='secondary'
+                  @text={{t
+                    'resources.session-recording.button-aria-label'
+                    id=B.data.id
+                  }}
+                  @route='scopes.scope.session-recordings.session-recording'
+                  @model={{B.data.id}}
+                />
+              {{/if}}
             </B.Td>
           </B.Tr>
         </:body>

ui/admin/tests/acceptance/session-recordings/list-test.js

@@ -10,8 +10,6 @@ module('Acceptance | session recordings | list', function (hooks) {
   setupMirage(hooks);
 
   // Selectors
-  const LIST_SESSION_RECORDING_BUTTON =
-    'table > tbody > tr > td:last-child > a';
   const SESSION_RECORDING_TITLE = 'Session Recordings';
 
   // Instances
@@ -83,15 +81,4 @@ module('Acceptance | session recordings | list', function (hooks) {
     assert.dom('[title="General"]').doesNotIncludeText(SESSION_RECORDING_TITLE);
     assert.dom(`[href="${urls.sessionRecordings}"]`).doesNotExist();
   });
-
-  // TODO: When we add abilities to session-recordings this test will be refactor to account for it.
-  test('user can navigate to a session recording', async function (assert) {
-    assert.expect(2);
-    // Visit session recordings
-    await visit(urls.sessionRecordings);
-    assert.dom('table').hasClass('hds-table');
-    // Click a session recording and check it navigates properly
-    await click(LIST_SESSION_RECORDING_BUTTON);
-    assert.strictEqual(currentURL(), urls.sessionRecording);
-  });
 });

ui/admin/tests/acceptance/session-recordings/read-test.js

@@ -2,13 +2,16 @@ import { module, test } from 'qunit';
 import { visit, currentURL, click } from '@ember/test-helpers';
 import { setupApplicationTest } from 'admin/tests/helpers';
 import setupMirage from 'ember-cli-mirage/test-support/setup-mirage';
+import a11yAudit from 'ember-a11y-testing/test-support/audit';
 import { authenticateSession } from 'ember-simple-auth/test-support';
 
-module('Acceptance | session recordings | session recording', function (hooks) {
+module('Acceptance | session recordings | read', function (hooks) {
   setupApplicationTest(hooks);
   setupMirage(hooks);
 
   // Selectors
+  const LIST_SESSION_RECORDING_BUTTON =
+    'table > tbody > tr > td:last-child > a';
   const LIST_CHANNEL_RECORDING_BUTTON =
     'table > tbody > tr > td:last-child > a';
 
@@ -50,14 +53,43 @@ module('Acceptance | session recordings | session recording', function (hooks) {
     authenticateSession({});
   });
 
-  test('user can navigate to a session recording', async function (assert) {
+  test('visiting a session recording', async function (assert) {
     assert.expect(1);
+    // Visit session recordings
+    await visit(urls.sessionRecordings);
+    await a11yAudit();
+
+    // Click a session recording and check it navigates properly
+    await click(LIST_SESSION_RECORDING_BUTTON);
+    await a11yAudit();
 
-    // Visit session recording
-    await visit(urls.sessionRecording);
     assert.strictEqual(currentURL(), urls.sessionRecording);
   });
 
+  test('user can navigate to a session recording with proper authorization', async function (assert) {
+    assert.expect(3);
+    // Visit session recordings
+    await visit(urls.sessionRecordings);
+
+    assert.true(instances.sessionRecording.authorized_actions.includes('read'));
+    assert.dom(`[href="${urls.sessionRecording}"]`).exists();
+    // Click a session recording and check it navigates properly
+    await click(LIST_SESSION_RECORDING_BUTTON);
+    assert.strictEqual(currentURL(), urls.sessionRecording);
+  });
+
+  test('user cannot navigate to a session recording without the read action', async function (assert) {
+    assert.expect(1);
+    instances.sessionRecording.authorized_actions =
+      instances.sessionRecording.authorized_actions.filter(
+        (item) => item !== 'read'
+      );
+
+    // Visit session recordings
+    await visit(urls.sessionRecordings);
+    assert.dom(LIST_SESSION_RECORDING_BUTTON).doesNotExist();
+  });
+
   test('user can navigate to a channel recording', async function (assert) {
     assert.expect(2);