From 502f04d02a46cbcaaf366ac692c990f4bb25c5cf Mon Sep 17 00:00:00 2001
From: Carlos Alcaide Corvo <ccorvo@hashicorp.com>
Date: Tue, 28 Mar 2023 09:48:22 -0700
Subject: [PATCH] =?UTF-8?q?refactor:=20=F0=9F=92=A1=20Add=20Project=20name?=
 =?UTF-8?q?=20to=20session-recordings=20list=20(#152)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* refactor: 💡 Add Project name to session-recordings list
---
 addons/api/addon/models/session-recording.js  |  4 +++
 .../unit/models/session-recording-test.js     | 34 +++++++++++++++++++
 .../scopes/scope/session-recordings/index.hbs |  7 ++++
 .../session-recordings/list-test.js           |  5 ++-
 4 files changed, 49 insertions(+), 1 deletion(-)

diff --git a/addons/api/addon/models/session-recording.js b/addons/api/addon/models/session-recording.js
index db0714b51..89ee6560d 100644
--- a/addons/api/addon/models/session-recording.js
+++ b/addons/api/addon/models/session-recording.js
@@ -27,4 +27,8 @@ export default class SessionRecordingModel extends GeneratedSessionRecordingMode
   get isUnknown() {
     return !TYPES_SESSION_RECORDING.includes(this.type);
   }
+
+  get targetScopeDisplayName() {
+    return this.target?.scope?.name || this.target?.scope?.id;
+  }
 }
diff --git a/addons/api/tests/unit/models/session-recording-test.js b/addons/api/tests/unit/models/session-recording-test.js
index ca6705d00..af61282a6 100644
--- a/addons/api/tests/unit/models/session-recording-test.js
+++ b/addons/api/tests/unit/models/session-recording-test.js
@@ -50,4 +50,38 @@ module('Unit | Model | session-recording', function (hooks) {
     const connection_recordings = await model.connection_recordings;
     assert.strictEqual(connection_recordings.length, 1);
   });
+
+  test('it has targetScopeDisplayName and returns the expected values', async function (assert) {
+    assert.expect(2);
+    const store = this.owner.lookup('service:store');
+    const fakeName = 'Scope name';
+    const fakeId = 's_123456789';
+    // Scope models: A has just name, B has just id.
+    const scopeModelA = await store.createRecord('scope', {
+      type: 'global',
+      name: fakeName,
+      id: 's_1234567890',
+    });
+    const scopeModelB = await store.createRecord('scope', {
+      type: 'org',
+      id: fakeId,
+    });
+
+    const targetModelA = await store.createRecord('target', {
+      scope: scopeModelA,
+    });
+    const targetModelB = await store.createRecord('target', {
+      scope: scopeModelB,
+    });
+
+    const modelA = store.createRecord('session-recording', {
+      target: targetModelA,
+    });
+    const modelB = store.createRecord('session-recording', {
+      target: targetModelB,
+    });
+
+    assert.strictEqual(modelA.targetScopeDisplayName, fakeName);
+    assert.strictEqual(modelB.targetScopeDisplayName, fakeId);
+  });
 });
diff --git a/ui/admin/app/templates/scopes/scope/session-recordings/index.hbs b/ui/admin/app/templates/scopes/scope/session-recordings/index.hbs
index 10f3bafb0..fd82545f3 100644
--- a/ui/admin/app/templates/scopes/scope/session-recordings/index.hbs
+++ b/ui/admin/app/templates/scopes/scope/session-recordings/index.hbs
@@ -22,11 +22,13 @@
       >
         <:body as |B|>
           <B.Tr>
+            {{! Time }}
             <B.Td>
               <span class='hds-foreground-faint'>
                 {{format-date B.data.start_time format='mmddyyhhmm'}}
               </span>
             </B.Td>
+            {{! User }}
             <B.Td>
               <div
                 class='session-recording-list-cell-item hds-font-weight-semibold'
@@ -35,14 +37,19 @@
                 <span>{{B.data.user.name}}</span>
               </div>
             </B.Td>
+            {{! Target }}
             <B.Td>
               <div
                 class='session-recording-list-cell-item hds-font-weight-semibold'
               >
+                <span><FlightIcon @name='grid' /></span>
+                <span>{{B.data.targetScopeDisplayName}}</span>
+                <span class='hds-foreground-faint'>/</span>
                 <span><FlightIcon @name='target' /></span>
                 <span>{{B.data.target.name}}</span>
               </div>
             </B.Td>
+            {{! Duration }}
             <B.Td>
               <div
                 class='session-recording-list-cell-item hds-foreground-faint'
diff --git a/ui/admin/tests/acceptance/session-recordings/list-test.js b/ui/admin/tests/acceptance/session-recordings/list-test.js
index 8a868b266..f86374f8c 100644
--- a/ui/admin/tests/acceptance/session-recordings/list-test.js
+++ b/ui/admin/tests/acceptance/session-recordings/list-test.js
@@ -34,9 +34,12 @@ module('Acceptance | session recordings | list', function (hooks) {
       type: 'org',
       scope: { id: 'global', type: 'global' },
     });
-    instances.sessionRecording = this.server.create('session-recording', {
+    instances.scopes.targetModel = this.server.create('target', {
       scope: instances.scopes.global,
     });
+    instances.sessionRecording = this.server.create('session-recording', {
+      target: instances.scopes.targetModel,
+    });
     urls.globalScope = `/scopes/global`;
     urls.sessionRecordings = `${urls.globalScope}/session-recordings`;
     urls.sessionRecording = `${urls.sessionRecordings}/${instances.sessionRecording.id}`;