Refactor query param handling to service

src-ui/src/app/components/app-frame/app-frame.component.ts

@@ -22,6 +22,7 @@ import {
   RemoteVersionService,
   AppRemoteVersion,
 } from 'src/app/services/rest/remote-version.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 
 @Component({
   selector: 'app-app-frame',
@@ -37,7 +38,8 @@ export class AppFrameComponent {
     public savedViewService: SavedViewService,
     private list: DocumentListViewService,
     private meta: Meta,
-    private remoteVersionService: RemoteVersionService
+    private remoteVersionService: RemoteVersionService,
+    private queryParamsService: QueryParamsService
   ) {
     this.remoteVersionService
       .checkForUpdates()
@@ -92,7 +94,7 @@ export class AppFrameComponent {
 
   search() {
     this.closeMenu()
-    this.list.quickFilter([
+    this.queryParamsService.loadFilterRules([
       {
         rule_type: FILTER_FULLTEXT_QUERY,
         value: (this.searchField.value as string).trim(),

src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.ts

@@ -3,11 +3,11 @@ import { Router } from '@angular/router'
 import { Subscription } from 'rxjs'
 import { PaperlessDocument } from 'src/app/data/paperless-document'
 import { PaperlessSavedView } from 'src/app/data/paperless-saved-view'
-import { DocumentListViewService } from 'src/app/services/document-list-view.service'
 import { ConsumerStatusService } from 'src/app/services/consumer-status.service'
 import { DocumentService } from 'src/app/services/rest/document.service'
 import { PaperlessTag } from 'src/app/data/paperless-tag'
 import { FILTER_HAS_TAGS_ALL } from 'src/app/data/filter-rule-type'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 
 @Component({
   selector: 'app-saved-view-widget',
@@ -18,7 +18,7 @@ export class SavedViewWidgetComponent implements OnInit, OnDestroy {
   constructor(
     private documentService: DocumentService,
     private router: Router,
-    private list: DocumentListViewService,
+    private queryParamsService: QueryParamsService,
     private consumerStatusService: ConsumerStatusService
   ) {}
 
@@ -67,7 +67,7 @@ export class SavedViewWidgetComponent implements OnInit, OnDestroy {
   }
 
   clickTag(tag: PaperlessTag) {
-    this.list.quickFilter([
+    this.queryParamsService.loadFilterRules([
       { rule_type: FILTER_HAS_TAGS_ALL, value: tag.id.toString() },
     ])
   }

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

@@ -35,6 +35,7 @@ import {
 import { PaperlessDocumentSuggestions } from 'src/app/data/paperless-document-suggestions'
 import { FILTER_FULLTEXT_MORELIKE } from 'src/app/data/filter-rule-type'
 import { normalizeDateStr } from 'src/app/utils/date'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 
 @Component({
   selector: 'app-document-detail',
@@ -114,7 +115,8 @@ export class DocumentDetailComponent
     private documentListViewService: DocumentListViewService,
     private documentTitlePipe: DocumentTitlePipe,
     private toastService: ToastService,
-    private settings: SettingsService
+    private settings: SettingsService,
+    private queryParamsService: QueryParamsService
   ) {
     this.titleSubject
       .pipe(
@@ -446,7 +448,7 @@ export class DocumentDetailComponent
   }
 
   moreLike() {
-    this.documentListViewService.quickFilter([
+    this.queryParamsService.loadFilterRules([
       {
         rule_type: FILTER_FULLTEXT_MORELIKE,
         value: this.documentId.toString(),

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

@@ -31,6 +31,7 @@ import {
 } from 'src/app/directives/sortable.directive'
 import { ConsumerStatusService } from 'src/app/services/consumer-status.service'
 import { DocumentListViewService } from 'src/app/services/document-list-view.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 import {
   DocumentService,
   DOCUMENT_SORT_FIELDS,
@@ -55,7 +56,8 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
     private router: Router,
     private toastService: ToastService,
     private modalService: NgbModal,
-    private consumerStatusService: ConsumerStatusService
+    private consumerStatusService: ConsumerStatusService,
+    private queryParamsService: QueryParamsService
   ) {}
 
   @ViewChild('filterEditor')
@@ -127,10 +129,6 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
         this.unmodifiedFilterRules = view.filter_rules
       })
 
-    const allFilterRuleQueryParams: string[] = FILTER_RULE_TYPES.map(
-      (rt) => rt.filtervar
-    )
-
     this.route.queryParamMap
       .pipe(
         filter(() => !this.route.snapshot.paramMap.has('id')), // only when not on saved view
@@ -140,30 +138,9 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
         if (queryParams.has('view')) {
           this.loadViewConfig(parseInt(queryParams.get('view')))
         } else {
-          // transform query params to filter rules
-          let filterRulesFromQueryParams: FilterRule[] = []
-          allFilterRuleQueryParams
-            .filter((frqp) => queryParams.has(frqp))
-            .forEach((filterQueryParamName) => {
-              const filterQueryParamValues: string[] = queryParams
-                .get(filterQueryParamName)
-                .split(',')
-
-              filterRulesFromQueryParams = filterRulesFromQueryParams.concat(
-                // map all values to filter rules
-                filterQueryParamValues.map((val) => {
-                  return {
-                    rule_type: FILTER_RULE_TYPES.find(
-                      (rt) => rt.filtervar == filterQueryParamName
-                    ).id,
-                    value: val,
-                  }
-                })
-              )
-            })
-
           this.list.activateSavedView(null)
-          this.list.filterRules = filterRulesFromQueryParams
+          this.queryParamsService.params = queryParams
+          this.list.filterRules = this.queryParamsService.filterRules
           this.list.reload()
           this.unmodifiedFilterRules = []
         }
@@ -175,8 +152,7 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
       .pipe(takeUntil(this.unsubscribeNotifier))
       .subscribe({
         next: (filterRules) => {
-          const params =
-            this.documentService.filterRulesToQueryParams(filterRules)
+          this.queryParamsService.filterRules = filterRules
 
           // if we were on a saved view we navigate 'away' to /documents
           let base = []
@@ -184,7 +160,7 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
 
           this.router.navigate(base, {
             relativeTo: this.route,
-            queryParams: params,
+            queryParams: this.queryParamsService.params,
           })
         },
       })
@@ -296,7 +272,7 @@ export class DocumentListComponent implements OnInit, OnDestroy, AfterViewInit {
   }
 
   clickMoreLike(documentID: number) {
-    this.list.quickFilter([
+    this.queryParamsService.loadFilterRules([
       { rule_type: FILTER_FULLTEXT_MORELIKE, value: documentID.toString() },
     ])
   }

src-ui/src/app/components/manage/correspondent-list/correspondent-list.component.ts

@@ -3,7 +3,7 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { FILTER_CORRESPONDENT } from 'src/app/data/filter-rule-type'
 import { PaperlessCorrespondent } from 'src/app/data/paperless-correspondent'
 import { CustomDatePipe } from 'src/app/pipes/custom-date.pipe'
-import { DocumentListViewService } from 'src/app/services/document-list-view.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 import { CorrespondentService } from 'src/app/services/rest/correspondent.service'
 import { ToastService } from 'src/app/services/toast.service'
 import { CorrespondentEditDialogComponent } from '../../common/edit-dialog/correspondent-edit-dialog/correspondent-edit-dialog.component'
@@ -20,7 +20,7 @@ export class CorrespondentListComponent extends ManagementListComponent<Paperles
     correspondentsService: CorrespondentService,
     modalService: NgbModal,
     toastService: ToastService,
-    list: DocumentListViewService,
+    queryParamsService: QueryParamsService,
     private datePipe: CustomDatePipe
   ) {
     super(
@@ -28,7 +28,7 @@ export class CorrespondentListComponent extends ManagementListComponent<Paperles
       modalService,
       CorrespondentEditDialogComponent,
       toastService,
-      list,
+      queryParamsService,
       FILTER_CORRESPONDENT,
       $localize`correspondent`,
       [

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

@@ -2,7 +2,7 @@ import { Component } from '@angular/core'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { FILTER_DOCUMENT_TYPE } from 'src/app/data/filter-rule-type'
 import { PaperlessDocumentType } from 'src/app/data/paperless-document-type'
-import { DocumentListViewService } from 'src/app/services/document-list-view.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 import { DocumentTypeService } from 'src/app/services/rest/document-type.service'
 import { ToastService } from 'src/app/services/toast.service'
 import { DocumentTypeEditDialogComponent } from '../../common/edit-dialog/document-type-edit-dialog/document-type-edit-dialog.component'
@@ -18,14 +18,14 @@ export class DocumentTypeListComponent extends ManagementListComponent<Paperless
     documentTypeService: DocumentTypeService,
     modalService: NgbModal,
     toastService: ToastService,
-    list: DocumentListViewService
+    queryParamsService: QueryParamsService
   ) {
     super(
       documentTypeService,
       modalService,
       DocumentTypeEditDialogComponent,
       toastService,
-      list,
+      queryParamsService,
       FILTER_DOCUMENT_TYPE,
       $localize`document type`,
       []

src-ui/src/app/components/manage/management-list/management-list.component.ts

@@ -19,6 +19,7 @@ import {
   SortEvent,
 } from 'src/app/directives/sortable.directive'
 import { DocumentListViewService } from 'src/app/services/document-list-view.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 import { AbstractNameFilterService } from 'src/app/services/rest/abstract-name-filter-service'
 import { ToastService } from 'src/app/services/toast.service'
 import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
@@ -42,7 +43,7 @@ export abstract class ManagementListComponent<T extends ObjectWithId>
     private modalService: NgbModal,
     private editDialogComponent: any,
     private toastService: ToastService,
-    private list: DocumentListViewService,
+    private queryParamsService: QueryParamsService,
     protected filterRuleType: number,
     public typeName: string,
     public extraColumns: ManagementListColumn[]
@@ -140,7 +141,7 @@ export abstract class ManagementListComponent<T extends ObjectWithId>
   }
 
   filterDocuments(object: ObjectWithId) {
-    this.list.quickFilter([
+    this.queryParamsService.loadFilterRules([
       { rule_type: this.filterRuleType, value: object.id.toString() },
     ])
   }

src-ui/src/app/components/manage/tag-list/tag-list.component.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { FILTER_HAS_TAGS_ALL } from 'src/app/data/filter-rule-type'
 import { PaperlessTag } from 'src/app/data/paperless-tag'
-import { DocumentListViewService } from 'src/app/services/document-list-view.service'
+import { QueryParamsService } from 'src/app/services/query-params.service'
 import { TagService } from 'src/app/services/rest/tag.service'
 import { ToastService } from 'src/app/services/toast.service'
 import { TagEditDialogComponent } from '../../common/edit-dialog/tag-edit-dialog/tag-edit-dialog.component'
@@ -18,14 +18,14 @@ export class TagListComponent extends ManagementListComponent<PaperlessTag> {
     tagService: TagService,
     modalService: NgbModal,
     toastService: ToastService,
-    list: DocumentListViewService
+    queryParamsService: QueryParamsService
   ) {
     super(
       tagService,
       modalService,
       TagEditDialogComponent,
       toastService,
-      list,
+      queryParamsService,
       FILTER_HAS_TAGS_ALL,
       $localize`tag`,
       [