Fix error messages when updating the form
This commit is contained in:
Chocobozzz
parent
dec8948225
commit
fd8fb56c76
|
|
@ -1,35 +1,35 @@
|
|||
import { NgIf } from '@angular/common'
|
||||
import { HttpErrorResponse } from '@angular/common/http'
|
||||
import { Component, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core'
|
||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms'
|
||||
import { ActivatedRoute, Router } from '@angular/router'
|
||||
import { AuthService, CanComponentDeactivate, ConfirmService, Notifier, ServerService, UserService } from '@app/core'
|
||||
import { buildHTTPErrorResponse, genericUploadErrorHandler } from '@app/helpers'
|
||||
import { FormReactive } from '@app/shared/shared-forms/form-reactive'
|
||||
import { FormReactiveService } from '@app/shared/shared-forms/form-reactive.service'
|
||||
import { VideoCaptionEdit } from '@app/shared/shared-main/video-caption/video-caption-edit.model'
|
||||
import { VideoCaptionService } from '@app/shared/shared-main/video-caption/video-caption.service'
|
||||
import { VideoChapterService } from '@app/shared/shared-main/video/video-chapter.service'
|
||||
import { VideoChaptersEdit } from '@app/shared/shared-main/video/video-chapters-edit.model'
|
||||
import { VideoDetails } from '@app/shared/shared-main/video/video-details.model'
|
||||
import { VideoEdit } from '@app/shared/shared-main/video/video-edit.model'
|
||||
import { Video } from '@app/shared/shared-main/video/video.model'
|
||||
import { VideoService } from '@app/shared/shared-main/video/video.service'
|
||||
import { LiveVideoService } from '@app/shared/shared-video-live/live-video.service'
|
||||
import { LoadingBarService } from '@ngx-loading-bar/core'
|
||||
import { simpleObjectsDeepEqual } from '@peertube/peertube-core-utils'
|
||||
import { HttpStatusCode, LiveVideo, LiveVideoUpdate, VideoPrivacy, VideoSource, VideoState } from '@peertube/peertube-models'
|
||||
import debug from 'debug'
|
||||
import { UploadState, UploadxService } from 'ngx-uploadx'
|
||||
import { of, Subject, Subscription } from 'rxjs'
|
||||
import { catchError, map, switchMap } from 'rxjs/operators'
|
||||
import { SelectChannelItem } from 'src/types/select-options-item.model'
|
||||
import { HttpErrorResponse } from '@angular/common/http'
|
||||
import { Component, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core'
|
||||
import { ActivatedRoute, Router, RouterLink } from '@angular/router'
|
||||
import { AuthService, CanComponentDeactivate, ConfirmService, Notifier, ServerService, UserService } from '@app/core'
|
||||
import { buildHTTPErrorResponse, genericUploadErrorHandler } from '@app/helpers'
|
||||
import { FormReactive } from '@app/shared/shared-forms/form-reactive'
|
||||
import { FormReactiveService } from '@app/shared/shared-forms/form-reactive.service'
|
||||
import { LoadingBarService } from '@ngx-loading-bar/core'
|
||||
import { simpleObjectsDeepEqual } from '@peertube/peertube-core-utils'
|
||||
import { HttpStatusCode, LiveVideo, LiveVideoUpdate, VideoPrivacy, VideoSource, VideoState } from '@peertube/peertube-models'
|
||||
import { hydrateFormFromVideo } from './shared/video-edit-utils'
|
||||
import { VideoUploadService } from './shared/video-upload.service'
|
||||
import { VideoEditComponent } from './shared/video-edit.component'
|
||||
import { ButtonComponent } from '../../shared/shared-main/buttons/button.component'
|
||||
import { ReactiveFileComponent } from '../../shared/shared-forms/reactive-file.component'
|
||||
import { NgIf } from '@angular/common'
|
||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms'
|
||||
import { ButtonComponent } from '../../shared/shared-main/buttons/button.component'
|
||||
import { UploadProgressComponent } from '../../shared/standalone-upload/upload-progress.component'
|
||||
import { VideoDetails } from '@app/shared/shared-main/video/video-details.model'
|
||||
import { VideoEdit } from '@app/shared/shared-main/video/video-edit.model'
|
||||
import { VideoCaptionEdit } from '@app/shared/shared-main/video-caption/video-caption-edit.model'
|
||||
import { VideoCaptionService } from '@app/shared/shared-main/video-caption/video-caption.service'
|
||||
import { VideoChapterService } from '@app/shared/shared-main/video/video-chapter.service'
|
||||
import { VideoChaptersEdit } from '@app/shared/shared-main/video/video-chapters-edit.model'
|
||||
import { Video } from '@app/shared/shared-main/video/video.model'
|
||||
import { VideoService } from '@app/shared/shared-main/video/video.service'
|
||||
import { LiveVideoService } from '@app/shared/shared-video-live/live-video.service'
|
||||
import { hydrateFormFromVideo } from './shared/video-edit-utils'
|
||||
import { VideoEditComponent } from './shared/video-edit.component'
|
||||
import { VideoUploadService } from './shared/video-upload.service'
|
||||
|
||||
const debugLogger = debug('peertube:video-update')
|
||||
|
||||
|
|
@ -38,7 +38,6 @@ const debugLogger = debug('peertube:video-update')
|
|||
styleUrls: [ './shared/video-edit.component.scss' ],
|
||||
templateUrl: './video-update.component.html',
|
||||
imports: [
|
||||
RouterLink,
|
||||
UploadProgressComponent,
|
||||
FormsModule,
|
||||
ReactiveFormsModule,
|
||||
|
|
|
|||
|
|
@ -10,35 +10,51 @@
|
|||
|
||||
<div *ngIf="setting.descriptionHTML" class="label-small-info" [innerHTML]="setting.descriptionHTML"></div>
|
||||
|
||||
<input *ngIf="setting.type === 'input'" type="text" [id]="setting.name" [formControlName]="setting.name" />
|
||||
@switch (setting.type) {
|
||||
@case ('input') {
|
||||
<input type="text" [id]="setting.name" [formControlName]="setting.name" />
|
||||
}
|
||||
|
||||
<div *ngIf="setting.type === 'select'" class="peertube-select-container">
|
||||
<select [id]="setting.name" [formControlName]="setting.name" class="form-control">
|
||||
<option *ngFor="let option of setting.options" [value]="option.value">{{ option.label }}</option>
|
||||
</select>
|
||||
</div>
|
||||
@case ('select') {
|
||||
<div class="peertube-select-container">
|
||||
<select [id]="setting.name" [formControlName]="setting.name" class="form-control">
|
||||
<option *ngFor="let option of setting.options" [value]="option.value">{{ option.label }}</option>
|
||||
</select>
|
||||
</div>
|
||||
}
|
||||
|
||||
<my-input-text *ngIf="setting.type === 'input-password'" [formError]="formErrors['settings.name']" [formControlName]="setting.name" [inputId]="setting.name"></my-input-text>
|
||||
@case ('input-password') {
|
||||
<my-input-text [formError]="formErrors['settings.name']" [formControlName]="setting.name" [inputId]="setting.name"></my-input-text>
|
||||
}
|
||||
|
||||
<textarea *ngIf="setting.type === 'input-textarea'" type="text" [id]="setting.name" [formControlName]="setting.name"></textarea>
|
||||
@case ('input-textarea') {
|
||||
<textarea type="text" [id]="setting.name" [formControlName]="setting.name"></textarea>
|
||||
|
||||
<my-help *ngIf="setting.type === 'markdown-text'" helpType="markdownText"></my-help>
|
||||
}
|
||||
|
||||
<my-help *ngIf="setting.type === 'markdown-enhanced'" helpType="markdownEnhanced"></my-help>
|
||||
@case ('markdown-text') {
|
||||
<my-help helpType="markdownText"></my-help>
|
||||
|
||||
<my-markdown-textarea
|
||||
*ngIf="setting.type === 'markdown-text'"
|
||||
markdownType="text" [inputId]="setting.name" [formControlName]="setting.name"
|
||||
[formError]="formErrors['settings.name']"
|
||||
></my-markdown-textarea>
|
||||
<my-markdown-textarea
|
||||
markdownType="text" [inputId]="setting.name" [formControlName]="setting.name"
|
||||
[formError]="formErrors['settings.name']"
|
||||
></my-markdown-textarea>
|
||||
}
|
||||
|
||||
<my-markdown-textarea
|
||||
*ngIf="setting.type === 'markdown-enhanced'"
|
||||
markdownType="enhanced" [inputId]="setting.name" [formControlName]="setting.name"
|
||||
[formError]="formErrors['settings.name']"
|
||||
></my-markdown-textarea>
|
||||
@case ('markdown-enhanced') {
|
||||
<my-help helpType="markdownEnhanced"></my-help>
|
||||
|
||||
<div *ngIf="setting.type === 'html'" [innerHTML]="setting.html"></div>
|
||||
<my-markdown-textarea
|
||||
markdownType="enhanced" [inputId]="setting.name" [formControlName]="setting.name"
|
||||
[formError]="formErrors['settings.name']"
|
||||
></my-markdown-textarea>
|
||||
|
||||
}
|
||||
|
||||
@case ('html') {
|
||||
<div [innerHTML]="setting.html"></div>
|
||||
}
|
||||
}
|
||||
|
||||
<div *ngIf="hasDedicatedFormError() && formErrors[setting.name]" class="form-error" role="alert">
|
||||
{{ formErrors[setting.name] }}
|
||||
|
|
|
|||
|
|
@ -49,16 +49,15 @@ export class FormValidatorService {
|
|||
defaultValues: BuildFormDefaultValues = {}
|
||||
) {
|
||||
for (const name of objectKeysTyped(formToBuild)) {
|
||||
if (typeof formErrors[name] === 'string') {
|
||||
formErrors[name] = ''
|
||||
}
|
||||
|
||||
const field = formToBuild[name]
|
||||
|
||||
if (this.isRecursiveField(field)) {
|
||||
formErrors[name] = {}
|
||||
|
||||
this.updateFormGroup(
|
||||
// FIXME: typings
|
||||
(form as any)[name],
|
||||
formErrors[name] as FormReactiveErrors,
|
||||
formErrors[name],
|
||||
validationMessages[name] as FormReactiveValidationMessages,
|
||||
formToBuild[name] as BuildFormArgument,
|
||||
defaultValues[name] as BuildFormDefaultValues
|
||||
|
|
@ -66,6 +65,8 @@ export class FormValidatorService {
|
|||
continue
|
||||
}
|
||||
|
||||
formErrors[name] = ''
|
||||
|
||||
if (field?.MESSAGES) validationMessages[name] = field.MESSAGES as { [ name: string ]: string }
|
||||
|
||||
const defaultValue = defaultValues[name] ?? ''
|
||||
|
|
|
|||
|
|
@ -317,7 +317,7 @@ class StatsCard extends Component {
|
|||
|
||||
const p2pEnabled = this.options_.p2pEnabled && this.mode === 'p2p-media-loader'
|
||||
|
||||
this.setInfoValue(this.playerMode, this.mode)
|
||||
this.setInfoValue(this.playerMode, this.mode === 'p2p-media-loader' ? 'P2P Media Loader (v2)' : 'Web Video')
|
||||
this.setInfoValue(this.p2p, player.localize(p2pEnabled ? 'enabled' : 'disabled'))
|
||||
this.setInfoValue(this.uuid, this.options_.videoUUID)
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue