diff options
author | Rigel Kent <sendmemail@rigelk.eu> | 2021-01-13 09:16:15 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-01-13 09:16:15 +0100 |
commit | d8b34ee55b654912f86bb8b472d391ced8c28f64 (patch) | |
tree | efa2b8ac36c00fa6e9b5af3f13e54a47bc7a7701 /client/src/app/+my-library/my-history/my-history.component.ts | |
parent | 22078471fbe5a4dea6177bd1fa19da1cf887679e (diff) | |
download | PeerTube-d8b34ee55b654912f86bb8b472d391ced8c28f64.tar.gz PeerTube-d8b34ee55b654912f86bb8b472d391ced8c28f64.tar.zst PeerTube-d8b34ee55b654912f86bb8b472d391ced8c28f64.zip |
Allow user to search through their watch history (#3576)
* allow user to search through their watch history
* add tests for search in watch history
* Update client/src/app/shared/shared-main/users/user-history.service.ts
Diffstat (limited to 'client/src/app/+my-library/my-history/my-history.component.ts')
-rw-r--r-- | client/src/app/+my-library/my-history/my-history.component.ts | 34 |
1 files changed, 32 insertions, 2 deletions
diff --git a/client/src/app/+my-library/my-history/my-history.component.ts b/client/src/app/+my-library/my-history/my-history.component.ts index 4ba95124d..0c8e4b83f 100644 --- a/client/src/app/+my-library/my-history/my-history.component.ts +++ b/client/src/app/+my-library/my-history/my-history.component.ts | |||
@@ -13,6 +13,8 @@ import { | |||
13 | import { immutableAssign } from '@app/helpers' | 13 | import { immutableAssign } from '@app/helpers' |
14 | import { UserHistoryService } from '@app/shared/shared-main' | 14 | import { UserHistoryService } from '@app/shared/shared-main' |
15 | import { AbstractVideoList } from '@app/shared/shared-video-miniature' | 15 | import { AbstractVideoList } from '@app/shared/shared-video-miniature' |
16 | import { Subject } from 'rxjs' | ||
17 | import { debounceTime, tap, distinctUntilChanged } from 'rxjs/operators' | ||
16 | 18 | ||
17 | @Component({ | 19 | @Component({ |
18 | templateUrl: './my-history.component.html', | 20 | templateUrl: './my-history.component.html', |
@@ -26,6 +28,9 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD | |||
26 | totalItems: null | 28 | totalItems: null |
27 | } | 29 | } |
28 | videosHistoryEnabled: boolean | 30 | videosHistoryEnabled: boolean |
31 | search: string | ||
32 | |||
33 | protected searchStream: Subject<string> | ||
29 | 34 | ||
30 | constructor ( | 35 | constructor ( |
31 | protected router: Router, | 36 | protected router: Router, |
@@ -41,7 +46,7 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD | |||
41 | ) { | 46 | ) { |
42 | super() | 47 | super() |
43 | 48 | ||
44 | this.titlePage = $localize`My videos history` | 49 | this.titlePage = $localize`My watch history` |
45 | } | 50 | } |
46 | 51 | ||
47 | ngOnInit () { | 52 | ngOnInit () { |
@@ -52,6 +57,28 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD | |||
52 | this.videosHistoryEnabled = this.authService.getUser().videosHistoryEnabled | 57 | this.videosHistoryEnabled = this.authService.getUser().videosHistoryEnabled |
53 | }) | 58 | }) |
54 | 59 | ||
60 | this.searchStream = new Subject() | ||
61 | |||
62 | this.searchStream | ||
63 | .pipe( | ||
64 | debounceTime(400), | ||
65 | distinctUntilChanged() | ||
66 | ) | ||
67 | .subscribe(search => { | ||
68 | this.search = search | ||
69 | this.reloadVideos() | ||
70 | }) | ||
71 | } | ||
72 | |||
73 | onSearch (event: Event) { | ||
74 | const target = event.target as HTMLInputElement | ||
75 | this.searchStream.next(target.value) | ||
76 | } | ||
77 | |||
78 | resetSearch () { | ||
79 | const searchInput = document.getElementById('history-search') as HTMLInputElement | ||
80 | searchInput.value = '' | ||
81 | this.searchStream.next('') | ||
55 | } | 82 | } |
56 | 83 | ||
57 | ngOnDestroy () { | 84 | ngOnDestroy () { |
@@ -61,7 +88,10 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD | |||
61 | getVideosObservable (page: number) { | 88 | getVideosObservable (page: number) { |
62 | const newPagination = immutableAssign(this.pagination, { currentPage: page }) | 89 | const newPagination = immutableAssign(this.pagination, { currentPage: page }) |
63 | 90 | ||
64 | return this.userHistoryService.getUserVideosHistory(newPagination) | 91 | return this.userHistoryService.getUserVideosHistory(newPagination, this.search) |
92 | .pipe( | ||
93 | tap(res => this.pagination.totalItems = res.total) | ||
94 | ) | ||
65 | } | 95 | } |
66 | 96 | ||
67 | generateSyndicationList () { | 97 | generateSyndicationList () { |