aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorMs Kimsible <1877318+kimsible@users.noreply.github.com>2021-08-26 08:40:18 +0200
committerGitHub <noreply@github.com>2021-08-26 08:40:18 +0200
commit52a354ab7af7bd29ca0128fa7c501ea08aa5a343 (patch)
treed0bdd4e4e113d0b82774d6efd236a127b5f9db35 /client/src/app
parent7dca45f99db58d9bb3423a3765aaee68c69bc9f2 (diff)
downloadPeerTube-52a354ab7af7bd29ca0128fa7c501ea08aa5a343.tar.gz
PeerTube-52a354ab7af7bd29ca0128fa7c501ea08aa5a343.tar.zst
PeerTube-52a354ab7af7bd29ca0128fa7c501ea08aa5a343.zip
Fix user quota alerts always displayed (#4354)
* Fix user quota alerts display on upload page * Fix border-radius upload messages alerts Co-authored-by: Ms Kimsible <kimsible@users.noreply.github.com>
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/+videos/+video-edit/video-add.component.html8
-rw-r--r--client/src/app/+videos/+video-edit/video-add.component.scss1
-rw-r--r--client/src/app/+videos/+video-edit/video-add.component.ts38
-rw-r--r--client/src/app/core/users/user.model.ts22
4 files changed, 40 insertions, 29 deletions
diff --git a/client/src/app/+videos/+video-edit/video-add.component.html b/client/src/app/+videos/+video-edit/video-add.component.html
index 62b42ae10..7dd9ba357 100644
--- a/client/src/app/+videos/+video-edit/video-add.component.html
+++ b/client/src/app/+videos/+video-edit/video-add.component.html
@@ -17,15 +17,15 @@
17<ng-container *ngIf="!user.isUploadDisabled()"> 17<ng-container *ngIf="!user.isUploadDisabled()">
18 <div *ngIf="user.isAutoBlocked()" class="upload-message auto-blocked alert alert-warning"> 18 <div *ngIf="user.isAutoBlocked()" class="upload-message auto-blocked alert alert-warning">
19 <div>{{ uploadMessages.autoBlock }}</div> 19 <div>{{ uploadMessages.autoBlock }}</div>
20 <ng-template [ngTemplateOutlet]="AlertButtons" *ngIf="!user.hasNoQuotaLeft() && !user.hasNoQuotaLeftDaily()"></ng-template> 20 <ng-template [ngTemplateOutlet]="AlertButtons" *ngIf="!hasNoQuotaLeft && !hasNoQuotaLeftDaily"></ng-template>
21 </div> 21 </div>
22 22
23 <div *ngIf="user.hasNoQuotaLeft()" class="upload-message quota-daily-left alert alert-warning"> 23 <div *ngIf="hasNoQuotaLeftDaily" class="upload-message quota-daily-left alert alert-warning">
24 <div>{{ uploadMessages.quotaLeftDaily }}</div> 24 <div>{{ uploadMessages.quotaLeftDaily }}</div>
25 <ng-template [ngTemplateOutlet]="AlertButtons" *ngIf="!user.hasNoQuotaLeft()"></ng-template> 25 <ng-template [ngTemplateOutlet]="AlertButtons" *ngIf="!hasNoQuotaLeft"></ng-template>
26 </div> 26 </div>
27 27
28 <div *ngIf="user.hasNoQuotaLeft()" class="upload-message quota-left alert alert-warning"> 28 <div *ngIf="hasNoQuotaLeft" class="upload-message quota-left alert alert-warning">
29 <div>{{ uploadMessages.quotaLeft }}</div> 29 <div>{{ uploadMessages.quotaLeft }}</div>
30 <ng-template [ngTemplateOutlet]="AlertButtons"></ng-template> 30 <ng-template [ngTemplateOutlet]="AlertButtons"></ng-template>
31 </div> 31 </div>
diff --git a/client/src/app/+videos/+video-edit/video-add.component.scss b/client/src/app/+videos/+video-edit/video-add.component.scss
index 26be86d29..0f0cc406c 100644
--- a/client/src/app/+videos/+video-edit/video-add.component.scss
+++ b/client/src/app/+videos/+video-edit/video-add.component.scss
@@ -11,6 +11,7 @@ $nav-link-height: 40px;
11 text-align: center; 11 text-align: center;
12 font-size: 15px; 12 font-size: 15px;
13 margin-bottom: 0; 13 margin-bottom: 0;
14 border-radius: 0;
14 15
15 &:last-child { 16 &:last-child {
16 margin-bottom: 1rem; 17 margin-bottom: 1rem;
diff --git a/client/src/app/+videos/+video-edit/video-add.component.ts b/client/src/app/+videos/+video-edit/video-add.component.ts
index a107ad123..46881be4e 100644
--- a/client/src/app/+videos/+video-edit/video-add.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add.component.ts
@@ -1,6 +1,13 @@
1import { Component, HostListener, OnInit, ViewChild } from '@angular/core' 1import { Component, HostListener, OnInit, ViewChild } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router' 2import { ActivatedRoute, Router } from '@angular/router'
3import { AuthService, AuthUser, CanComponentDeactivate, HooksService, ServerService } from '@app/core' 3import {
4 AuthService,
5 AuthUser,
6 CanComponentDeactivate,
7 HooksService,
8 ServerService,
9 UserService
10} from '@app/core'
4import { HTMLServerConfig } from '@shared/models' 11import { HTMLServerConfig } from '@shared/models'
5import { VideoEditType } from './shared/video-edit.type' 12import { VideoEditType } from './shared/video-edit.type'
6import { VideoGoLiveComponent } from './video-add-components/video-go-live.component' 13import { VideoGoLiveComponent } from './video-add-components/video-go-live.component'
@@ -33,10 +40,14 @@ export class VideoAddComponent implements OnInit, CanComponentDeactivate {
33 quotaLeft: string 40 quotaLeft: string
34 } 41 }
35 42
43 hasNoQuotaLeft = false
44 hasNoQuotaLeftDaily = false
45
36 private serverConfig: HTMLServerConfig 46 private serverConfig: HTMLServerConfig
37 47
38 constructor ( 48 constructor (
39 private auth: AuthService, 49 private auth: AuthService,
50 private userService: UserService,
40 private hooks: HooksService, 51 private hooks: HooksService,
41 private serverService: ServerService, 52 private serverService: ServerService,
42 private route: ActivatedRoute, 53 private route: ActivatedRoute,
@@ -56,13 +67,34 @@ export class VideoAddComponent implements OnInit, CanComponentDeactivate {
56 67
57 this.serverConfig = this.serverService.getHTMLConfig() 68 this.serverConfig = this.serverService.getHTMLConfig()
58 69
59 this.user = this.auth.getUser()
60
61 if (this.route.snapshot.fragment) { 70 if (this.route.snapshot.fragment) {
62 this.onNavChange(this.route.snapshot.fragment) 71 this.onNavChange(this.route.snapshot.fragment)
63 } 72 }
64 73
65 this.buildUploadMessages() 74 this.buildUploadMessages()
75
76 this.userService.getMyVideoQuotaUsed()
77 .subscribe(data => {
78 // videoQuota left lower than 10%
79 if (data.videoQuotaUsed > this.user.videoQuota * 0.9) {
80 this.hasNoQuotaLeft = true
81 }
82
83 // unlimited videoQuota
84 if (this.user.videoQuota === -1) {
85 this.hasNoQuotaLeft = false
86 }
87
88 // videoQuotaDaily left lower than 10%
89 if (data.videoQuotaUsedDaily > this.user.videoQuotaDaily * 0.9) {
90 this.hasNoQuotaLeftDaily = true
91 }
92
93 // unlimited videoQuotaDaily
94 if (this.user.videoQuotaDaily === -1) {
95 this.hasNoQuotaLeftDaily = false
96 }
97 })
66 } 98 }
67 99
68 private async buildUploadMessages () { 100 private async buildUploadMessages () {
diff --git a/client/src/app/core/users/user.model.ts b/client/src/app/core/users/user.model.ts
index 5e1fb1c8d..7467519c4 100644
--- a/client/src/app/core/users/user.model.ts
+++ b/client/src/app/core/users/user.model.ts
@@ -137,26 +137,4 @@ export class User implements UserServerModel {
137 isAutoBlocked () { 137 isAutoBlocked () {
138 return this.role === UserRole.USER && this.adminFlags !== UserAdminFlag.BYPASS_VIDEO_AUTO_BLACKLIST 138 return this.role === UserRole.USER && this.adminFlags !== UserAdminFlag.BYPASS_VIDEO_AUTO_BLACKLIST
139 } 139 }
140
141 hasNoQuotaLeft () {
142 // unlimited videoQuota
143 if (this.videoQuota === -1) return false
144
145 // no more videoQuota
146 if (!this.videoQuotaUsed) return true
147
148 // videoQuota left lower than 10%
149 return this.videoQuotaUsed > this.videoQuota * 0.9
150 }
151
152 hasNoQuotaLeftDaily () {
153 // unlimited videoQuotaDaily
154 if (this.videoQuotaDaily === -1) return false
155
156 // no more videoQuotaDaily
157 if (!this.videoQuotaUsedDaily) return true
158
159 // videoQuotaDaily left lower than 10%
160 return this.videoQuotaUsedDaily > this.videoQuotaDaily * 0.9
161 }
162} 140}