X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fuser-subscription%2Fsubscribe-button.component.ts;h=947f34c852236e215304c68c089ab35315a0a536;hb=f8b65c22a9cbf60a1d359c6aa2744baede1ee05f;hp=f0bee9d4779f605ba19d3d1e7538a95c87e325cb;hpb=b061c8edb053d4a7a02f09d93d406f6a8c58006e;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/shared/user-subscription/subscribe-button.component.ts b/client/src/app/shared/user-subscription/subscribe-button.component.ts index f0bee9d47..947f34c85 100644 --- a/client/src/app/shared/user-subscription/subscribe-button.component.ts +++ b/client/src/app/shared/user-subscription/subscribe-button.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit } from '@angular/core' +import { Component, Input, OnInit, OnChanges } from '@angular/core' import { Router } from '@angular/router' import { AuthService, Notifier } from '@app/core' import { UserSubscriptionService } from '@app/shared/user-subscription/user-subscription.service' @@ -7,14 +7,14 @@ import { I18n } from '@ngx-translate/i18n-polyfill' import { VideoService } from '@app/shared/video/video.service' import { FeedFormat } from '../../../../../shared/models/feeds' import { Account } from '@app/shared/account/account.model' -import { forkJoin } from 'rxjs' +import { concat, forkJoin, merge } from 'rxjs' @Component({ selector: 'my-subscribe-button', templateUrl: './subscribe-button.component.html', styleUrls: [ './subscribe-button.component.scss' ] }) -export class SubscribeButtonComponent implements OnInit { +export class SubscribeButtonComponent implements OnInit, OnChanges { /** * SubscribeButtonComponent can be used with a single VideoChannel passed as [VideoChannel], * or with an account and a full list of that account's videoChannels. The latter is intended @@ -26,7 +26,7 @@ export class SubscribeButtonComponent implements OnInit { @Input() displayFollowers = false @Input() size: 'small' | 'normal' = 'normal' - subscribed: Map + subscribed = new Map() constructor ( private authService: AuthService, @@ -35,18 +35,16 @@ export class SubscribeButtonComponent implements OnInit { private userSubscriptionService: UserSubscriptionService, private i18n: I18n, private videoService: VideoService - ) { - this.subscribed = new Map() - } + ) { } get handle () { return this.account ? this.account.nameWithHost - : this.videoChannels[0].name + '@' + this.videoChannels[0].host + : this.videoChannel.name + '@' + this.videoChannel.host } get channelHandle () { - return this.getChannelHandler(this.videoChannels[0]) + return this.getChannelHandler(this.videoChannel) } get uri () { @@ -67,20 +65,28 @@ export class SubscribeButtonComponent implements OnInit { return rssFeed.url } - ngOnInit () { - if (this.isUserLoggedIn()) { + get videoChannel () { + return this.videoChannels[0] + } - forkJoin(this.videoChannels.map(videoChannel => { - const handle = this.getChannelHandler(videoChannel) - this.subscribed.set(handle, false) - this.userSubscriptionService.doesSubscriptionExist(handle) - .subscribe( - res => this.subscribed.set(handle, res[handle]), + get isAllChannelsSubscribed () { + return this.subscribeStatus(true).length === this.videoChannels.length + } - err => this.notifier.error(err.message) - ) - })) - } + get isAtLeastOneChannelSubscribed () { + return this.subscribeStatus(true).length > 0 + } + + get isBigButton () { + return this.isUserLoggedIn() && this.videoChannels.length > 1 && this.isAtLeastOneChannelSubscribed + } + + ngOnInit () { + this.loadSubscribedStatus() + } + + ngOnChanges () { + this.ngOnInit() } subscribe () { @@ -92,31 +98,24 @@ export class SubscribeButtonComponent implements OnInit { } localSubscribe () { - const observableBatch: any = [] + const subscribedStatus = this.subscribeStatus(false) - this.videoChannels - .filter(videoChannel => this.subscribeStatus(false).includes(this.getChannelHandler(videoChannel))) - .forEach(videoChannel => observableBatch.push( - this.userSubscriptionService.addSubscription(this.getChannelHandler(videoChannel)) - )) + const observableBatch = this.videoChannels + .map(videoChannel => this.getChannelHandler(videoChannel)) + .filter(handle => subscribedStatus.includes(handle)) + .map(handle => this.userSubscriptionService.addSubscription(handle)) forkJoin(observableBatch) .subscribe( () => { - [...this.subscribed.keys()].forEach((key) => { - this.subscribed.set(key, true) - }) - this.notifier.success( this.account ? this.i18n( - 'Subscribed to all current channels of {{nameWithHost}}. ' + - 'You will be notified of all their new videos.', + 'Subscribed to all current channels of {{nameWithHost}}. You will be notified of all their new videos.', { nameWithHost: this.account.displayName } ) : this.i18n( - 'Subscribed to {{nameWithHost}}. ' + - 'You will be notified of all their new videos.', + 'Subscribed to {{nameWithHost}}. You will be notified of all their new videos.', { nameWithHost: this.videoChannels[0].displayName } ) , @@ -135,55 +134,65 @@ export class SubscribeButtonComponent implements OnInit { } localUnsubscribe () { - const observableBatch: any = [] + const subscribeStatus = this.subscribeStatus(true) - this.videoChannels - .filter(videoChannel => this.subscribeStatus(true).includes(this.getChannelHandler(videoChannel))) - .forEach(videoChannel => observableBatch.push( - this.userSubscriptionService.deleteSubscription(this.getChannelHandler(videoChannel)) - )) + const observableBatch = this.videoChannels + .map(videoChannel => this.getChannelHandler(videoChannel)) + .filter(handle => subscribeStatus.includes(handle)) + .map(handle => this.userSubscriptionService.deleteSubscription(handle)) - forkJoin(observableBatch) - .subscribe( - () => { - [...this.subscribed.keys()].forEach((key) => { - this.subscribed.set(key, false) - }) - - this.notifier.success( - this.account - ? this.i18n('Unsubscribed from all channels of {{nameWithHost}}', { nameWithHost: this.account.nameWithHost }) - : this.i18n('Unsubscribed from {{nameWithHost}}', { nameWithHost: this.videoChannels[0].nameWithHost }) - , - this.i18n('Unsubscribed') - ) - }, + concat(...observableBatch) + .subscribe({ + complete: () => { + this.notifier.success( + this.account + ? this.i18n('Unsubscribed from all channels of {{nameWithHost}}', { nameWithHost: this.account.nameWithHost }) + : this.i18n('Unsubscribed from {{nameWithHost}}', { nameWithHost: this.videoChannels[ 0 ].nameWithHost }) + , + this.i18n('Unsubscribed') + ) + }, - err => this.notifier.error(err.message) - ) + error: err => this.notifier.error(err.message) + }) } isUserLoggedIn () { return this.authService.isLoggedIn() } - isAllChannelsSubscribed () { - return !Array.from(this.subscribed.values()).includes(false) - } - gotoLogin () { this.router.navigate([ '/login' ]) } + subscribeStatus (subscribed: boolean) { + const accumulator: string[] = [] + for (const [key, value] of this.subscribed.entries()) { + if (value === subscribed) accumulator.push(key) + } + + return accumulator + } + private getChannelHandler (videoChannel: VideoChannel) { return videoChannel.name + '@' + videoChannel.host } - private subscribeStatus (subscribed: boolean) { - const accumulator = [] - for (const [key, value] of this.subscribed.entries()) { - if (value === subscribed) accumulator.push(key) + private loadSubscribedStatus () { + if (!this.isUserLoggedIn()) return + + for (const videoChannel of this.videoChannels) { + const handle = this.getChannelHandler(videoChannel) + this.subscribed.set(handle, false) + + merge( + this.userSubscriptionService.listenToSubscriptionCacheChange(handle), + this.userSubscriptionService.doesSubscriptionExist(handle) + ).subscribe( + res => this.subscribed.set(handle, res), + + err => this.notifier.error(err.message) + ) } - return accumulator } }