client/src/app/shared/shared-moderation/report-modals/report.component.html

   1 <ng-template #modal>
   2   <div class="modal-header">
   3     <h4 class="modal-title">{{ modalTitle }}</h4>
   4     <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon>
   5   </div>
   6
   7   <div class="modal-body">
   8     <form novalidate [formGroup]="form" (ngSubmit)="report()">
   9
  10     <div class="row">
  11       <div class="col-5">
  12
  13           <label i18n for="reportPredefinedReasons">What is the issue?</label>
  14
  15           <div class="ms-2 mt-2 d-flex flex-column">
  16             <ng-container formGroupName="predefinedReasons">
  17
  18               <div class="form-group" *ngFor="let reason of predefinedReasons">
  19                 <my-peertube-checkbox [inputName]="reason.id" [formControlName]="reason.id" [labelText]="reason.label">
  20                   <ng-template *ngIf="reason.help" ptTemplate="help">
  21                     <div [innerHTML]="reason.help"></div>
  22                   </ng-template>
  23
  24                   <ng-container *ngIf="reason.description" ngProjectAs="description">
  25                     <div [innerHTML]="reason.description"></div>
  26                   </ng-container>
  27                 </my-peertube-checkbox>
  28               </div>
  29
  30             </ng-container>
  31           </div>
  32       </div>
  33
  34       <div class="col-7">
  35         <div i18n class="information">
  36           Your report will be sent to moderators of {{ currentHost }}<ng-container *ngIf="isRemote()"> and will be forwarded to the comment origin ({{ originHost }}) too</ng-container>.
  37         </div>
  38
  39         <div class="form-group">
  40           <textarea
  41             i18n-placeholder placeholder="Please describe the issue..." formControlName="reason" ngbAutofocus
  42             [ngClass]="{ 'input-error': formErrors['reason'] }" class="form-control"
  43           ></textarea>
  44           <div *ngIf="formErrors.reason" class="form-error">
  45             {{ formErrors.reason }}
  46           </div>
  47         </div>
  48       </div>
  49     </div>
  50
  51     <div class="form-group inputs">
  52       <input
  53         type="button" role="button" i18n-value value="Cancel" class="peertube-button grey-button"
  54         (click)="hide()" (key.enter)="hide()"
  55       >
  56
  57       <input type="submit" i18n-value value="Submit" class="peertube-button orange-button" [disabled]="!form.valid">
  58     </div>
  59
  60     </form>
  61   </div>
  62 </ng-template>