(plugins) adding checkbox and textarea as possible input types, add links in form label

5 files changed, 15 insertions, 3 deletions

diff --git a/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html b/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html
index aae08b94d..95dd74d31 100644
--- a/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html
+++ b/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.html
@@ -7,9 +7,16 @@
 
   <form *ngIf="hasRegisteredSettings()" role="form" (ngSubmit)="formValidated()" [formGroup]="form">
     <div class="form-group" *ngFor="let setting of registeredSettings">
-      <label [attr.for]="setting.name">{{ setting.label }}</label>
-
+      <label *ngIf="setting.type !== 'input-checkbox'" [attr.for]="setting.name" [innerHTML]="setting.label"></label>
       <input *ngIf="setting.type === 'input'" type="text" [id]="setting.name" [formControlName]="setting.name" />
+      <textarea *ngIf="setting.type === 'input-textarea'" type="text" [id]="setting.name" [formControlName]="setting.name"></textarea>
+
+      <my-peertube-checkbox
+        *ngIf="setting.type === 'input-checkbox'"
+        [id]="setting.name"
+        [formControlName]="setting.name"
+        [labelInnerHTML]="setting.label"
+      ></my-peertube-checkbox>
 
       <div *ngIf="formErrors[setting.name]" class="form-error">
         {{ formErrors[setting.name] }}
diff --git a/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.scss b/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.scss
index 42fc1b634..21c180a70 100644
--- a/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.scss
+++ b/client/src/app/+admin/plugins/plugin-show-installed/plugin-show-installed.component.scss
@@ -5,6 +5,7 @@ h2 {
   margin-bottom: 20px;
 }
 
+textarea,
 input:not([type=submit]) {
   @include peertube-input-text(340px);
   display: block;
diff --git a/client/src/app/+admin/plugins/shared/plugin-list.component.scss b/client/src/app/+admin/plugins/shared/plugin-list.component.scss
index 3663d3fdd..87a709b00 100644
--- a/client/src/app/+admin/plugins/shared/plugin-list.component.scss
+++ b/client/src/app/+admin/plugins/shared/plugin-list.component.scss
@@ -21,7 +21,8 @@
 }
 
 .second-row {
-  display: flex;
+  display: grid;
+  grid-template-columns: 1fr auto;
   align-items: center;
   justify-content: space-between;
 
@@ -30,6 +31,7 @@
   }
 
   .buttons {
+    margin-left: 10px;
     > *:not(:last-child) {
       margin-right: 10px;
     }
diff --git a/client/src/app/shared/forms/peertube-checkbox.component.html b/client/src/app/shared/forms/peertube-checkbox.component.html
index f1e3bf0bf..1c0114d97 100644
--- a/client/src/app/shared/forms/peertube-checkbox.component.html
+++ b/client/src/app/shared/forms/peertube-checkbox.component.html
@@ -3,6 +3,7 @@
     <input type="checkbox" [(ngModel)]="checked" (ngModelChange)="onModelChange()" [id]="inputName" [disabled]="disabled" />
     <span role="checkbox" [attr.aria-checked]="checked"></span>
     <span *ngIf="labelText">{{ labelText }}</span>
+    <span *ngIf="!labelText && labelInnerHTML" [innerHTML]="labelInnerHTML"></span>
 
     <span *ngIf="labelTemplate">
       <ng-container *ngTemplateOutlet="labelTemplate"></ng-container>
diff --git a/client/src/app/shared/forms/peertube-checkbox.component.ts b/client/src/app/shared/forms/peertube-checkbox.component.ts
index 3b8f39ed0..0303b7e2a 100644
--- a/client/src/app/shared/forms/peertube-checkbox.component.ts
+++ b/client/src/app/shared/forms/peertube-checkbox.component.ts
@@ -18,6 +18,7 @@ export class PeertubeCheckboxComponent implements ControlValueAccessor, AfterCon
   @Input() checked = false
   @Input() inputName: string
   @Input() labelText: string
+  @Input() labelInnerHTML: string
   @Input() helpPlacement = 'top'
   @Input() disabled = false