Add/update/delete/list my playlists
[oweals/peertube.git] / client / src / app / +my-account / my-account-video-playlists / my-account-video-playlists.component.ts
1 import { Component, OnInit } from '@angular/core'
2 import { Notifier } from '@app/core'
3 import { AuthService } from '../../core/auth'
4 import { ConfirmService } from '../../core/confirm'
5 import { User } from '@app/shared'
6 import { flatMap } from 'rxjs/operators'
7 import { I18n } from '@ngx-translate/i18n-polyfill'
8 import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
9 import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
10 import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
11 import { VideoPlaylistType } from '@shared/models'
12
13 @Component({
14   selector: 'my-account-video-playlists',
15   templateUrl: './my-account-video-playlists.component.html',
16   styleUrls: [ './my-account-video-playlists.component.scss' ]
17 })
18 export class MyAccountVideoPlaylistsComponent implements OnInit {
19   videoPlaylists: VideoPlaylist[] = []
20
21   pagination: ComponentPagination = {
22     currentPage: 1,
23     itemsPerPage: 10,
24     totalItems: null
25   }
26
27   private user: User
28
29   constructor (
30     private authService: AuthService,
31     private notifier: Notifier,
32     private confirmService: ConfirmService,
33     private videoPlaylistService: VideoPlaylistService,
34     private i18n: I18n
35   ) {}
36
37   ngOnInit () {
38     this.user = this.authService.getUser()
39
40     this.loadVideoPlaylists()
41   }
42
43   async deleteVideoPlaylist (videoPlaylist: VideoPlaylist) {
44     const res = await this.confirmService.confirm(
45       this.i18n(
46         'Do you really want to delete {{playlistDisplayName}}?',
47         { playlistDisplayName: videoPlaylist.displayName }
48       ),
49       this.i18n('Delete')
50     )
51     if (res === false) return
52
53     this.videoPlaylistService.removeVideoPlaylist(videoPlaylist)
54       .subscribe(
55         () => {
56           this.videoPlaylists = this.videoPlaylists
57                                     .filter(p => p.id !== videoPlaylist.id)
58
59           this.notifier.success(
60             this.i18n('Playlist {{playlistDisplayName}} deleted.', { playlistDisplayName: videoPlaylist.displayName })
61           )
62         },
63
64         error => this.notifier.error(error.message)
65       )
66   }
67
68   isRegularPlaylist (playlist: VideoPlaylist) {
69     return playlist.type.id === VideoPlaylistType.REGULAR
70   }
71
72   private loadVideoPlaylists () {
73     this.authService.userInformationLoaded
74         .pipe(flatMap(() => this.videoPlaylistService.listAccountPlaylists(this.user.account)))
75         .subscribe(res => this.videoPlaylists = res.data)
76   }
77
78   private ofNearOfBottom () {
79     // Last page
80     if (this.pagination.totalItems <= (this.pagination.currentPage * this.pagination.itemsPerPage)) return
81
82     this.pagination.currentPage += 1
83     this.loadVideoPlaylists()
84   }
85 }