feat: Add functionality to filter by title

Author: MauritsioRK

lib/database/utilities/QueryBuilder.js

@@ -162,6 +162,30 @@ module.exports = (sequelize) => {
             return this.queryBuilder;
         }
 
+        /**
+         * Sets a substring filter using the provided value.
+         *
+         * @param {symbol} value The required value.
+         * @returns {QueryBuilder} The current QueryBuilder instance.
+         */
+        substring(value) {
+            if (!this.queryBuilder.options.where) {
+                this.queryBuilder.options.where = {};
+            }
+
+            if (this.notFlag) {
+                this.queryBuilder.options.where[this.column] = {
+                    [Op.notLike]: `%${value}%`,
+                };
+            } else {
+                this.queryBuilder.options.where[this.column] = {
+                    [Op.substring]: value,
+                };
+            }
+
+            return this.queryBuilder;
+        }
+
         /**
          * Sets the operation.
          *

lib/domain/dtos/GetAllLogsDto.js

@@ -35,12 +35,13 @@ const TagFilterDto = Joi.object({
 });
 
 const FilterDto = Joi.object({
+    title: Joi.string().trim(),
+    created: CreatedFilterDto,
+    tag: TagFilterDto,
     origin: Joi.string()
         .valid('human', 'process'),
     parentLog: EntityIdDto,
     rootLog: EntityIdDto,
-    created: CreatedFilterDto,
-    tag: TagFilterDto,
 });
 
 const SortDto = Joi.object({

lib/public/components/Filters/created.js

@@ -23,25 +23,25 @@ today.setMinutes(today.getMinutes() - today.getTimezoneOffset());
  * @return {vnode} Two date selection boxes to control the minimum and maximum creation dates for the log filters
  */
 const createdFilter = (model) => {
-    const createdFrom = model.logs.getCreatedFrom();
-    const createdTo = model.logs.getCreatedTo();
+    const createdFrom = model.logs.getCreatedFilterFrom();
+    const createdTo = model.logs.getCreatedFilterTo();
     return h('', [
         h('.f6', 'From:'),
-        h('input.mv1', {
+        h('input.w-75.mv1', {
             type: 'date',
             id: 'createdFilterFrom',
             max: createdTo || today,
             value: createdFrom,
-            onchange: (e) => model.logs.setCreatedFilter('createdFrom', e.target.value, e.target.validity.valid),
+            onchange: (e) => model.logs.setCreatedFilter('createdFilterFrom', e.target.value, e.target.validity.valid),
         }, ''),
         h('.f6', 'To:'),
-        h('input.mv1', {
+        h('input.w-75.mv1', {
             type: 'date',
             id: 'createdFilterTo',
             min: createdFrom,
             max: today,
             value: createdTo,
-            onchange: (e) => model.logs.setCreatedFilter('createdTo', e.target.value, e.target.validity.valid),
+            onchange: (e) => model.logs.setCreatedFilter('createdFilterTo', e.target.value, e.target.validity.valid),
         }, ''),
     ]);
 };

lib/public/components/Filters/title.js

@@ -14,9 +14,15 @@
 import { h } from '/js/src/index.js';
 
 /**
- * TODO
- * @return {vnode} TODO
+ * Returns the title filter component
+ * @param {Object} model The global model object
+ * @return {vnode} A text box that allows the user to enter a title substring to match against all logs
  */
-const titleFilter = () => h('', 'TODO');
+const titleFilter = (model) => h('input.w-75', {
+    type: 'text',
+    id: 'titleFilterText',
+    value: model.logs.getTitleFilter(),
+    oninput: (e) => model.logs.setTitleFilter(e.target.value),
+}, '');
 
 export default titleFilter;

lib/public/views/Logs/ActiveColumns/index.js

@@ -32,7 +32,7 @@ const activeColumns = (model) => ({
         visible: true,
         size: 'cell-l',
         expand: true,
-        filter: titleFilter(),
+        filter: titleFilter(model),
     },
     author: {
         name: 'Author',

lib/public/views/Logs/Logs.js

@@ -55,8 +55,15 @@ export default class Overview extends Observable {
         const params = {
             'page[offset]': offset,
             'page[limit]': this.logsPerPage,
-            ...this.createdFrom && { 'filter[created][from]': new Date(`${this.createdFrom}T00:00:00.000`).getTime() },
-            ...this.createdTo && { 'filter[created][to]': new Date(`${this.createdTo}T23:59:59.999`).getTime() },
+            ...this.titleFilterText && {
+                'filter[title]': this.titleFilterText,
+            },
+            ...this.createdFilterFrom && {
+                'filter[created][from]': new Date(`${this.createdFilterFrom}T00:00:00.000`).getTime(),
+            },
+            ...this.createdFilterTo && {
+                'filter[created][to]': new Date(`${this.createdFilterTo}T23:59:59.999`).getTime(),
+            },
             ...this.tagFilterValues.length > 0 && {
                 'filter[tag][values]': this.tagFilterValues.join(),
                 'filter[tag][operation]': this.tagFilterOperation.toLowerCase(),
@@ -264,20 +271,41 @@ export default class Overview extends Observable {
         return this.expandedFilters.includes(targetKey);
     }
 
+    /**
+     * Returns the current title substring filter
+     * @returns {String} The current title substring filter
+     */
+    getTitleFilter() {
+        return this.titleFilterText;
+    }
+
+    /**
+     * Sets the title substring filter if no new inputs were detected for 200 milliseconds
+     * @param {String} newTitle The title substring to apply to the filter
+     * @returns {undefined}
+     */
+    setTitleFilter(newTitle) {
+        clearTimeout(this.titleFilterDebounce);
+        this.titleFilterDebounce = setTimeout(() => {
+            this.titleFilterText = newTitle.trim();
+            this.fetchAllLogs();
+        }, 200);
+    }
+
     /**
      * Returns the current minimum creation datetime
      * @returns {Integer} The current minimum creation datetime
      */
-    getCreatedFrom() {
-        return this.createdFrom;
+    getCreatedFilterFrom() {
+        return this.createdFilterFrom;
     }
 
     /**
      * Returns the current maximum creation datetime
      * @returns {Integer} The current maximum creation datetime
      */
-    getCreatedTo() {
-        return this.createdTo;
+    getCreatedFilterTo() {
+        return this.createdFilterTo;
     }
 
     /**
@@ -391,8 +419,10 @@ export default class Overview extends Observable {
         this.collapsedColumns = [];
 
         this.expandedFilters = [];
-        this.createdFrom = null;
-        this.createdTo = null;
+        this.titleFilterText = '';
+        this.titleFilterDebounce = null;
+        this.createdFilterFrom = null;
+        this.createdFilterTo = null;
         this.tagFilterOperation = 'AND';
         this.tagFilterValues = [];
         this.moreTags = false;

lib/usecases/log/GetAllLogsUseCase.js

@@ -39,7 +39,11 @@ class GetAllLogsUseCase {
         const { filter, page = {}, sort = { id: 'desc' } } = query;
 
         if (filter) {
-            const { created, origin, parentLog, rootLog } = filter;
+            const { title, created, origin, parentLog, rootLog } = filter;
+
+            if (title) {
+                queryBuilder.where('title').substring(title);
+            }
 
             if (created) {
                 const from = created.from !== undefined ? created.from : 0;

spec/openapi-source.yaml

@@ -754,6 +754,10 @@ components:
       description: Specifies the log related filter requirements for a request.
       type: object
       properties:
+        title:
+          description: Specifies the title related filter requirement for a request.
+          type: string
+          example: abc
         created:
           $ref: '#/components/schemas/FilterLogsCreatedOptions'
         tag:

spec/openapi.yaml

@@ -1,4 +1,4 @@
-# Generated on Thu, 16 Jul 2020 18:29:30 GMT
+# Generated on Thu, 16 Jul 2020 20:40:35 GMT
 
 openapi: 3.0.0
 info:
@@ -818,6 +818,10 @@ components:
           $ref: '#/components/schemas/EntityId'
         tag:
           $ref: '#/components/schemas/FilterLogsTagOptions'
+        title:
+          description: Specifies the title related filter requirement for a request.
+          type: string
+          example: abc
       additionalProperties: false
     FilterLogsTagOptions:
       description: Specifies the tag related filter requirements for a request.

test/database/utilities/QueryBuilder.test.js

@@ -105,7 +105,7 @@ module.exports = () => {
         });
 
         describe('oneOf', () => {
-            it('should return a single entity with the provided id', async () => {
+            it('should return entities with the provided id', async () => {
                 const queryBuilder = new QueryBuilder();
                 queryBuilder.where('id').oneOf('1', 2);
                 queryBuilder.orderBy('id', 'asc');
@@ -119,42 +119,80 @@ module.exports = () => {
         });
 
         describe('startsWith', () => {
-            it('should return only entities starting with "Log"', async () => {
+            it('should return only entities starting with "First"', async () => {
                 const queryBuilder = new QueryBuilder();
-                queryBuilder.where('title').startsWith('Log');
+                queryBuilder.where('title').startsWith('First');
                 queryBuilder.orderBy('id', 'asc');
 
                 const result = await LogRepository.findAll(queryBuilder);
                 expect(result).to.not.be.null;
+                result.forEach(({ title }) => {
+                    expect(title.startsWith('First')).to.be.true;
+                });
             });
 
-            it('should return only entities not starting with "Log"', async () => {
+            it('should return only entities not starting with "First"', async () => {
                 const queryBuilder = new QueryBuilder();
-                queryBuilder.where('title').not().startsWith('Log');
+                queryBuilder.where('title').not().startsWith('First');
                 queryBuilder.orderBy('id', 'asc');
 
                 const result = await LogRepository.findAll(queryBuilder);
                 expect(result).to.not.be.null;
+                result.forEach(({ title }) => {
+                    expect(title.startsWith('First')).to.be.false;
+                });
             });
         });
 
         describe('endsWith', () => {
-            it('should return only entities ending with "log"', async () => {
+            it('should return only entities ending with "entry"', async () => {
+                const queryBuilder = new QueryBuilder();
+                queryBuilder.where('title').endsWith('entry');
+                queryBuilder.orderBy('id', 'asc');
+
+                const result = await LogRepository.findAll(queryBuilder);
+                expect(result).to.not.be.null;
+                result.forEach(({ title }) => {
+                    expect(title.endsWith('entry')).to.be.true;
+                });
+            });
+
+            it('should return only entities not ending with "entry"', async () => {
+                const queryBuilder = new QueryBuilder();
+                queryBuilder.where('title').not().endsWith('entry');
+                queryBuilder.orderBy('id', 'asc');
+
+                const result = await LogRepository.findAll(queryBuilder);
+                expect(result).to.not.be.null;
+                result.forEach(({ title }) => {
+                    expect(title.endsWith('entry')).to.be.false;
+                });
+            });
+        });
+
+        describe('substring', () => {
+            it('should return only entities containing "entr"', async () => {
                 const queryBuilder = new QueryBuilder();
-                queryBuilder.where('title').endsWith('log');
+                queryBuilder.where('title').substring('entr');
                 queryBuilder.orderBy('id', 'asc');
 
                 const result = await LogRepository.findAll(queryBuilder);
                 expect(result).to.not.be.null;
+                result.forEach(({ title }) => {
+                    expect(title.includes('entr')).to.be.true;
+                });
             });
 
-            it('should return only entities not ending with "log"', async () => {
+            it('should return only entities not containing "og"', async () => {
                 const queryBuilder = new QueryBuilder();
-                queryBuilder.where('title').not().endsWith('log');
+                queryBuilder.where('title').not().substring('entr');
                 queryBuilder.orderBy('id', 'asc');
 
                 const result = await LogRepository.findAll(queryBuilder);
                 expect(result).to.not.be.null;
+                result.forEach(({ title }) => {
+                    expect(title.includes('entr')).to.be.false;
+                });
             });
         });
     });