From b3c9cd656df1f604aaa68a219e035a02b78e84f9 Mon Sep 17 00:00:00 2001
From: Nabil Adouani <nabil.adouani@gmail.com>
Date: Wed, 21 Oct 2020 16:56:26 +0200
Subject: [PATCH] #1579 WIP: Add a multi selection filter for match criteria

---
 .../alert/AlertSimilarCaseListCmp.js          | 25 ++++++++++++++-----
 .../alert/similar-case-list.component.html    |  8 +++---
 2 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/frontend/app/scripts/components/alert/AlertSimilarCaseListCmp.js b/frontend/app/scripts/components/alert/AlertSimilarCaseListCmp.js
index 44a501fea4..4e412fade0 100644
--- a/frontend/app/scripts/components/alert/AlertSimilarCaseListCmp.js
+++ b/frontend/app/scripts/components/alert/AlertSimilarCaseListCmp.js
@@ -9,8 +9,11 @@
                 self.CaseResolutionStatus = CaseResolutionStatus;
 
                 self.similarityFilters = {
-                    fTitle: undefined,
-                    fMatches: undefined
+                    fTitle: undefined
+                };
+
+                self.matchFilters = {
+                    fMatches: []
                 };
 
                 self.rateFilters = {
@@ -89,8 +92,11 @@
                 // Frontend filter methods
                 this.clearLocalFilters = function() {
                     self.similarityFilters = {
-                        fTitle: undefined,
-                        fMatches: undefined
+                        fTitle: undefined
+                    };
+
+                    self.matchFilters = {
+                        fMatches: []
                     };
 
                     self.rateFilters = {
@@ -101,8 +107,15 @@
 
                 this.greaterThan = function(prop){
                     return function(item){
-                      return !self.rateFilters[prop] || item[prop] >= self.rateFilters[prop];
-                  };
+                        return !self.rateFilters[prop] || item[prop] >= self.rateFilters[prop];
+                    };
+                };
+
+                this.matchFilter = function() {
+                    return function(item){
+                        return !self.matchFilters.fMatches || self.matchFilters.fMatches.length === 0 ||
+                            _.intersection(self.matchFilters.fMatches, item.fMatches).length > 0;
+                    };
                 };
 
                 // Filtering methods
diff --git a/frontend/app/views/components/alert/similar-case-list.component.html b/frontend/app/views/components/alert/similar-case-list.component.html
index 013d8d73b8..e870abc60d 100644
--- a/frontend/app/views/components/alert/similar-case-list.component.html
+++ b/frontend/app/views/components/alert/similar-case-list.component.html
@@ -89,10 +89,8 @@
                 </div>
                 <div class="case-similarity-match text-bold">
                     <div>
-                        <select class="form-control input-sm" ng-model="$cmp.similarityFilters.fMatches"
-                            ng-options="item for item in $cmp.matches">
-                            <option value=""></option>
-                        </select>
+                        <multiselect ng-model="$cmp.matchFilters.fMatches" options="$cmp.matches" show-select-all="true" show-unselect-all="true"
+                            classes-btn="'btn-default btn-block btn-sm'"></multiselect>
                     </div>
                 </div>
                 <div class="case-similarity-merge text-bold">
@@ -103,7 +101,7 @@
             </div>
 
             <!-- Table data -->
-            <div class="case-collection" ng-repeat="item in ($cmp.filteredCases = ($cmp.list.allValues | filter:$cmp.similarityFilters | filter:$cmp.greaterThan('fObservables') | filter:$cmp.greaterThan('fIocs')) | orderBy:$cmp.sortField | limitTo:$cmp.pagination.pageSize:($cmp.pagination.currentPage-1)*$cmp.pagination.pageSize)">
+            <div class="case-collection" ng-repeat="item in ($cmp.filteredCases = ($cmp.list.allValues | filter:$cmp.similarityFilters | filter:$cmp.matchFilter() | filter:$cmp.greaterThan('fObservables') | filter:$cmp.greaterThan('fIocs')) | orderBy:$cmp.sortField | limitTo:$cmp.pagination.pageSize:($cmp.pagination.currentPage-1)*$cmp.pagination.pageSize)">
                 <div class="case-item" >
                     <!-- case tlp -->
                     <div class="case-tlp bg-tlp-{{item.case.tlp}} clickable" ng-click="$cmp.addFilterValue('tlp', item.case.tlp)"></div>