feat: 🎸 add cancel session feature

addons/rose/addon/styles/rose/components/table/_table.scss

@@ -34,4 +34,8 @@
       padding: sizing.rems(l) sizing.rems(s);
     }
   }
+
+  [class*="rose-button"] {
+    margin-bottom: 0;
+  }
 }

ui/core/app/routes/scopes/scope/projects/project/sessions.js

@@ -1,8 +1,15 @@
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+import { action } from '@ember/object';
 import { all, hash } from 'rsvp';
 
 export default class ScopesScopeProjectsProjectSessionsRoute extends Route {
 
+  // =services
+
+  @service intl;
+  @service notify;
+
   // =methods
 
   /**
@@ -22,4 +29,19 @@ export default class ScopesScopeProjectsProjectSessionsRoute extends Route {
     );
   }
 
+  /**
+   * Cancels the specified session and notifies user of success or error.
+   * @param {SessionModel}
+   */
+  @action
+  async cancelSession(session) {
+    try {
+      await session.cancelSession();
+      this.notify.success(this.intl.t('notify.session-canceled'));
+    } catch (error) {
+      // TODO: replace with translated strings
+      this.notify.error(error.message, { closeAfter: null });
+    }
+  }
+
 }

ui/core/app/templates/scopes/scope/groups/group/members.hbs

@@ -7,7 +7,7 @@
       <header.row as |row|>
         <row.headerCell>{{t 'form.label.name'}}</row.headerCell>
         <row.headerCell>{{t 'form.label.id'}}</row.headerCell>
-        <row.headerCell>{{t "form.label.actions"}}</row.headerCell>
+        <row.headerCell>{{t "titles.actions"}}</row.headerCell>
       </header.row>
     </table.header>
     <table.body as |body|>

ui/core/app/templates/scopes/scope/projects/project/host-catalogs/host-catalog/host-sets/host-set/hosts.hbs

@@ -6,7 +6,7 @@
         <row.headerCell>{{t "form.label.name"}}</row.headerCell>
         <row.headerCell>{{t "form.label.type"}}</row.headerCell>
         <row.headerCell>{{t "form.label.id"}}</row.headerCell>
-        <row.headerCell>{{t "form.label.actions"}}</row.headerCell>
+        <row.headerCell>{{t "titles.actions"}}</row.headerCell>
       </header.row>
     </table.header>
     <table.body as |body|>

ui/core/app/templates/scopes/scope/projects/project/sessions/index.hbs

@@ -19,6 +19,7 @@
             <row.headerCell>{{t "resources.user"}}</row.headerCell>
             <row.headerCell>{{t "resources.target"}}</row.headerCell>
             <row.headerCell>{{t "form.label.started"}}</row.headerCell>
+            <row.headerCell>{{t "titles.actions"}}</row.headerCell>
           </header.row>
         </table.header>
         <table.body as |body|>
@@ -34,6 +35,11 @@
                   {{format-date-iso-human sessionAggregate.session.created_time}}
                 </time>
               </row.cell>
+              <row.cell>
+                <Rose::Button @style="secondary" {{on "click" (route-action "cancelSession" sessionAggregate.session)}}>
+                  {{t "actions.cancel"}}
+                </Rose::Button>
+              </row.cell>
             </body.row>
           {{/each}}
         </table.body>

ui/core/app/templates/scopes/scope/projects/project/targets/target/host-sets.hbs

@@ -8,7 +8,7 @@
         <row.headerCell>{{t "form.label.name"}}</row.headerCell>
         <row.headerCell>{{t "form.label.type"}}</row.headerCell>
         <row.headerCell>{{t "form.label.id"}}</row.headerCell>
-        <row.headerCell>{{t "form.label.actions"}}</row.headerCell>
+        <row.headerCell>{{t "titles.actions"}}</row.headerCell>
       </header.row>
     </table.header>
     <table.body as |body|>

ui/core/app/templates/scopes/scope/roles/role/principals.hbs

@@ -8,7 +8,7 @@
         <row.headerCell>{{t 'form.label.name'}}</row.headerCell>
         <row.headerCell>{{t 'form.label.type'}}</row.headerCell>
         <row.headerCell>{{t 'form.label.id'}}</row.headerCell>
-        <row.headerCell>{{t "form.label.actions"}}</row.headerCell>
+        <row.headerCell>{{t "titles.actions"}}</row.headerCell>
       </header.row>
     </table.header>
     <table.body as |body|>

ui/core/mirage/config.js

@@ -299,4 +299,18 @@ export default function() {
     return sessions.where(session => session.scopeId === scope_id);
   });
   this.get('/sessions/:id');
+  this.post('/sessions/:idMethod', function ({ sessions }, { params: { idMethod } }) {
+    const attrs = this.normalizedRequestAttrs();
+    const id = idMethod.split(':')[0];
+    const method = idMethod.split(':')[1];
+    const session = sessions.find(id);
+    const updatedAttrs = {
+      version: attrs.version
+    };
+    if (method === 'cancel') {
+      updatedAttrs.status = 'canceled';
+    }
+    return session.update(updatedAttrs);
+  });
+
 }

ui/core/translations/en-us.yaml

@@ -117,6 +117,7 @@ titles:
   account: Account
   accounts-welcome: Welcome to Accounts
   no-sessions: No Active Sessions
+  actions: Actions
 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.
@@ -180,3 +181,4 @@ notify:
   create-success: Created succesfully.
   save-success: Saved succesfully.
   delete-success: Deleted successfully.
+  session-canceled: Session canceled.