Ability to clean list searches

src/app/components/filters-dropdown/list-filters/list-filters.component.html

@@ -59,6 +59,10 @@ <h4>
                   {{ 'FILE' |  translate }}
                 </mat-button-toggle>
               </mat-button-toggle-group>
+              <button mat-flat-button aria-label="Clean" class="clean-input-button"
+                  (click)="onCleanListInput()">
+                  {{ 'CLEAN_INPUT' | translate }}
+              </button>
             </div>
           </div>
           <div class="input-field-container">
@@ -68,6 +72,7 @@ <h4>
                         [(ngModel)]="searchList"
                         style="height: 150px;"
                         placeholder="{{ 'LIST_OF' | translate }} {{ mode === types.SCENE ? ( 'SCENE_NAMES' | translate ): ( 'FILE_IDS'|translate ) }}">
+
               </textarea>
             </mat-form-field>
             <div class="drop-file-area file-upload-container"

src/app/components/filters-dropdown/list-filters/list-filters.component.scss

@@ -104,3 +104,7 @@
     margin-top: 8px;
   }
 }
+
+.clean-input-button {
+  margin: 4px;
+}

src/app/components/filters-dropdown/list-filters/list-filters.component.ts

@@ -173,6 +173,23 @@ export class ListFiltersComponent implements OnInit, OnDestroy {
     this.newListInput$.next(text);
   }
 
+  public onCleanListInput(): void {
+    if (!this.searchList) {
+      return
+    }
+
+    const charsToRemove = /[\'\"\[\]\:\n\,\{\}\(\)\=\.]/g;
+
+    const cleanList = this.searchList
+      .replace(charsToRemove, '')
+      .split(' ')
+      .filter(listItem => listItem !== '')
+      .join(', ')
+
+    this.searchList = cleanList;
+    this.setNewListInput(cleanList);
+  }
+
   public onNewListSearchMode(mode: models.ListSearchType): void {
     this.store$.dispatch(new filtersStore.SetListSearchType(mode));
   }