Refactor markdown/sanitize html code

[github/Chocobozzz/PeerTube.git] / client / src / app / core / rest / rest-table.ts

diff --git a/client/src/app/core/rest/rest-table.ts b/client/src/app/core/rest/rest-table.ts
index 1b35ad47d171687d9691af4797bfa8c68476fbae..50f6bf39de00a6bd6e8a229eb66c9b032c0212b7 100644 (file)
--- a/client/src/app/core/rest/rest-table.ts
+++ b/client/src/app/core/rest/rest-table.ts
@@ -1,8 +1,12 @@
-import { peertubeLocalStorage } from '@app/helpers/peertube-web-storage'
+import * as debug from 'debug'
 import { LazyLoadEvent, SortMeta } from 'primeng/api'
-import { RestPagination } from './rest-pagination'
 import { Subject } from 'rxjs'
 import { debounceTime, distinctUntilChanged } from 'rxjs/operators'
+import { ActivatedRoute, Params, Router } from '@angular/router'
+import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
+import { RestPagination } from './rest-pagination'
+
+const logger = debug('peertube:tables:RestTable')
 
 export abstract class RestTable {
 
@@ -15,7 +19,12 @@ export abstract class RestTable {
   rowsPerPage = this.rowsPerPageOptions[0]
   expandedRows = {}
 
-  private searchStream: Subject<string>
+  baseRoute: string
+
+  protected searchStream: Subject<string>
+
+  protected route: ActivatedRoute
+  protected router: Router
 
   abstract getIdentifier (): string
 
@@ -37,6 +46,8 @@ export abstract class RestTable {
   }
 
   loadLazy (event: LazyLoadEvent) {
+    logger('Load lazy %o.', event)
+
     this.sort = {
       order: event.sortOrder,
       field: event.sortField
@@ -65,6 +76,9 @@ export abstract class RestTable {
       )
       .subscribe(search => {
         this.search = search
+
+        logger('On search %s.', this.search)
+
         this.loadData()
       })
   }
@@ -72,17 +86,48 @@ export abstract class RestTable {
   onSearch (event: Event) {
     const target = event.target as HTMLInputElement
     this.searchStream.next(target.value)
+
+    this.setQueryParams((event.target as HTMLInputElement).value)
+  }
+
+  setQueryParams (search: string) {
+    if (!this.baseRoute) return
+
+    const queryParams: Params = {}
+
+    if (search) Object.assign(queryParams, { search })
+    this.router.navigate([ this.baseRoute ], { queryParams })
+  }
+
+  resetTableFilter () {
+    this.setTableFilter('')
+    this.setQueryParams('')
+    this.resetSearch()
+  }
+
+  listenToSearchChange () {
+    this.route.queryParams
+      .subscribe(params => {
+        this.search = params.search || ''
+
+        this.setTableFilter(this.search)
+        this.loadData()
+      })
   }
 
   onPage (event: { first: number, rows: number }) {
+    logger('On page %o.', event)
+
     if (this.rowsPerPage !== event.rows) {
       this.rowsPerPage = event.rows
       this.pagination = {
         start: event.first,
         count: this.rowsPerPage
       }
+
       this.loadData()
     }
+
     this.expandedRows = {}
   }