[ACA-3506] - Filter are kept when reloaded (#5885)

* [ADF] - saving in the url the filter values

* Fixed filter status on refresh

* Fixed filter status on refresh

* [ACA-3506] - added url filtering save

* [ACA-3506] - fixed spellcheck

* improve log

* more log

* fix scripts

* Added documentation for allowUpdateOnChange setting

* Added default value in description for docs

Co-authored-by: Vito Albano <vitoalbano@Vitos-MacBook-Pro.local>
Co-authored-by: Eugenio Romano <eugenio.romano@alfresco.com>

demo-shell/src/app/components/files/files.component.html

@@ -240,11 +240,13 @@
                 <adf-custom-header-filter-template *ngIf="enableCustomHeaderFilter">
                     <ng-template let-col>
                         <adf-search-header [col]="col"
+                                           [value]="paramValues? paramValues[col.key] : null"
                                            [currentFolderNodeId]="currentFolderId"
                                            [maxItems]="pagination?.maxItems"
                                            [skipCount]="pagination?.skipCount"
                                            (update)="onFilterUpdate($event)"
-                                           (clear)="onAllFilterCleared()">
+                                           (clear)="onAllFilterCleared()"
+                                           (selection)="onFilterSelected($event)">
                         </adf-search-header>
                     </ng-template>
                 </adf-custom-header-filter-template>

demo-shell/src/app/components/files/files.component.ts

@@ -163,6 +163,9 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     @Input()
     enableCustomHeaderFilter = false;
 
+    @Input()
+    paramValues: Map <any, any> = null;
+
     @Output()
     documentListReady: EventEmitter<any> = new EventEmitter();
 
@@ -655,7 +658,27 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
 
     onAllFilterCleared() {
         this.documentList.node = null;
+        if (this.currentFolderId === '-my-') {
+            this.router.navigate([this.navigationRoute, '']);
+        } else {
+            this.router.navigate([this.navigationRoute, this.currentFolderId, 'display', this.displayMode]);
+        }
         this.documentList.reload();
     }
 
+    onFilterSelected(currentActiveFilters: Map<string, string>) {
+        const objectFromMap = {};
+        currentActiveFilters.forEach((value: any, key) => {
+            let paramValue = null;
+            if (value && value.from && value.to) {
+                paramValue = `${value.from}||${value.to}`;
+            } else {
+                paramValue = value;
+            }
+            objectFromMap[key] = paramValue;
+        });
+
+        this.router.navigate([], { relativeTo: this.route, queryParams: objectFromMap });
+    }
+
 }

demo-shell/src/app/components/files/filtered-search.component.html

@@ -4,5 +4,6 @@
                      [showSettingsPanel]="false"
                      [navigationRoute]="navigationRoute"
                      [currentFolderId]="currentFolderId"
-                     [enableCustomHeaderFilter]="true">
+                     [enableCustomHeaderFilter]="true"
+                     [paramValues]="queryParams">
 </app-files-component>

demo-shell/src/app/components/files/filtered-search.component.ts

@@ -29,13 +29,20 @@ export class FilteredSearchComponent {
     navigationRoute = '/filtered-search';
     currentFolderId = '-my-';
 
+    queryParams = null;
+
     constructor(@Optional() private route: ActivatedRoute) {
+
         if (this.route) {
             this.route.params.forEach((params: Params) => {
                 if (params['id'] && this.currentFolderId !== params['id']) {
                     this.currentFolderId = params['id'];
                 }
             });
+
+            this.route.queryParamMap.subscribe((queryMap: Params) => {
+                this.queryParams = queryMap.params;
+            });
         }
     }