feat: replace triggerValue's filter component with the standard selectionModel + checkboxes component

Author: GuustMetz

lib/public/components/common/selection/SelectionModel.js

@@ -339,8 +339,6 @@ export class SelectionModel extends Observable {
      * @abstract
      */
     get normalized() {
-        return (this._allowEmpty || this._multiple)
-            ? this._selectedOptions.join()
-            : this.current;
+        return (this._allowEmpty || this._multiple) ? this.selected.join() : this.current;
     }
 }

lib/public/views/Runs/ActiveColumns/runsActiveColumns.js

@@ -44,7 +44,6 @@ import { timeRangeFilter } from '../../../components/Filters/common/filters/time
 import { rawTextFilter } from '../../../components/Filters/common/filters/rawTextFilter.js';
 import { numericalComparisonFilter } from '../../../components/Filters/common/filters/numericalComparisonFilter.js';
 import { checkboxes } from '../../../components/Filters/common/filters/checkboxFilter.js';
-import { triggerValueFilter } from '../../../components/Filters/RunsFilter/triggerValueFilter.js';
 import radioButtonFilter from '../../../components/Filters/common/filters/radioButtonFilter.js';
 
 /**
@@ -539,7 +538,14 @@ export const runsActiveColumns = {
         visible: true,
         profiles: [profiles.none, 'lhcFill', 'environment'],
         classes: 'w-5 f6 w-wrapped',
-        filter: triggerValueFilter,
+
+        /**
+         * TriggerValue filter component
+         *
+         * @param {RunsOverviewModel} runsOverviewModel the runs overview model
+         * @return {Component} the trigger value filter component
+         */
+        filter: ({ filteringModel }) => checkboxes(filteringModel.get('triggerValues')),
         format: (trgValue) => trgValue ? trgValue : '-',
     },
     epn: {

lib/public/views/Runs/Overview/RunsOverviewModel.js

@@ -37,6 +37,8 @@ import { runsActiveColumns as dataExportConfiguration } from '../ActiveColumns/r
 import { BeamModeFilterModel } from '../../../components/Filters/RunsFilter/BeamModeFilterModel.js';
 import { beamModesProvider } from '../../../services/beamModes/beamModesProvider.js';
 import { RadioButtonFilterModel } from '../../../components/Filters/common/RadioButtonFilterModel.js';
+import { SelectionModel } from '../../../components/common/selection/SelectionModel.js';
+import { TRIGGER_VALUES } from '../../../domain/enums/TriggerValue.js';
 
 /**
  * Model representing handlers for runs page
@@ -94,6 +96,7 @@ export class RunsOverviewModel extends OverviewPageModel {
             ddflp: new RadioButtonFilterModel([{ label: 'ANY' }, { label: 'ON', value: true }, { label: 'OFF', value: false }]),
             dcs: new RadioButtonFilterModel([{ label: 'ANY' }, { label: 'ON', value: true }, { label: 'OFF', value: false }]),
             epn: new RadioButtonFilterModel([{ label: 'ANY' }, { label: 'ON', value: true }, { label: 'OFF', value: false }]),
+            triggerValues: new SelectionModel({ availableOptions: TRIGGER_VALUES.map((value) => ({ label: value, value })) }),
         });
 
         this._filteringModel.observe(() => this._applyFilters(true));
@@ -127,7 +130,7 @@ export class RunsOverviewModel extends OverviewPageModel {
      * @inheritdoc
      */
     getRootEndpoint() {
-        return buildUrl('/api/runs', { ...this._getFilterQueryParams(), ...{ filter: this.filteringModel.normalized } });
+        return buildUrl('/api/runs', { filter: this.filteringModel.normalized });
     }
 
     /**
@@ -149,8 +152,6 @@ export class RunsOverviewModel extends OverviewPageModel {
     resetFiltering(fetch = true) {
         this._filteringModel.reset();
 
-        this._triggerValuesFilters = new Set();
-
         if (fetch) {
             this._applyFilters(true);
         }
@@ -161,7 +162,7 @@ export class RunsOverviewModel extends OverviewPageModel {
      * @return {Boolean} If any filter is active
      */
     isAnyFilterActive() {
-        return this._filteringModel.isAnyFilterActive() || this._triggerValuesFilters.size !== 0;
+        return this._filteringModel.isAnyFilterActive();
     }
 
     /**
@@ -173,39 +174,6 @@ export class RunsOverviewModel extends OverviewPageModel {
         return this._filteringModel;
     }
 
-    /**
-     * Getter for the trigger values filter Set
-     * @return {Set} set of trigger filter values
-     */
-    get triggerValuesFilters() {
-        return this._triggerValuesFilters;
-    }
-
-    /**
-     * Setter for trigger values filter, this replaces the current set
-     * @param {Array} newTriggerValues new Set of values
-     * @return {undefined}
-     */
-    set triggerValuesFilters(newTriggerValues) {
-        this._triggerValuesFilters = new Set(newTriggerValues);
-        this._applyFilters();
-    }
-
-    /**
-     * Returns the list of URL params corresponding to the currently applied filter
-     *
-     * @return {Object} the URL params
-     *
-     * @private
-     */
-    _getFilterQueryParams() {
-        return {
-            ...this._triggerValuesFilters.size !== 0 && {
-                'filter[triggerValues]': Array.from(this._triggerValuesFilters).join(),
-            },
-        };
-    }
-
     /**
      * Apply the current filtering and update the remote data list
      *