[O2B-1534] Migrate log overview to use filtering model pattern

lib/domain/dtos/GetAllLogsDto.js

@@ -17,32 +17,25 @@ const PaginationDto = require('./PaginationDto');
 const { CustomJoi } = require('./CustomJoi.js');
 const { TagsFilterDto } = require('./filters/TagsFilterDto.js');
 const { FromToFilterDto } = require('./filters/FromToFilterDto.js');
-const { EnvironmentsFilterDto } = require('./filters/EnvironmentsFilterDto');
 
-const RunFilterDto = Joi.object({
-    values: CustomJoi.stringArray().items(EntityIdDto).single().required(),
-    operation: Joi.string().valid('and', 'or').required(),
-});
-
-const LhcFillFilterDto = Joi.object({
-    values: CustomJoi.stringArray().items(EntityIdDto).single().required(),
-    operation: Joi.string().valid('and', 'or').required(),
-});
+const RunFilterDto = CustomJoi.stringArray().items(EntityIdDto).single();
+const EnvironmentsFilterDto = CustomJoi.stringArray().items(Joi.string()).single();
+const LhcFillFilterDto = CustomJoi.stringArray().items(EntityIdDto).single();
 
 const FilterDto = Joi.object({
     title: Joi.string().trim(),
     content: Joi.string().trim(),
     author: Joi.string().trim(),
     created: FromToFilterDto,
     tags: TagsFilterDto,
-    lhcFills: LhcFillFilterDto,
-    run: RunFilterDto,
+    fillNumbers: LhcFillFilterDto,
+    runNumbers: RunFilterDto,
     origin: Joi.string()
         .valid('human', 'process'),
     parentLog: EntityIdDto,
     rootLog: EntityIdDto,
     rootOnly: Joi.boolean(),
-    environments: EnvironmentsFilterDto,
+    environmentIds: EnvironmentsFilterDto,
 });
 
 const SortDto = Joi.object({

lib/public/components/Filters/LogsFilter/author/AuthorFilterModel.js

@@ -11,12 +11,12 @@
  * or submit itself to any jurisdiction.
  */
 
-import { FilterInputModel } from '../../common/filters/FilterInputModel.js';
+import { RawTextFilterModel } from '../../common/filters/RawTextFilterModel.js';
 
 /**
  * Model to handle the state of the Author Filter
  */
-export class AuthorFilterModel extends FilterInputModel {
+export class AuthorFilterModel extends RawTextFilterModel {
     /**
      * Constructor
      *
@@ -32,7 +32,7 @@ export class AuthorFilterModel extends FilterInputModel {
      * @return {boolean} true if '!Anonymous' is included in the raw filter string, false otherwise.
      */
     isAnonymousExcluded() {
-        return this._raw.includes('!Anonymous');
+        return this._value.includes('!Anonymous');
     }
 
     /**
@@ -42,28 +42,25 @@ export class AuthorFilterModel extends FilterInputModel {
      */
     toggleAnonymousFilter() {
         if (this.isAnonymousExcluded()) {
-            this._raw = this._raw.split(',')
+            this._value = this._value.split(',')
                 .filter((author) => author.trim() !== '!Anonymous')
                 .join(',');
         } else {
-            this._raw += super.isEmpty ? '!Anonymous' : ', !Anonymous';
+            this._value += super.isEmpty ? '!Anonymous' : ', !Anonymous';
         }
 
-        this._value = this.valueFromRaw(this._raw);
         this.notify();
     }
 
     /**
-     * Reset the filter to its default value and notify the observers.
+     * Reset the filter to its default value and notify the observers if the reset changed anything.
      *
      * @return {void}
      */
     clear() {
-        if (this.isEmpty) {
-            return;
+        if (!this.isEmpty) {
+            super.reset();
+            this.notify();
         }
-
-        super.reset();
-        this.notify();
     }
 }

lib/public/components/Filters/LogsFilter/author/authorFilter.js

@@ -14,31 +14,16 @@
 import { h } from '/js/src/index.js';
 import { iconX } from '/js/src/icons.js';
 import { switchInput } from '../../../common/form/switchInput.js';
-
-/**
- * Returns a text input field that can be used to filter logs by author
- *
- * @param {AuthorFilterModel} authorFilterModel The author filter model object
- * @returns {Component} A text box that allows the user to enter an author substring to match against all logs
- */
-const authorFilterTextInput = (authorFilterModel) => h('input.w-40', {
-    type: 'text',
-    id: 'authorFilterText',
-    value: authorFilterModel.raw,
-    oninput: (e) => authorFilterModel.update(e.target.value),
-});
+import { rawTextFilter } from '../../common/filters/rawTextFilter.js';
 
 /**
  * Returns a button that can be used to reset the author filter.
  *
  * @param {AuthorFilterModel} authorFilterModel The author filter model object
  * @return {Component} A button that can be used to reset the author filter
  */
-const resetAuthorFilterButton = (authorFilterModel) => h(
-    '.btn.btn-pill.f7',
-    { disabled: authorFilterModel.isEmpty, onclick: () => authorFilterModel.clear() },
-    iconX(),
-);
+const resetAuthorFilterButton = (authorFilterModel) =>
+    h('.btn.btn-pill.f7', { disabled: authorFilterModel.isEmpty, onclick: () => authorFilterModel.clear() }, iconX());
 
 /**
  * Returns a toggle that can be used to exclude anonymous authors
@@ -55,11 +40,11 @@ export const excludeAnonymousLogAuthorToggle = (authorFilterModel) => switchInpu
 /**
  * Returns a authorFilter component with text input, reset button, and anonymous exclusion button.
  *
- * @param {LogModel} logModel the log model object
- * @returns {Component} the author filter component
+ * @param {AuthorFilterModel} authorFilterModel the authorFilterModel
+ * @return {Component} the filter component
  */
-export const authorFilter = ({ authorFilter }) => h('.flex-row.items-center.g3', [
-    authorFilterTextInput(authorFilter),
-    resetAuthorFilterButton(authorFilter),
-    excludeAnonymousLogAuthorToggle(authorFilter),
+export const authorFilter = (authorFilterModel) => h('.flex-row.items-center.g3', [
+    rawTextFilter(authorFilterModel, { classes: ['w-50'], id: 'authorFilterText', value: authorFilterModel.raw, placeholder: 'e.g. John Doe' }),
+    resetAuthorFilterButton(authorFilterModel),
+    excludeAnonymousLogAuthorToggle(authorFilterModel),
 ]);

lib/public/components/Filters/common/filters/textFilter.js

@@ -16,13 +16,13 @@ import { h } from '/js/src/index.js';
 /**
  * Returns a text filter component
  *
- * @param {FilterInputModel|TextTokensFilterModel} filterInputModel the model of the text filter
+ * @param {TextTokensFilterModel} textTokensFilterModel the model of the text filter
  * @param {Object} attributes the additional attributes to pass to the component, such as id and classes
  * @return {Component} the filter component
  */
-export const textFilter = (filterInputModel, attributes) => h('input', {
+export const textFilter = (textTokensFilterModel, attributes) => h('input', {
     ...attributes,
     type: 'text',
-    value: filterInputModel.raw,
-    oninput: (e) => filterInputModel.update(e.target.value),
+    value: textTokensFilterModel.raw,
+    oninput: (e) => textTokensFilterModel.update(e.target.value),
 }, '');