adapt filter component for work with include/exclude modes

app/coffee/modules/controllerMixins.coffee

@@ -63,8 +63,14 @@ taiga.PageMixin = PageMixin
 # This mixin requires @location ($tgLocation), and @scope
 
 class FiltersMixin
-    selectFilter: (name, value, load=false) ->
+    excludePrefix: "exclude_"
+
+    selectFilter: (name, value, load=false, mode="include") ->
         params = @location.search()
+
+        if mode == "exclude"
+            name = @.excludePrefix.concat(name)
+
         if params[name] != undefined and name != "page"
             existing = _.map(taiga.toString(params[name]).split(","), (x) -> trim(x))
             existing.push(taiga.toString(value))
@@ -84,9 +90,12 @@ class FiltersMixin
         location = if load then @location else @location.noreload(@scope)
         location.search(filters)
 
-    unselectFilter: (name, value, load=false) ->
+    unselectFilter: (name, value, load=false, mode='include') ->
         params = @location.search()
 
+        if mode == "exclude"
+            name = @.excludePrefix.concat(name)
+
         if params[name] is undefined
             return
 
@@ -127,7 +136,7 @@ class FiltersMixin
 
         return @storage.get(hash) or {}
 
-    formatSelectedFilters: (type, list, urlIds) ->
+    formatSelectedFilters: (type, list, urlIds, mode="include") ->
         selectedIds = urlIds.split(',')
         selectedFilters = _.filter list, (it) ->
             selectedIds.indexOf(_.toString(it.id)) != -1
@@ -141,6 +150,7 @@ class FiltersMixin
                 key: type + ":" + it
                 dataType: type,
                 name: it
+                mode: mode
             }
 
         validAppliedTags = _.map selectedFilters, (it) ->
@@ -150,6 +160,7 @@ class FiltersMixin
                 dataType: type,
                 name: it.name
                 color: it.color
+                mode: mode
             }
 
         return invalidAppliedTags.concat(validAppliedTags)

app/modules/components/filter/filter.controller.coffee

@@ -63,6 +63,7 @@ class FilterController
         filter = {
             category: filterCategory
             filter: filter
+            mode: @.filterMode
         }
 
         @.onAddFilter({filter: filter})

app/modules/components/filter/filter.jade

@@ -17,7 +17,10 @@ form(name="vm.filtersForm")
 
 .filters-step-cat
     .filters-applied
-        .single-filter.ng-animate-disabled(ng-repeat="it in vm.selectedFilters track by it.key")
+        .single-filter.ng-animate-disabled(
+            ng-repeat="it in vm.selectedFilters track by it.key"
+            class="{{it.mode}}"
+            )
             span.name(
                 ng-attr-style="{{it.color ? 'border-color: ' + it.color: ''}}"
                 ng-if="it.dataType === 'tags'"

app/modules/components/filter/filter.scss

@@ -13,6 +13,10 @@ tg-filter {
     .filters-applied {
         padding: 0 1rem 1rem;
         .single-filter {
+            &.exclude {
+                background: $red-light;
+                text-decoration: line-through;
+            }
             &:hover {
                 color: currentColor;
                 cursor: default;