feature: initial project filtering UX in desktop sessions

ui/desktop/app/routes/scopes/scope/projects/sessions.js

@@ -23,6 +23,12 @@ export default class ScopesScopeProjectsSessionsRoute extends Route {
     defaultValue: ['active','pending', 'canceling']
   }) status;
 
+  @resourceFilter({
+    allowed: (route) => route.modelFor('scopes.scope.projects'),
+    serialize: ({ id }) => id,
+    findBySerialized: ({ id }, value) => id === value
+  }) project;
+
   /**
    * A simple Ember Concurrency-based polling task that refreshes the route
    * every POLL_TIMEOUT_SECONDS seconds.  This is necessary to display changes
@@ -53,14 +59,19 @@ export default class ScopesScopeProjectsSessionsRoute extends Route {
   /**
    * Loads all sessions under the current scope and encapsulates them into
    * an array of objects filtering to current user
-   * @return {Promise{[{session: SessionModel, target: TargetModel}]}}
+   * @return {Promise{SessionModel[]}}
    */
   async model() {
     const { status } = this;
     const { id: scope_id } = this.modelFor('scopes.scope');
     const { user_id } = this.session.data.authenticated;
+    const projects = this.project || [];
     await this.store.query('target', { recursive: true, scope_id });
-    return await this.resourceFilterStore.queryBy('session', { user_id , status }, {
+    return await this.resourceFilterStore.queryBy('session', {
+      user_id,
+      status,
+      scope_id: projects.map(({ id }) => id)
+    }, {
       recursive: true,
       scope_id
     });

ui/desktop/app/templates/scopes/scope/projects/sessions/index.hbs

@@ -49,6 +49,33 @@
               </Rose::Dropdown>
             {{/with}}
 
+            {{#with
+              (resource-filter 'scopes.scope.projects.sessions' 'project')
+              as |filter|
+            }}
+              <Rose::Dropdown
+                @text={{t (concat 'resources.' filter.name '.title')}}
+                @count={{filter.selectedValue.length}}
+                @ignoreClickInside={{true}}
+                as |dropdown|
+              >
+                <form.checkboxGroup
+                  @name={{filter.name}}
+                  @items={{filter.allowedValues}}
+                  @selectedItems={{filter.selectedValue}}
+                  @onChange={{route-action 'filterBy' filter.name}}
+                  as |group|
+                >
+                  <dropdown.item>
+                    <group.checkbox
+                      @label={{group.item.displayName}}
+                      value={{group.item}}
+                    />
+                  </dropdown.item>
+                </form.checkboxGroup>
+              </Rose::Dropdown>
+            {{/with}}
+
             {{#if
               (has-resource-filter-selections
                 'scopes.scope.projects.sessions' 'type'