Merge branch 'main' into add-default-filters

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

@@ -4,6 +4,7 @@ import { task, timeout } from 'ember-concurrency';
 import config from '../../../../config/environment';
 import { action } from '@ember/object';
 import { notifySuccess, notifyError } from 'core/decorators/notify';
+import { resourceFilterParam } from 'core/decorators/resource-filter-param';
 
 const POLL_TIMEOUT_SECONDS = config.sessionPollingTimeoutSeconds;
 
@@ -17,6 +18,8 @@ export default class ScopesScopeProjectsSessionsRoute extends Route {
 
   // =attributes
 
+  @resourceFilterParam(['active', 'pending', 'canceling', 'terminated']) status;
+
   /**
    * A simple Ember Concurrency-based polling task that refreshes the route
    * every POLL_TIMEOUT_SECONDS seconds.  This is necessary to display changes
@@ -50,10 +53,11 @@ export default class ScopesScopeProjectsSessionsRoute extends Route {
    * @return {Promise{[{session: SessionModel, target: TargetModel}]}}
    */
   async model() {
+    const { status } = this;
     const { id: scope_id } = this.modelFor('scopes.scope');
     const { user_id } = this.session.data.authenticated;
     await this.store.query('target', { recursive: true, scope_id });
-    return await this.resourceFilterStore.queryBy('session', { user_id }, {
+    return await this.resourceFilterStore.queryBy('session', { user_id , status }, {
       recursive: true,
       scope_id
     });
@@ -86,4 +90,22 @@ export default class ScopesScopeProjectsSessionsRoute extends Route {
     await session.cancelSession();
     await this.ipc.invoke('stop', { session_id: session.id });
   }
+
+    /**
+ * Sets the specified resource filter field to the specified value.
+ * @param {string} field
+ * @param value
+ */
+    @action
+    filterBy(field, value) {
+      this[field] = value;
+    }
+  
+    /**
+     * Clears and filter selections.
+     */
+    @action
+    clearAllFilters() {
+      this.status = [];
+    }
 }

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

@@ -9,9 +9,64 @@
   </page.header>
 
   <page.body>
+    {{#if (feature-flag 'filter')}}
+      {{#if
+        (or
+          @model
+          (has-resource-filter-param-selections
+            'scopes.scope.projects.sessions'
+          )
+        )
+      }}
+        <Rose::Toolbar>
+          <Rose::Form as |form|>
+            {{#with
+              (resource-filter-param 'scopes.scope.projects.sessions' 'status')
+              as |filter|
+            }}
+              <Rose::Dropdown
+                @text={{t (concat 'form.' filter.name '.label')}}
+                @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={{t
+                        (concat 'resources.session.status.' group.item)
+                      }}
+                      value={{group.item}}
+                    />
+                  </dropdown.item>
+                </form.checkboxGroup>
+              </Rose::Dropdown>
+            {{/with}}
+
+            {{#if
+              (has-resource-filter-param-selections
+                'scopes.scope.projects.sessions'
+              )
+            }}
+              <Rose::Button
+                @style='inline-link-action'
+                @iconLeft='flight-icons/svg/x-16'
+                {{on 'click' (route-action 'clearAllFilters')}}
+              >{{t 'actions.clear-all-filters'}}
+              </Rose::Button>
+            {{/if}}
+          </Rose::Form>
+        </Rose::Toolbar>
+      {{/if}}
+    {{/if}}
 
     {{#if this.sorted}}
-
       <Rose::Table as |table|>
         <table.header as |header|>
           <header.row as |row|>
@@ -87,9 +142,17 @@
           {{/each}}
         </table.body>
       </Rose::Table>
-
+    {{else if (has-resource-filter-param-selections
+      'scopes.scope.projects.sessions'
+    )}}
+      <Rose::Layout::Centered>
+        <Rose::Message @title={{t 'titles.no-results'}} as |message|>
+          <message.description>
+            {{t 'descriptions.no-results'}}
+          </message.description>
+        </Rose::Message>
+      </Rose::Layout::Centered>
     {{else}}
-
       <Rose::Layout::Centered>
         <Rose::Message
           @title={{t 'resources.session.messages.none-friendly.title'}}
@@ -100,9 +163,7 @@
           </message.description>
         </Rose::Message>
       </Rose::Layout::Centered>
-
     {{/if}}
-
   </page.body>
 
 </Rose::Layout::Page>