From 4229658815795ed6b840a4e5c75159a598593be4 Mon Sep 17 00:00:00 2001
From: Randall Morey <randall@randallmorey.com>
Date: Fri, 18 Sep 2020 12:54:31 -0400
Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=8E=B8=20add=20sessions=20list=20?=
 =?UTF-8?q?view?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../rose/addon/styles/rose/_typography.scss   |  4 ++
 ui/core/app/formats.js                        |  9 +++
 ui/core/app/helpers/format-date-iso-human.js  |  7 +++
 ui/core/app/helpers/format-date-iso.js        |  5 ++
 ui/core/app/router.js                         |  1 +
 .../scopes/scope/projects/project/sessions.js | 25 +++++++++
 .../scope/projects/project/sessions/index.js  |  4 ++
 .../scope/projects/project/_sidebar.hbs       |  3 +
 .../scope/projects/project/sessions.hbs       |  3 +
 .../scope/projects/project/sessions/index.hbs | 56 +++++++++++++++++++
 ui/core/mirage/config.js                      |  7 +++
 ui/core/mirage/factories/session.js           | 35 ++++++++++++
 ui/core/mirage/generated/factories/session.js | 14 +++++
 ui/core/mirage/models/session.js              | 11 ++++
 ui/core/mirage/scenarios/default.js           |  1 +
 ui/core/mirage/serializers/session.js         | 22 ++++++++
 .../helpers/format-date-iso-human-test.js     | 17 ++++++
 .../helpers/format-date-iso-test.js           | 17 ++++++
 .../scope/projects/project/sessions-test.js   | 11 ++++
 .../projects/project/sessions/index-test.js   | 11 ++++
 ui/core/translations/en-us.yaml               |  5 ++
 21 files changed, 268 insertions(+)
 create mode 100644 ui/core/app/helpers/format-date-iso-human.js
 create mode 100644 ui/core/app/helpers/format-date-iso.js
 create mode 100644 ui/core/app/routes/scopes/scope/projects/project/sessions.js
 create mode 100644 ui/core/app/routes/scopes/scope/projects/project/sessions/index.js
 create mode 100644 ui/core/app/templates/scopes/scope/projects/project/sessions.hbs
 create mode 100644 ui/core/app/templates/scopes/scope/projects/project/sessions/index.hbs
 create mode 100644 ui/core/mirage/factories/session.js
 create mode 100644 ui/core/mirage/generated/factories/session.js
 create mode 100644 ui/core/mirage/models/session.js
 create mode 100644 ui/core/mirage/serializers/session.js
 create mode 100644 ui/core/tests/integration/helpers/format-date-iso-human-test.js
 create mode 100644 ui/core/tests/integration/helpers/format-date-iso-test.js
 create mode 100644 ui/core/tests/unit/routes/scopes/scope/projects/project/sessions-test.js
 create mode 100644 ui/core/tests/unit/routes/scopes/scope/projects/project/sessions/index-test.js

diff --git a/addons/rose/addon/styles/rose/_typography.scss b/addons/rose/addon/styles/rose/_typography.scss
index b44914ce8..c5fda86e4 100644
--- a/addons/rose/addon/styles/rose/_typography.scss
+++ b/addons/rose/addon/styles/rose/_typography.scss
@@ -54,3 +54,7 @@ p {
 a {
   color: var(--action);
 }
+
+time {
+  font-variant-numeric: tabular-nums;
+}
diff --git a/ui/core/app/formats.js b/ui/core/app/formats.js
index f5d1f1502..9ea07ca26 100644
--- a/ui/core/app/formats.js
+++ b/ui/core/app/formats.js
@@ -7,6 +7,15 @@ export default {
     },
   },
   date: {
+    default: {
+      day: '2-digit',
+      month: '2-digit',
+      year: 'numeric',
+      hour: 'numeric',
+      minute: 'numeric',
+      second: 'numeric',
+      hour12: false
+    },
     hhmmss: {
       hour: 'numeric',
       minute: 'numeric',
diff --git a/ui/core/app/helpers/format-date-iso-human.js b/ui/core/app/helpers/format-date-iso-human.js
new file mode 100644
index 000000000..2744a4eeb
--- /dev/null
+++ b/ui/core/app/helpers/format-date-iso-human.js
@@ -0,0 +1,7 @@
+import { helper } from '@ember/component/helper';
+
+export default helper(function formatDateIsoHuman(params/*, hash*/) {
+  return params[0].toISOString()
+    .replace('T', ' ')
+    .replace(/\.\d*Z/, '');
+});
diff --git a/ui/core/app/helpers/format-date-iso.js b/ui/core/app/helpers/format-date-iso.js
new file mode 100644
index 000000000..52cd9687d
--- /dev/null
+++ b/ui/core/app/helpers/format-date-iso.js
@@ -0,0 +1,5 @@
+import { helper } from '@ember/component/helper';
+
+export default helper(function formatDateIso(params/*, hash*/) {
+  return params[0].toISOString();
+});
diff --git a/ui/core/app/router.js b/ui/core/app/router.js
index 204ced768..0894289f9 100644
--- a/ui/core/app/router.js
+++ b/ui/core/app/router.js
@@ -52,6 +52,7 @@ Router.map(function () {
             });
             this.route('new');
           });
+          this.route('sessions', function() {});
         });
         this.route('new');
       });
diff --git a/ui/core/app/routes/scopes/scope/projects/project/sessions.js b/ui/core/app/routes/scopes/scope/projects/project/sessions.js
new file mode 100644
index 000000000..ed7c699f0
--- /dev/null
+++ b/ui/core/app/routes/scopes/scope/projects/project/sessions.js
@@ -0,0 +1,25 @@
+import Route from '@ember/routing/route';
+import { all, hash } from 'rsvp';
+
+export default class ScopesScopeProjectsProjectSessionsRoute extends Route {
+
+  // =methods
+
+  /**
+   * Loads all sessions under the current scope and encapsulates them into
+   * an array of objects containing their associated users and targets.
+   * @return {Promise{[{session: SessionModel, user: UserModel, target: TargetModel}]}}
+   */
+  async model() {
+    const { id: scope_id } = this.modelFor('scopes.scope.projects.project');
+    const sessions = await this.store.query('session', { scope_id });
+    return all(
+      sessions.map(session => hash({
+        session,
+        user: this.store.findRecord('user', session.user_id),
+        target: this.store.findRecord('target', session.target_id),
+      }))
+    );
+  }
+
+}
diff --git a/ui/core/app/routes/scopes/scope/projects/project/sessions/index.js b/ui/core/app/routes/scopes/scope/projects/project/sessions/index.js
new file mode 100644
index 000000000..a8ae56692
--- /dev/null
+++ b/ui/core/app/routes/scopes/scope/projects/project/sessions/index.js
@@ -0,0 +1,4 @@
+import Route from '@ember/routing/route';
+
+export default class ScopesScopeProjectsProjectSessionsIndexRoute extends Route {
+}
diff --git a/ui/core/app/templates/scopes/scope/projects/project/_sidebar.hbs b/ui/core/app/templates/scopes/scope/projects/project/_sidebar.hbs
index ae4f79e0b..e29af0451 100644
--- a/ui/core/app/templates/scopes/scope/projects/project/_sidebar.hbs
+++ b/ui/core/app/templates/scopes/scope/projects/project/_sidebar.hbs
@@ -1,4 +1,7 @@
 <Rose::Nav::Sidebar @title={{t "titles.resources"}} as |nav|>
+  <nav.link @route="scopes.scope.projects.project.sessions">
+    {{t "resources.sessions"}}
+  </nav.link>
   <nav.link @route="scopes.scope.projects.project.targets">
     {{t "resources.targets"}}
   </nav.link>
diff --git a/ui/core/app/templates/scopes/scope/projects/project/sessions.hbs b/ui/core/app/templates/scopes/scope/projects/project/sessions.hbs
new file mode 100644
index 000000000..37fea125e
--- /dev/null
+++ b/ui/core/app/templates/scopes/scope/projects/project/sessions.hbs
@@ -0,0 +1,3 @@
+{{title (t "resources.sessions")}}
+
+{{outlet}}
diff --git a/ui/core/app/templates/scopes/scope/projects/project/sessions/index.hbs b/ui/core/app/templates/scopes/scope/projects/project/sessions/index.hbs
new file mode 100644
index 000000000..abbbbdfac
--- /dev/null
+++ b/ui/core/app/templates/scopes/scope/projects/project/sessions/index.hbs
@@ -0,0 +1,56 @@
+<Rose::Layout::Page as |page|>
+
+  <page.breadcrumbs>
+    <BreadCrumbs />
+  </page.breadcrumbs>
+
+  <page.header>
+    <h2>{{t "resources.sessions"}}</h2>
+  </page.header>
+
+  <page.body>
+
+    {{#if @model}}
+
+      <Rose::Table as |table|>
+        <table.header as |header|>
+          <header.row as |row|>
+            <row.headerCell>{{t "form.label.id"}}</row.headerCell>
+            <row.headerCell>{{t "resources.user"}}</row.headerCell>
+            <row.headerCell>{{t "resources.target"}}</row.headerCell>
+            <row.headerCell>{{t "form.label.started"}}</row.headerCell>
+          </header.row>
+        </table.header>
+        <table.body as |body|>
+          {{#each @model as |sessionAggregate|}}
+            <body.row as |row|>
+              <row.headerCell>
+                <code>{{sessionAggregate.session.id}}</code>
+              </row.headerCell>
+              <row.cell>{{sessionAggregate.user.displayName}}</row.cell>
+              <row.cell>{{sessionAggregate.target.displayName}}</row.cell>
+              <row.cell>
+                <time datetime={{format-date-iso sessionAggregate.session.created_time}}>
+                  {{format-date-iso-human sessionAggregate.session.created_time}}
+                </time>
+              </row.cell>
+            </body.row>
+          {{/each}}
+        </table.body>
+      </Rose::Table>
+
+    {{else}}
+
+      <Rose::Layout::Centered>
+        <Rose::Message @title={{t "titles.no-sessions"}} as |message|>
+          <message.description>
+            {{t "descriptions.no-sessions"}}
+          </message.description>
+        </Rose::Message>
+      </Rose::Layout::Centered>
+
+    {{/if}}
+
+  </page.body>
+
+</Rose::Layout::Page>
diff --git a/ui/core/mirage/config.js b/ui/core/mirage/config.js
index e7044298f..844211c61 100644
--- a/ui/core/mirage/config.js
+++ b/ui/core/mirage/config.js
@@ -292,4 +292,11 @@ export default function() {
     }
     return target.update(updatedAttrs);
   });
+
+  // session
+
+  this.get('/sessions', function ({ sessions }, { queryParams: { scope_id } }) {
+    return sessions.where(session => session.scopeId === scope_id);
+  });
+  this.get('/sessions/:id');
 }
diff --git a/ui/core/mirage/factories/session.js b/ui/core/mirage/factories/session.js
new file mode 100644
index 000000000..9e5e31913
--- /dev/null
+++ b/ui/core/mirage/factories/session.js
@@ -0,0 +1,35 @@
+import factory from '../generated/factories/target';
+import { trait } from 'ember-cli-mirage';
+
+export default factory.extend({
+
+  id: (i) => `session-id-${i}`,
+
+  /**
+   * Sessions generated with this trait will automatically form
+   * associations to user, target, host set, and host (if available) within
+   * the current scope.
+   */
+  withAssociations: trait({
+    afterCreate(record, server) {
+      const scopeId = record.scopeId;
+      if (record.scope.type === 'project') {
+        const orgScopeId = record.scope?.scope.id;
+        const user =
+          server.schema.users.where({ scopeId: orgScopeId }).models[0];
+        if (user) record.update({ user });
+      }
+      const target = server.schema.targets.where({ scopeId }).models[0];
+      if (target) {
+        record.update({ target });
+        const hostSet = target.hostSets.models[0];
+        if (hostSet) {
+          record.update({ hostSet });
+          const host = hostSet.hosts.models[0];
+          if (host) record.update({ host });
+        }
+      }
+    }
+  })
+
+});
diff --git a/ui/core/mirage/generated/factories/session.js b/ui/core/mirage/generated/factories/session.js
new file mode 100644
index 000000000..25aca3759
--- /dev/null
+++ b/ui/core/mirage/generated/factories/session.js
@@ -0,0 +1,14 @@
+import { Factory } from 'ember-cli-mirage';
+import { random, date } from 'faker';
+
+/**
+ * GeneratedSessionModelFactory
+ */
+export default Factory.extend({
+
+  type: 'tcp',
+  created_time: () => date.recent(),
+  updated_time: () => date.recent(),
+  version: () => random.number(),
+
+});
diff --git a/ui/core/mirage/models/session.js b/ui/core/mirage/models/session.js
new file mode 100644
index 000000000..91a4da594
--- /dev/null
+++ b/ui/core/mirage/models/session.js
@@ -0,0 +1,11 @@
+import { Model, belongsTo } from 'ember-cli-mirage';
+
+export default Model.extend({
+
+  scope: belongsTo(),
+  user: belongsTo(),
+  target: belongsTo(),
+  host: belongsTo(),
+  hostSet: belongsTo(),
+
+});
diff --git a/ui/core/mirage/scenarios/default.js b/ui/core/mirage/scenarios/default.js
index 9492f92e3..5d1a85fe6 100644
--- a/ui/core/mirage/scenarios/default.js
+++ b/ui/core/mirage/scenarios/default.js
@@ -26,6 +26,7 @@ export default function(server) {
   server.schema.scopes.where({type: 'project'}).models.forEach(scope => {
     server.createList('host-catalog', 2, { scope }, 'withChildren');
     server.createList('target', 2, { scope }, 'withRandomHostSets');
+    server.createList('session', 4, { scope }, 'withAssociations');
   });
 
 }
diff --git a/ui/core/mirage/serializers/session.js b/ui/core/mirage/serializers/session.js
new file mode 100644
index 000000000..3e14a23e6
--- /dev/null
+++ b/ui/core/mirage/serializers/session.js
@@ -0,0 +1,22 @@
+import ApplicationSerializer from './application';
+import { underscore } from '@ember/string';
+
+export default ApplicationSerializer.extend({
+  modelName: 'session',
+
+  keyForRelationshipId(relationshipName) {
+    return `${this._container.inflector.singularize(
+      underscore(relationshipName)
+    )}_id`;
+  },
+
+  _hashForModel(model) {
+    const json = ApplicationSerializer.prototype._hashForModel.apply(this, arguments);
+    json.user_id = model.userId;
+    json.target_id = model.targetId;
+    json.host_set_id = model.hostSetId;
+    json.host_id = model.hostId;
+    return json;
+  }
+
+});
diff --git a/ui/core/tests/integration/helpers/format-date-iso-human-test.js b/ui/core/tests/integration/helpers/format-date-iso-human-test.js
new file mode 100644
index 000000000..94eec92fa
--- /dev/null
+++ b/ui/core/tests/integration/helpers/format-date-iso-human-test.js
@@ -0,0 +1,17 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Helper | format-date-iso-human', function(hooks) {
+  setupRenderingTest(hooks);
+
+  // Replace this with your real tests.
+  test('it renders', async function(assert) {
+    this.set('inputValue', new Date('2020-01-01T00:00:00.999Z'));
+
+    await render(hbs`{{format-date-iso-human inputValue}}`);
+
+    assert.equal(this.element.textContent.trim(), '2020-01-01 00:00:00');
+  });
+});
diff --git a/ui/core/tests/integration/helpers/format-date-iso-test.js b/ui/core/tests/integration/helpers/format-date-iso-test.js
new file mode 100644
index 000000000..2954d3890
--- /dev/null
+++ b/ui/core/tests/integration/helpers/format-date-iso-test.js
@@ -0,0 +1,17 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Helper | format-date-iso', function(hooks) {
+  setupRenderingTest(hooks);
+
+  // Replace this with your real tests.
+  test('it renders', async function(assert) {
+    this.set('inputValue', new Date('2020-01-01T00:00:00.999Z'));
+
+    await render(hbs`{{format-date-iso inputValue}}`);
+
+    assert.equal(this.element.textContent.trim(), '2020-01-01T00:00:00.999Z');
+  });
+});
diff --git a/ui/core/tests/unit/routes/scopes/scope/projects/project/sessions-test.js b/ui/core/tests/unit/routes/scopes/scope/projects/project/sessions-test.js
new file mode 100644
index 000000000..70769438e
--- /dev/null
+++ b/ui/core/tests/unit/routes/scopes/scope/projects/project/sessions-test.js
@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | scopes/scope/projects/project/sessions', function(hooks) {
+  setupTest(hooks);
+
+  test('it exists', function(assert) {
+    let route = this.owner.lookup('route:scopes/scope/projects/project/sessions');
+    assert.ok(route);
+  });
+});
diff --git a/ui/core/tests/unit/routes/scopes/scope/projects/project/sessions/index-test.js b/ui/core/tests/unit/routes/scopes/scope/projects/project/sessions/index-test.js
new file mode 100644
index 000000000..a774bf223
--- /dev/null
+++ b/ui/core/tests/unit/routes/scopes/scope/projects/project/sessions/index-test.js
@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | scopes/scope/projects/project/sessions/index', function(hooks) {
+  setupTest(hooks);
+
+  test('it exists', function(assert) {
+    let route = this.owner.lookup('route:scopes/scope/projects/project/sessions/index');
+    assert.ok(route);
+  });
+});
diff --git a/ui/core/translations/en-us.yaml b/ui/core/translations/en-us.yaml
index e458c2b50..2d13fa33e 100644
--- a/ui/core/translations/en-us.yaml
+++ b/ui/core/translations/en-us.yaml
@@ -77,6 +77,8 @@ resources:
   targets: Targets
   accounts: Accounts
   account: Account
+  sessions: Sessions
+  session: Session
 titles:
   iam: IAM
   new: New
@@ -114,6 +116,7 @@ titles:
   accounts: Accounts
   account: Account
   accounts-welcome: Welcome to Accounts
+  no-sessions: No Active Sessions
 descriptions:
   host-catalogs: Overview of collections of hosts and host sets.
   empty-set: There are no items to display yet.  You may be able to add items or try back later.
@@ -136,6 +139,7 @@ descriptions:
   no-available-users: No users are available to add to this group.
   account-set-password: Set a password for the account.
   accounts-welcome: No accounts are available in this auth method.
+  no-sessions: There are no active sessions at this time.
 states:
   info: Info
   success: Success
@@ -157,6 +161,7 @@ form:
     default_port: Default Port
     current_password: Current Password
     new_password: New Password
+    started: Started
 errors:
   titles:
     unauthenticated-error: You are not signed in