Feature/password protected videos (#5836)

* Add server endpoints

* Refactoring test suites

* Update server and add openapi documentation

* fix compliation and tests

* upload/import password protected video on client

* add server error code

* Add video password to update resolver

* add custom message when sharing pw protected video

* improve confirm component

* Add new alert in component

* Add ability to watch protected video on client

* Cannot have password protected replay privacy

* Add migration

* Add tests

* update after review

* Update check params tests

* Add live videos test

* Add more filter test

* Update static file privacy test

* Update object storage tests

* Add test on feeds

* Add missing word

* Fix tests

* Fix tests on live videos

* add embed support on password protected videos

* fix style

* Correcting data leaks

* Unable to add password protected privacy on replay

* Updated code based on review comments

* fix validator and command

* Updated code based on review comments

19 files changed, 148 insertions, 46 deletions

diff --git a/client/src/app/shared/form-validators/video-validators.ts b/client/src/app/shared/form-validators/video-validators.ts
index a4bda8f16..090a76e43 100644
--- a/client/src/app/shared/form-validators/video-validators.ts
+++ b/client/src/app/shared/form-validators/video-validators.ts
@@ -26,6 +26,15 @@ export const VIDEO_PRIVACY_VALIDATOR: BuildFormValidator = {
   }
 }
 
+export const VIDEO_PASSWORD_VALIDATOR: BuildFormValidator = {
+  VALIDATORS: [ Validators.minLength(2), Validators.maxLength(100) ], // Required is set dynamically
+  MESSAGES: {
+    minLength: $localize`A password should be at least 2 characters long.`,
+    maxLength: $localize`A password should be shorter than 100 characters long.`,
+    required: $localize`A password is required for password protected video.`
+  }
+}
+
 export const VIDEO_CATEGORY_VALIDATOR: BuildFormValidator = {
   VALIDATORS: [ ],
   MESSAGES: {}
diff --git a/client/src/app/shared/shared-main/shared-main.module.ts b/client/src/app/shared/shared-main/shared-main.module.ts
index d3ec31d6e..480277450 100644
--- a/client/src/app/shared/shared-main/shared-main.module.ts
+++ b/client/src/app/shared/shared-main/shared-main.module.ts
@@ -52,6 +52,7 @@ import {
   VideoFileTokenService,
   VideoImportService,
   VideoOwnershipService,
+  VideoPasswordService,
   VideoResolver,
   VideoService
 } from './video'
@@ -210,6 +211,8 @@ import { VideoChannelService } from './video-channel'
 
     VideoChannelService,
 
+    VideoPasswordService,
+
     CustomPageService,
 
     ActorRedirectGuard
diff --git a/client/src/app/shared/shared-main/video-caption/video-caption.service.ts b/client/src/app/shared/shared-main/video-caption/video-caption.service.ts
index 0f3afd116..21f31a717 100644
--- a/client/src/app/shared/shared-main/video-caption/video-caption.service.ts
+++ b/client/src/app/shared/shared-main/video-caption/video-caption.service.ts
@@ -4,7 +4,7 @@ import { HttpClient } from '@angular/common/http'
 import { Injectable } from '@angular/core'
 import { RestExtractor, ServerService } from '@app/core'
 import { objectToFormData, sortBy } from '@app/helpers'
-import { VideoService } from '@app/shared/shared-main/video'
+import { VideoPasswordService, VideoService } from '@app/shared/shared-main/video'
 import { peertubeTranslate } from '@shared/core-utils/i18n'
 import { ResultList, VideoCaption } from '@shared/models'
 import { environment } from '../../../../environments/environment'
@@ -18,8 +18,10 @@ export class VideoCaptionService {
     private restExtractor: RestExtractor
   ) {}
 
-  listCaptions (videoId: string): Observable<ResultList<VideoCaption>> {
-    return this.authHttp.get<ResultList<VideoCaption>>(`${VideoService.BASE_VIDEO_URL}/${videoId}/captions`)
+  listCaptions (videoId: string, videoPassword?: string): Observable<ResultList<VideoCaption>> {
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
+
+    return this.authHttp.get<ResultList<VideoCaption>>(`${VideoService.BASE_VIDEO_URL}/${videoId}/captions`, { headers })
                .pipe(
                  switchMap(captionsResult => {
                    return this.serverService.getServerLocale()
diff --git a/client/src/app/shared/shared-main/video/index.ts b/client/src/app/shared/shared-main/video/index.ts
index a2e47883e..07d40b117 100644
--- a/client/src/app/shared/shared-main/video/index.ts
+++ b/client/src/app/shared/shared-main/video/index.ts
@@ -5,6 +5,7 @@ export * from './video-edit.model'
 export * from './video-file-token.service'
 export * from './video-import.service'
 export * from './video-ownership.service'
+export * from './video-password.service'
 export * from './video.model'
 export * from './video.resolver'
 export * from './video.service'
diff --git a/client/src/app/shared/shared-main/video/video-edit.model.ts b/client/src/app/shared/shared-main/video/video-edit.model.ts
index 47eee80d8..1b8b67ee2 100644
--- a/client/src/app/shared/shared-main/video/video-edit.model.ts
+++ b/client/src/app/shared/shared-main/video/video-edit.model.ts
@@ -1,5 +1,5 @@
 import { getAbsoluteAPIUrl } from '@app/helpers'
-import { VideoPrivacy, VideoScheduleUpdate, VideoUpdate } from '@shared/models'
+import { VideoPassword, VideoPrivacy, VideoScheduleUpdate, VideoUpdate } from '@shared/models'
 import { VideoDetails } from './video-details.model'
 import { objectKeysTyped } from '@shared/core-utils'
 
@@ -18,6 +18,7 @@ export class VideoEdit implements VideoUpdate {
   waitTranscoding: boolean
   channelId: number
   privacy: VideoPrivacy
+  videoPassword?: string
   support: string
   thumbnailfile?: any
   previewfile?: any
@@ -32,7 +33,7 @@ export class VideoEdit implements VideoUpdate {
 
   pluginData?: any
 
-  constructor (video?: VideoDetails) {
+  constructor (video?: VideoDetails, videoPassword?: VideoPassword) {
     if (!video) return
 
     this.id = video.id
@@ -63,6 +64,8 @@ export class VideoEdit implements VideoUpdate {
       : null
 
     this.pluginData = video.pluginData
+
+    if (videoPassword) this.videoPassword = videoPassword.password
   }
 
   patch (values: { [ id: string ]: any }) {
@@ -112,6 +115,7 @@ export class VideoEdit implements VideoUpdate {
       waitTranscoding: this.waitTranscoding,
       channelId: this.channelId,
       privacy: this.privacy,
+      videoPassword: this.videoPassword,
       originallyPublishedAt: this.originallyPublishedAt
     }
 
diff --git a/client/src/app/shared/shared-main/video/video-file-token.service.ts b/client/src/app/shared/shared-main/video/video-file-token.service.ts
index 791607249..9bca5b9ec 100644
--- a/client/src/app/shared/shared-main/video/video-file-token.service.ts
+++ b/client/src/app/shared/shared-main/video/video-file-token.service.ts
@@ -4,6 +4,7 @@ import { Injectable } from '@angular/core'
 import { RestExtractor } from '@app/core'
 import { VideoToken } from '@shared/models'
 import { VideoService } from './video.service'
+import { VideoPasswordService } from './video-password.service'
 
 @Injectable()
 export class VideoFileTokenService {
@@ -15,16 +16,18 @@ export class VideoFileTokenService {
     private restExtractor: RestExtractor
   ) {}
 
-  getVideoFileToken (videoUUID: string) {
+  getVideoFileToken ({ videoUUID, videoPassword }: { videoUUID: string, videoPassword?: string }) {
     const existing = this.store.get(videoUUID)
     if (existing) return of(existing)
 
-    return this.createVideoFileToken(videoUUID)
+    return this.createVideoFileToken(videoUUID, videoPassword)
       .pipe(tap(result => this.store.set(videoUUID, { token: result.token, expires: new Date(result.expires) })))
   }
 
-  private createVideoFileToken (videoUUID: string) {
-    return this.authHttp.post<VideoToken>(`${VideoService.BASE_VIDEO_URL}/${videoUUID}/token`, {})
+  private createVideoFileToken (videoUUID: string, videoPassword?: string) {
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
+
+    return this.authHttp.post<VideoToken>(`${VideoService.BASE_VIDEO_URL}/${videoUUID}/token`, {}, { headers })
       .pipe(
         map(({ files }) => files),
         catchError(err => this.restExtractor.handleError(err))
diff --git a/client/src/app/shared/shared-main/video/video-password.service.ts b/client/src/app/shared/shared-main/video/video-password.service.ts
new file mode 100644
index 000000000..d5b0406f8
--- /dev/null
+++ b/client/src/app/shared/shared-main/video/video-password.service.ts
@@ -0,0 +1,29 @@
+import { ResultList, VideoPassword } from '@shared/models'
+import { Injectable } from '@angular/core'
+import { catchError, switchMap } from 'rxjs'
+import { HttpClient, HttpHeaders } from '@angular/common/http'
+import { RestExtractor } from '@app/core'
+import { VideoService } from './video.service'
+
+@Injectable()
+export class VideoPasswordService {
+
+  constructor (
+    private authHttp: HttpClient,
+    private restExtractor: RestExtractor
+  ) {}
+
+  static buildVideoPasswordHeader (videoPassword: string) {
+    return videoPassword
+      ? new HttpHeaders().set('x-peertube-video-password', videoPassword)
+      : undefined
+  }
+
+  getVideoPasswords (options: { videoUUID: string }) {
+    return this.authHttp.get<ResultList<VideoPassword>>(`${VideoService.BASE_VIDEO_URL}/${options.videoUUID}/passwords`)
+      .pipe(
+        switchMap(res => res.data),
+        catchError(err => this.restExtractor.handleError(err))
+      )
+  }
+}
diff --git a/client/src/app/shared/shared-main/video/video.model.ts b/client/src/app/shared/shared-main/video/video.model.ts
index 6fdffb394..24c00c3d5 100644
--- a/client/src/app/shared/shared-main/video/video.model.ts
+++ b/client/src/app/shared/shared-main/video/video.model.ts
@@ -281,6 +281,13 @@ export class Video implements VideoServerModel {
     return user && this.isLocal === false && user.hasRight(UserRight.MANAGE_VIDEOS_REDUNDANCIES)
   }
 
+  canAccessPasswordProtectedVideoWithoutPassword (user: AuthUser) {
+    return this.privacy.id === VideoPrivacy.PASSWORD_PROTECTED &&
+      user &&
+      this.isLocal === true &&
+      (this.account.name === user.username || user.hasRight(UserRight.SEE_ALL_VIDEOS))
+  }
+
   getExactNumberOfViews () {
     if (this.isLive) {
       return Video.viewersICU({ viewers: this.viewers }, $localize`${this.viewers} viewer(s)`)
diff --git a/client/src/app/shared/shared-main/video/video.service.ts b/client/src/app/shared/shared-main/video/video.service.ts
index 78a49567f..d67a2e192 100644
--- a/client/src/app/shared/shared-main/video/video.service.ts
+++ b/client/src/app/shared/shared-main/video/video.service.ts
@@ -33,6 +33,7 @@ import { VideoChannel, VideoChannelService } from '../video-channel'
 import { VideoDetails } from './video-details.model'
 import { VideoEdit } from './video-edit.model'
 import { Video } from './video.model'
+import { VideoPasswordService } from './video-password.service'
 
 export type CommonVideoParams = {
   videoPagination?: ComponentPaginationLight
@@ -69,16 +70,17 @@ export class VideoService {
     return `${VideoService.BASE_VIDEO_URL}/${uuid}/views`
   }
 
-  getVideo (options: { videoId: string }): Observable<VideoDetails> {
-    return this.serverService.getServerLocale()
-               .pipe(
-                 switchMap(translations => {
-                   return this.authHttp.get<VideoDetailsServerModel>(`${VideoService.BASE_VIDEO_URL}/${options.videoId}`)
-                              .pipe(map(videoHash => ({ videoHash, translations })))
-                 }),
-                 map(({ videoHash, translations }) => new VideoDetails(videoHash, translations)),
-                 catchError(err => this.restExtractor.handleError(err))
-               )
+  getVideo (options: { videoId: string, videoPassword?: string }): Observable<VideoDetails> {
+    const headers = VideoPasswordService.buildVideoPasswordHeader(options.videoPassword)
+
+    return this.serverService.getServerLocale().pipe(
+      switchMap(translations => {
+        return this.authHttp.get<VideoDetailsServerModel>(`${VideoService.BASE_VIDEO_URL}/${options.videoId}`, { headers })
+          .pipe(map(videoHash => ({ videoHash, translations })))
+      }),
+      map(({ videoHash, translations }) => new VideoDetails(videoHash, translations)),
+      catchError(err => this.restExtractor.handleError(err))
+    )
   }
 
   updateVideo (video: VideoEdit) {
@@ -99,6 +101,9 @@ export class VideoService {
       description,
       channelId: video.channelId,
       privacy: video.privacy,
+      videoPasswords: video.privacy === VideoPrivacy.PASSWORD_PROTECTED
+        ? [ video.videoPassword ]
+        : undefined,
       tags: video.tags,
       nsfw: video.nsfw,
       waitTranscoding: video.waitTranscoding,
@@ -353,16 +358,16 @@ export class VideoService {
                )
   }
 
-  setVideoLike (id: string) {
-    return this.setVideoRate(id, 'like')
+  setVideoLike (id: string, videoPassword: string) {
+    return this.setVideoRate(id, 'like', videoPassword)
   }
 
-  setVideoDislike (id: string) {
-    return this.setVideoRate(id, 'dislike')
+  setVideoDislike (id: string, videoPassword: string) {
+    return this.setVideoRate(id, 'dislike', videoPassword)
   }
 
-  unsetVideoLike (id: string) {
-    return this.setVideoRate(id, 'none')
+  unsetVideoLike (id: string, videoPassword: string) {
+    return this.setVideoRate(id, 'none', videoPassword)
   }
 
   getUserVideoRating (id: string) {
@@ -394,7 +399,8 @@ export class VideoService {
       [VideoPrivacy.PRIVATE]: $localize`Only I can see this video`,
       [VideoPrivacy.UNLISTED]: $localize`Only shareable via a private link`,
       [VideoPrivacy.PUBLIC]: $localize`Anyone can see this video`,
-      [VideoPrivacy.INTERNAL]: $localize`Only users of this instance can see this video`
+      [VideoPrivacy.INTERNAL]: $localize`Only users of this instance can see this video`,
+      [VideoPrivacy.PASSWORD_PROTECTED]: $localize`Only users with the appropriate password can see this video`
     }
 
     const videoPrivacies = serverPrivacies.map(p => {
@@ -412,7 +418,13 @@ export class VideoService {
   }
 
   getHighestAvailablePrivacy (serverPrivacies: VideoConstant<VideoPrivacy>[]) {
-    const order = [ VideoPrivacy.PRIVATE, VideoPrivacy.INTERNAL, VideoPrivacy.UNLISTED, VideoPrivacy.PUBLIC ]
+    // We do not add a password as this requires additional configuration.
+    const order = [
+      VideoPrivacy.PRIVATE,
+      VideoPrivacy.INTERNAL,
+      VideoPrivacy.UNLISTED,
+      VideoPrivacy.PUBLIC
+    ]
 
     for (const privacy of order) {
       if (serverPrivacies.find(p => p.id === privacy)) {
@@ -499,14 +511,15 @@ export class VideoService {
     }
   }
 
-  private setVideoRate (id: string, rateType: UserVideoRateType) {
+  private setVideoRate (id: string, rateType: UserVideoRateType, videoPassword?: string) {
     const url = `${VideoService.BASE_VIDEO_URL}/${id}/rate`
     const body: UserVideoRateUpdate = {
       rating: rateType
     }
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
 
     return this.authHttp
-               .put(url, body)
+               .put(url, body, { headers })
                .pipe(catchError(err => this.restExtractor.handleError(err)))
   }
 }
diff --git a/client/src/app/shared/shared-share-modal/video-share.component.html b/client/src/app/shared/shared-share-modal/video-share.component.html
index 5650fa948..9f1455561 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.html
+++ b/client/src/app/shared/shared-share-modal/video-share.component.html
@@ -107,6 +107,10 @@
         </a>
       </div>
 
+      <div i18n *ngIf="isPasswordProtectedVideo()" class="alert-private alert alert-warning">
+        This video is password protected, please note that recipients will require the corresponding password to access the content.
+      </div>
+
       <div ngbNav #nav="ngbNav" class="nav-tabs" [(activeId)]="activeVideoId">
 
         <ng-container ngbNavItem="url">
diff --git a/client/src/app/shared/shared-share-modal/video-share.component.ts b/client/src/app/shared/shared-share-modal/video-share.component.ts
index 32f900f15..da4f2a4b4 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.ts
+++ b/client/src/app/shared/shared-share-modal/video-share.component.ts
@@ -243,6 +243,10 @@ export class VideoShareComponent {
     return this.playlist.privacy.id === VideoPlaylistPrivacy.PRIVATE
   }
 
+  isPasswordProtectedVideo () {
+    return this.video.privacy.id === VideoPrivacy.PASSWORD_PROTECTED
+  }
+
   private getPlaylistOptions (baseUrl?: string) {
     return {
       baseUrl,
diff --git a/client/src/app/shared/shared-video-comment/video-comment.service.ts b/client/src/app/shared/shared-video-comment/video-comment.service.ts
index 8d2deedf7..3906652be 100644
--- a/client/src/app/shared/shared-video-comment/video-comment.service.ts
+++ b/client/src/app/shared/shared-video-comment/video-comment.service.ts
@@ -18,6 +18,7 @@ import {
 import { environment } from '../../../environments/environment'
 import { VideoCommentThreadTree } from './video-comment-thread-tree.model'
 import { VideoComment } from './video-comment.model'
+import { VideoPasswordService } from '../shared-main'
 
 @Injectable()
 export class VideoCommentService {
@@ -31,22 +32,25 @@ export class VideoCommentService {
     private restService: RestService
   ) {}
 
-  addCommentThread (videoId: string, comment: VideoCommentCreate) {
+  addCommentThread (videoId: string, comment: VideoCommentCreate, videoPassword?: string) {
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
     const url = VideoCommentService.BASE_VIDEO_URL + videoId + '/comment-threads'
     const normalizedComment = objectLineFeedToHtml(comment, 'text')
 
-    return this.authHttp.post<{ comment: VideoCommentServerModel }>(url, normalizedComment)
+    return this.authHttp.post<{ comment: VideoCommentServerModel }>(url, normalizedComment, { headers })
                .pipe(
                  map(data => this.extractVideoComment(data.comment)),
                  catchError(err => this.restExtractor.handleError(err))
                )
   }
 
-  addCommentReply (videoId: string, inReplyToCommentId: number, comment: VideoCommentCreate) {
+  addCommentReply (options: { videoId: string, inReplyToCommentId: number, comment: VideoCommentCreate, videoPassword?: string }) {
+    const { videoId, inReplyToCommentId, comment, videoPassword } = options
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
     const url = VideoCommentService.BASE_VIDEO_URL + videoId + '/comments/' + inReplyToCommentId
     const normalizedComment = objectLineFeedToHtml(comment, 'text')
 
-    return this.authHttp.post<{ comment: VideoCommentServerModel }>(url, normalizedComment)
+    return this.authHttp.post<{ comment: VideoCommentServerModel }>(url, normalizedComment, { headers })
                .pipe(
                  map(data => this.extractVideoComment(data.comment)),
                  catchError(err => this.restExtractor.handleError(err))
@@ -76,10 +80,13 @@ export class VideoCommentService {
 
   getVideoCommentThreads (parameters: {
     videoId: string
+    videoPassword: string
     componentPagination: ComponentPaginationLight
     sort: string
   }): Observable<ThreadsResultList<VideoComment>> {
-    const { videoId, componentPagination, sort } = parameters
+    const { videoId, videoPassword, componentPagination, sort } = parameters
+
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
 
     const pagination = this.restService.componentToRestPagination(componentPagination)
 
@@ -87,7 +94,7 @@ export class VideoCommentService {
     params = this.restService.addRestGetParams(params, pagination, sort)
 
     const url = VideoCommentService.BASE_VIDEO_URL + videoId + '/comment-threads'
-    return this.authHttp.get<ThreadsResultList<VideoComment>>(url, { params })
+    return this.authHttp.get<ThreadsResultList<VideoComment>>(url, { params, headers })
                .pipe(
                  map(result => this.extractVideoComments(result)),
                  catchError(err => this.restExtractor.handleError(err))
@@ -97,12 +104,14 @@ export class VideoCommentService {
   getVideoThreadComments (parameters: {
     videoId: string
     threadId: number
+    videoPassword?: string
   }): Observable<VideoCommentThreadTree> {
-    const { videoId, threadId } = parameters
+    const { videoId, threadId, videoPassword } = parameters
     const url = `${VideoCommentService.BASE_VIDEO_URL + videoId}/comment-threads/${threadId}`
+    const headers = VideoPasswordService.buildVideoPasswordHeader(videoPassword)
 
     return this.authHttp
-               .get<VideoCommentThreadTreeServerModel>(url)
+               .get<VideoCommentThreadTreeServerModel>(url, { headers })
                .pipe(
                  map(tree => this.extractVideoCommentTree(tree)),
                  catchError(err => this.restExtractor.handleError(err))
diff --git a/client/src/app/shared/shared-video-miniature/video-download.component.ts b/client/src/app/shared/shared-video-miniature/video-download.component.ts
index cac82d8d0..146ea7dfe 100644
--- a/client/src/app/shared/shared-video-miniature/video-download.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-download.component.ts
@@ -1,13 +1,13 @@
 import { mapValues } from 'lodash-es'
 import { firstValueFrom } from 'rxjs'
 import { tap } from 'rxjs/operators'
-import { Component, ElementRef, Inject, LOCALE_ID, ViewChild } from '@angular/core'
+import { Component, ElementRef, Inject, Input, LOCALE_ID, ViewChild } from '@angular/core'
 import { HooksService } from '@app/core'
 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'
 import { logger } from '@root-helpers/logger'
-import { videoRequiresAuth } from '@root-helpers/video'
+import { videoRequiresFileToken } from '@root-helpers/video'
 import { objectKeysTyped, pick } from '@shared/core-utils'
-import { VideoCaption, VideoFile, VideoPrivacy } from '@shared/models'
+import { VideoCaption, VideoFile } from '@shared/models'
 import { BytesPipe, NumberFormatterPipe, VideoDetails, VideoFileTokenService, VideoService } from '../shared-main'
 
 type DownloadType = 'video' | 'subtitles'
@@ -21,6 +21,8 @@ type FileMetadata = { [key: string]: { label: string, value: string | number } }
 export class VideoDownloadComponent {
   @ViewChild('modal', { static: true }) modal: ElementRef
 
+  @Input() videoPassword: string
+
   downloadType: 'direct' | 'torrent' = 'direct'
 
   resolutionId: number | string = -1
@@ -89,8 +91,8 @@ export class VideoDownloadComponent {
       this.subtitleLanguageId = this.videoCaptions[0].language.id
     }
 
-    if (videoRequiresAuth(this.video)) {
-      this.videoFileTokenService.getVideoFileToken(this.video.uuid)
+    if (this.isConfidentialVideo()) {
+      this.videoFileTokenService.getVideoFileToken({ videoUUID: this.video.uuid, videoPassword: this.videoPassword })
         .subscribe(({ token }) => this.videoFileToken = token)
     }
 
@@ -201,7 +203,8 @@ export class VideoDownloadComponent {
   }
 
   isConfidentialVideo () {
-    return this.video.privacy.id === VideoPrivacy.PRIVATE || this.video.privacy.id === VideoPrivacy.INTERNAL
+    return videoRequiresFileToken(this.video)
+
   }
 
   switchToType (type: DownloadType) {
diff --git a/client/src/app/shared/shared-video-miniature/video-filters-header.component.html b/client/src/app/shared/shared-video-miniature/video-filters-header.component.html
index 3d39c6fdc..3fbfaed28 100644
--- a/client/src/app/shared/shared-video-miniature/video-filters-header.component.html
+++ b/client/src/app/shared/shared-video-miniature/video-filters-header.component.html
@@ -125,7 +125,7 @@
         <my-peertube-checkbox
           formControlName="allVideos"
           inputName="allVideos"
-          i18n-labelText labelText="Display all videos (private, unlisted or not yet published)"
+          i18n-labelText labelText="Display all videos (private, unlisted, password protected or not yet published)"
         ></my-peertube-checkbox>
       </div>
     </div>
diff --git a/client/src/app/shared/shared-video-miniature/video-miniature.component.html b/client/src/app/shared/shared-video-miniature/video-miniature.component.html
index 3f0180695..9e0a4f79b 100644
--- a/client/src/app/shared/shared-video-miniature/video-miniature.component.html
+++ b/client/src/app/shared/shared-video-miniature/video-miniature.component.html
@@ -5,6 +5,7 @@
   >
     <ng-container ngProjectAs="label-warning" *ngIf="displayOptions.privacyLabel && isUnlistedVideo()" i18n>Unlisted</ng-container>
     <ng-container ngProjectAs="label-danger" *ngIf="displayOptions.privacyLabel && isPrivateVideo()" i18n>Private</ng-container>
+    <ng-container ngProjectAs="label-danger" *ngIf="displayOptions.privacyLabel && isPasswordProtectedVideo()" i18n>Password protected</ng-container>
   </my-video-thumbnail>
 
   <div class="video-bottom">
diff --git a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
index 2384b34d7..d453f37a1 100644
--- a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
@@ -171,6 +171,10 @@ export class VideoMiniatureComponent implements OnInit {
     return this.video.privacy.id === VideoPrivacy.PRIVATE
   }
 
+  isPasswordProtectedVideo () {
+    return this.video.privacy.id === VideoPrivacy.PASSWORD_PROTECTED
+  }
+
   getStateLabel (video: Video) {
     if (!video.state) return ''
 
diff --git a/client/src/app/shared/shared-video-miniature/videos-list.component.ts b/client/src/app/shared/shared-video-miniature/videos-list.component.ts
index 7b832263e..45df0be38 100644
--- a/client/src/app/shared/shared-video-miniature/videos-list.component.ts
+++ b/client/src/app/shared/shared-video-miniature/videos-list.component.ts
@@ -241,6 +241,7 @@ export class VideosListComponent implements OnInit, OnChanges, OnDestroy {
   }
 
   reloadVideos () {
+    console.log('reload')
     this.pagination.currentPage = 1
     this.loadMoreVideos(true)
   }
@@ -420,7 +421,7 @@ export class VideosListComponent implements OnInit, OnChanges, OnDestroy {
 
           if (reset) this.videos = []
           this.videos = this.videos.concat(data)
-
+          console.log('subscribe')
           if (this.groupByDate) this.buildGroupedDateLabels()
 
           this.onDataSubject.next(data)
diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html
index 75afa0709..882b14c5e 100644
--- a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html
+++ b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.html
@@ -21,7 +21,8 @@
             [attr.title]="playlistElement.video.name"
           >{{ playlistElement.video.name }}</a>
 
-          <span *ngIf="isVideoPrivate()" class="pt-badge badge-yellow">Private</span>
+          <span i18n *ngIf="isVideoPrivate()" class="pt-badge badge-yellow">Private</span>
+          <span i18n *ngIf="isVideoPasswordProtected()" class="pt-badge badge-yellow">Password protected</span>
         </div>
 
         <span class="video-miniature-created-at-views">
diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts
index 552ea742b..b9a1d9623 100644
--- a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts
+++ b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts
@@ -60,6 +60,10 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
     return this.playlistElement.video.privacy.id === VideoPrivacy.PRIVATE
   }
 
+  isVideoPasswordProtected () {
+    return this.playlistElement.video.privacy.id === VideoPrivacy.PASSWORD_PROTECTED
+  }
+
   isUnavailable (e: VideoPlaylistElement) {
     return e.type === VideoPlaylistElementType.UNAVAILABLE
   }