Migrate client to eslint

[github/Chocobozzz/PeerTube.git] / client / src / app / +my-library / my-history / my-history.component.ts

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 1695bd7ad8aaf7a145ea05f6f538f8e76ecda86b..a72d22e1c4b1a44f4a5db1150f27be4ebecc8c64 100644 (file)
--- a/client/src/app/+my-library/my-history/my-history.component.ts
+++ b/client/src/app/+my-library/my-history/my-history.component.ts
@@ -1,36 +1,54 @@
-import { Component, ComponentFactoryResolver, OnDestroy, OnInit } from '@angular/core'
+import { tap } from 'rxjs/operators'
+import { Component, ComponentFactoryResolver, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import {
   AuthService,
   ComponentPagination,
   ConfirmService,
+  DisableForReuseHook,
   LocalStorageService,
   Notifier,
   ScreenService,
   ServerService,
+  User,
   UserService
 } from '@app/core'
 import { immutableAssign } from '@app/helpers'
-import { UserHistoryService } from '@app/shared/shared-main'
-import { AbstractVideoList } from '@app/shared/shared-video-miniature'
-import { Subject } from 'rxjs'
-import { debounceTime, tap, distinctUntilChanged } from 'rxjs/operators'
+import { UserHistoryService, Video } from '@app/shared/shared-main'
+import { MiniatureDisplayOptions, VideosSelectionComponent } from '@app/shared/shared-video-miniature'
 
 @Component({
   templateUrl: './my-history.component.html',
   styleUrls: [ './my-history.component.scss' ]
 })
-export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnDestroy {
+export class MyHistoryComponent implements OnInit, DisableForReuseHook {
+  @ViewChild('videosSelection', { static: true }) videosSelection: VideosSelectionComponent
+
   titlePage: string
   pagination: ComponentPagination = {
     currentPage: 1,
     itemsPerPage: 5,
     totalItems: null
   }
+
   videosHistoryEnabled: boolean
-  search: string
 
-  protected searchStream: Subject<string>
+  miniatureDisplayOptions: MiniatureDisplayOptions = {
+    date: true,
+    views: true,
+    by: true,
+    privacyLabel: false,
+    privacyText: true,
+    state: true,
+    blacklistInfo: true
+  }
+
+  getVideosObservableFunction = this.getVideosObservable.bind(this)
+
+  user: User
+
+  videos: Video[] = []
+  search: string
 
   constructor (
     protected router: Router,
@@ -45,45 +63,31 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD
     private userHistoryService: UserHistoryService,
     protected cfr: ComponentFactoryResolver
   ) {
-    super()
-
     this.titlePage = $localize`My watch history`
   }
 
   ngOnInit () {
-    super.ngOnInit()
+    this.user = this.authService.getUser()
 
     this.authService.userInformationLoaded
-      .subscribe(() => {
-        this.videosHistoryEnabled = this.authService.getUser().videosHistoryEnabled
-      })
-
-    this.searchStream = new Subject()
+      .subscribe(() => this.videosHistoryEnabled = this.user.videosHistoryEnabled)
+  }
 
-    this.searchStream
-      .pipe(
-        debounceTime(400),
-        distinctUntilChanged()
-      )
-      .subscribe(search => {
-        this.search = search
-        this.reloadVideos()
-      })
+  disableForReuse () {
+    this.videosSelection.disableForReuse()
   }
 
-  onSearch (event: Event) {
-    const target = event.target as HTMLInputElement
-    this.searchStream.next(target.value)
+  enabledForReuse () {
+    this.videosSelection.enabledForReuse()
   }
 
-  resetSearch () {
-    const searchInput = document.getElementById('history-search') as HTMLInputElement
-    searchInput.value = ''
-    this.searchStream.next('')
+  reloadData () {
+    this.videosSelection.reloadVideos()
   }
 
-  ngOnDestroy () {
-    super.ngOnDestroy()
+  onSearch (search: string) {
+    this.search = search
+    this.reloadData()
   }
 
   getVideosObservable (page: number) {
@@ -102,19 +106,19 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD
 
   onVideosHistoryChange () {
     this.userService.updateMyProfile({ videosHistoryEnabled: this.videosHistoryEnabled })
-      .subscribe(
-        () => {
-          const message = this.videosHistoryEnabled === true ?
-            $localize`Videos history is enabled` :
-            $localize`Videos history is disabled`
+      .subscribe({
+        next: () => {
+          const message = this.videosHistoryEnabled === true
+            ? $localize`Videos history is enabled`
+            : $localize`Videos history is disabled`
 
           this.notifier.success(message)
 
           this.authService.refreshUserInformation()
         },
 
-        err => this.notifier.error(err.message)
-      )
+        error: err => this.notifier.error(err.message)
+      })
   }
 
   async deleteHistory () {
@@ -125,14 +129,14 @@ export class MyHistoryComponent extends AbstractVideoList implements OnInit, OnD
     if (res !== true) return
 
     this.userHistoryService.deleteUserVideosHistory()
-        .subscribe(
-          () => {
+        .subscribe({
+          next: () => {
             this.notifier.success($localize`Videos history deleted`)
 
-            this.reloadVideos()
+            this.reloadData()
           },
 
-          err => this.notifier.error(err.message)
-        )
+          error: err => this.notifier.error(err.message)
+        })
   }
 }