Tweakhancement: reset to page 1 on reset filters (#12143)

src-ui/src/app/components/document-list/document-list.component.html

@@ -117,7 +117,7 @@
 </pngx-page-header>
 
 <div class="row sticky-top py-3 mt-n2 mt-md-n3 bg-body">
-  <pngx-filter-editor [hidden]="isBulkEditing" [disabled]="isBulkEditing" [(filterRules)]="list.filterRules" [unmodifiedFilterRules]="unmodifiedFilterRules" [selectionData]="list.selectionData" #filterEditor></pngx-filter-editor>
+  <pngx-filter-editor [hidden]="isBulkEditing" [disabled]="isBulkEditing" [filterRules]="list.filterRules" (filterRulesChange)="onFilterRulesChange($event)" (resetFilterRules)="onFilterRulesReset($event)" [unmodifiedFilterRules]="unmodifiedFilterRules" [selectionData]="list.selectionData" #filterEditor></pngx-filter-editor>
   <pngx-bulk-editor [hidden]="!isBulkEditing" [disabled]="!isBulkEditing"></pngx-bulk-editor>
 </div>
 

src-ui/src/app/components/document-list/document-list.component.spec.ts

@@ -147,21 +147,21 @@ describe('DocumentListComponent', () => {
   })
 
   it('should show score sort fields on fulltext queries', () => {
-    documentListService.filterRules = [
+    documentListService.setFilterRules([
       {
         rule_type: FILTER_HAS_TAGS_ANY,
         value: '10',
       },
-    ]
+    ])
     fixture.detectChanges()
     expect(component.getSortFields()).toEqual(documentListService.sortFields)
 
-    documentListService.filterRules = [
+    documentListService.setFilterRules([
       {
         rule_type: FILTER_FULLTEXT_QUERY,
         value: 'foo',
       },
-    ]
+    ])
     fixture.detectChanges()
     expect(component.getSortFields()).toEqual(
       documentListService.sortFieldsFullText
@@ -170,12 +170,12 @@ describe('DocumentListComponent', () => {
 
   it('should determine if filtered, support reset', () => {
     fixture.detectChanges()
-    documentListService.filterRules = [
+    documentListService.setFilterRules([
       {
         rule_type: FILTER_HAS_TAGS_ANY,
         value: '10',
       },
-    ]
+    ])
     documentListService.isReloading = false
     fixture.detectChanges()
     expect(component.isFiltered).toBeTruthy()
@@ -185,6 +185,20 @@ describe('DocumentListComponent', () => {
     expect(fixture.nativeElement.textContent.match(/Reset/g)).toHaveLength(1)
   })
 
+  it('should apply filter rule changes via list service', () => {
+    const setFilterRulesSpy = jest.spyOn(documentListService, 'setFilterRules')
+    const rules = [{ rule_type: FILTER_HAS_TAGS_ANY, value: '10' }]
+    component.onFilterRulesChange(rules)
+    expect(setFilterRulesSpy).toHaveBeenCalledWith(rules)
+  })
+
+  it('should reset filter rules to page one via list service', () => {
+    const setFilterRulesSpy = jest.spyOn(documentListService, 'setFilterRules')
+    const rules = [{ rule_type: FILTER_HAS_TAGS_ANY, value: '10' }]
+    component.onFilterRulesReset(rules)
+    expect(setFilterRulesSpy).toHaveBeenCalledWith(rules, true)
+  })
+
   it('should load saved view from URL', () => {
     const view: SavedView = {
       id: 10,
@@ -217,7 +231,7 @@ describe('DocumentListComponent', () => {
       .spyOn(activatedRoute, 'paramMap', 'get')
       .mockReturnValue(of(convertToParamMap(queryParams)))
     activatedRoute.snapshot.queryParams = queryParams
-    fixture.detectChanges()
+    component.ngOnInit()
     expect(getSavedViewSpy).toHaveBeenCalledWith(view.id)
     expect(activateSavedViewSpy).toHaveBeenCalledWith(
       view,

src-ui/src/app/components/document-list/document-list.component.ts

@@ -212,6 +212,14 @@ export class DocumentListComponent
     this.list.setSort(event.column, event.reverse)
   }
 
+  onFilterRulesChange(filterRules: FilterRule[]) {
+    this.list.setFilterRules(filterRules)
+  }
+
+  onFilterRulesReset(filterRules: FilterRule[]) {
+    this.list.setFilterRules(filterRules, true)
+  }
+
   get isBulkEditing(): boolean {
     return this.list.selected.size > 0
   }
@@ -300,7 +308,7 @@ export class DocumentListComponent
         if (this.list.selected.size > 0) {
           this.list.selectNone()
         } else if (this.isFiltered) {
-          this.filterEditor.resetSelected()
+          this.resetFilters()
         }
       })
 

src-ui/src/app/components/document-list/filter-editor/filter-editor.component.spec.ts

@@ -2107,6 +2107,22 @@ describe('FilterEditorComponent', () => {
     expect(component.filterRules).toEqual(rules)
   })
 
+  it('should emit reset filter rules when resetting', () => {
+    const rules = [{ rule_type: FILTER_HAS_TAGS_ANY, value: '2' }]
+    component.unmodifiedFilterRules = rules
+    component.filterRules = [
+      { rule_type: FILTER_DOES_NOT_HAVE_TAG, value: '2' },
+    ]
+
+    const resetFilterRulesSpy = jest.spyOn(component.resetFilterRules, 'next')
+    const filterRulesChangeSpy = jest.spyOn(component.filterRulesChange, 'next')
+
+    component.resetSelected()
+
+    expect(resetFilterRulesSpy).toHaveBeenCalledWith(rules)
+    expect(filterRulesChangeSpy).not.toHaveBeenCalled()
+  })
+
   it('should support resetting text field', () => {
     component.textFilter = 'foo'
     component.resetTextField()

src-ui/src/app/components/document-list/filter-editor/filter-editor.component.ts

@@ -1101,6 +1101,9 @@ export class FilterEditorComponent
   @Output()
   filterRulesChange = new EventEmitter<FilterRule[]>()
 
+  @Output()
+  resetFilterRules = new EventEmitter<FilterRule[]>()
+
   @Input()
   set selectionData(selectionData: SelectionData) {
     this.tagDocumentCounts = selectionData?.selected_tags ?? null
@@ -1244,7 +1247,7 @@ export class FilterEditorComponent
     this.textFilterTarget = TEXT_FILTER_TARGET_TITLE_CONTENT
     this.documentService.searchQuery = ''
     this.filterRules = this._unmodifiedFilterRules
-    this.updateRules()
+    this.resetFilterRules.next(this.filterRules)
   }
 
   toggleTag(tagId: number) {