Add 4k conf in transcoding in admin panel

2 files changed, 29 insertions, 10 deletions

diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
index 44fc6dc26..d5b625d9c 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
@@ -309,8 +309,8 @@
             <ng-container formGroupName="resolutions">
               <div class="form-group" *ngFor="let resolution of resolutions">
                 <my-peertube-checkbox
-                  [inputName]="getResolutionKey(resolution)" [formControlName]="resolution"
-                  i18n-labelText labelText="Resolution {{resolution}} enabled"
+                  [inputName]="getResolutionKey(resolution.id)" [formControlName]="resolution.id"
+                  i18n-labelText labelText="Resolution {{resolution.label}} enabled"
                 ></my-peertube-checkbox>
               </div>
             </ng-container>
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
index c238a6c81..055bae851 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
@@ -15,7 +15,7 @@ import { FormValidatorService } from '@app/shared/forms/form-validators/form-val
 export class EditCustomConfigComponent extends FormReactive implements OnInit {
   customConfig: CustomConfig
 
-  resolutions: string[] = []
+  resolutions: { id: string, label: string }[] = []
   transcodingThreadOptions: { label: string, value: number }[] = []
 
   constructor (
@@ -30,11 +30,30 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
     super()
 
     this.resolutions = [
-      this.i18n('240p'),
-      this.i18n('360p'),
-      this.i18n('480p'),
-      this.i18n('720p'),
-      this.i18n('1080p')
+      {
+        id: '240p',
+        label: this.i18n('240p')
+      },
+      {
+        id: '360p',
+        label: this.i18n('360p')
+      },
+      {
+        id: '480p',
+        label: this.i18n('480p')
+      },
+      {
+        id: '720p',
+        label: this.i18n('720p')
+      },
+      {
+        id: '1080p',
+        label: this.i18n('1080p')
+      },
+      {
+        id: '2160p',
+        label: this.i18n('2160p')
+      }
     ]
 
     this.transcodingThreadOptions = [
@@ -140,8 +159,8 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
       }
     }
     for (const resolution of this.resolutions) {
-      defaultValues.transcoding.resolutions[resolution] = 'false'
-      formGroupData.transcoding.resolutions[resolution] = null
+      defaultValues.transcoding.resolutions[resolution.id] = 'false'
+      formGroupData.transcoding.resolutions[resolution.id] = null
     }
 
     this.buildForm(formGroupData)