Add badge for permanent live in live info modal

3 files changed, 17 insertions, 12 deletions

diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.html b/client/src/app/shared/shared-video-live/live-stream-information.component.html
index 2e65e1de9..6693c1af2 100644
--- a/client/src/app/shared/shared-video-live/live-stream-information.component.html
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.html
@@ -5,15 +5,20 @@
     <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="dismiss()"></my-global-icon>
   </div>
 
-  <div class="modal-body">
+  <div class="modal-body" *ngIf="live">
+    <div>
+      <div class="badge badge-info" *ngIf="live.permanentLive" i18n>Permanent live</div>
+      <div class="badge badge-info" *ngIf="live.saveReplay" i18n>Replay will be saved</div>
+    </div>
+
     <div class="form-group">
       <label for="liveVideoRTMPUrl" i18n>Live RTMP Url</label>
-      <my-input-readonly-copy id="liveVideoRTMPUrl" [value]="rtmpUrl"></my-input-readonly-copy>
+      <my-input-readonly-copy id="liveVideoRTMPUrl" [value]="live.rtmpUrl"></my-input-readonly-copy>
     </div>
 
     <div class="form-group">
       <label for="liveVideoStreamKey" i18n>Live stream key</label>
-      <my-input-readonly-copy id="liveVideoStreamKey" [value]="streamKey"></my-input-readonly-copy>
+      <my-input-readonly-copy id="liveVideoStreamKey" [value]="live.streamKey"></my-input-readonly-copy>
 
       <div class="form-group-description" i18n>⚠️ Never share your stream key with anyone.</div>
     </div>
diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.scss b/client/src/app/shared/shared-video-live/live-stream-information.component.scss
index a79fec179..00d839448 100644
--- a/client/src/app/shared/shared-video-live/live-stream-information.component.scss
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.scss
@@ -7,4 +7,8 @@ p-autocomplete {
 
 .form-group {
   margin: 20px 0;
-}
\ No newline at end of file
+}
+
+.badge {
+  font-size: 13px;
+}
diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.ts b/client/src/app/shared/shared-video-live/live-stream-information.component.ts
index e6142eb2e..9a5d2809b 100644
--- a/client/src/app/shared/shared-video-live/live-stream-information.component.ts
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.ts
@@ -1,6 +1,7 @@
 import { Component, ElementRef, ViewChild } from '@angular/core'
 import { Video } from '@app/shared/shared-main'
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
+import { LiveVideo } from '@shared/models'
 import { LiveVideoService } from './live-video.service'
 
 @Component({
@@ -12,8 +13,7 @@ export class LiveStreamInformationComponent {
   @ViewChild('modal', { static: true }) modal: ElementRef
 
   video: Video
-  rtmpUrl = ''
-  streamKey = ''
+  live: LiveVideo
 
   constructor (
     private modalService: NgbModal,
@@ -22,8 +22,7 @@ export class LiveStreamInformationComponent {
 
   show (video: Video) {
     this.video = video
-    this.rtmpUrl = ''
-    this.streamKey = ''
+    this.live = undefined
 
     this.loadLiveInfo(video)
 
@@ -33,9 +32,6 @@ export class LiveStreamInformationComponent {
 
   private loadLiveInfo (video: Video) {
     this.liveVideoService.getVideoLive(video.id)
-      .subscribe(live => {
-        this.rtmpUrl = live.rtmpUrl
-        this.streamKey = live.streamKey
-      })
+      .subscribe(live => this.live = live)
   }
 }