Handle async validators

8 files changed, 31 insertions, 36 deletions

diff --git a/client/src/app/+videos/+video-edit/shared/video-edit.component.ts b/client/src/app/+videos/+video-edit/shared/video-edit.component.ts
index 8ce36121d..be3bbe9be 100644
--- a/client/src/app/+videos/+video-edit/shared/video-edit.component.ts
+++ b/client/src/app/+videos/+video-edit/shared/video-edit.component.ts
@@ -2,7 +2,7 @@ import { forkJoin } from 'rxjs'
 import { map } from 'rxjs/operators'
 import { SelectChannelItem } from 'src/types/select-options-item.model'
 import { ChangeDetectorRef, Component, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output, ViewChild } from '@angular/core'
-import { AbstractControl, FormArray, FormControl, FormGroup, ValidationErrors, Validators } from '@angular/forms'
+import { AbstractControl, FormArray, FormControl, FormGroup, Validators } from '@angular/forms'
 import { HooksService, PluginService, ServerService } from '@app/core'
 import { removeElementFromArray } from '@app/helpers'
 import { BuildFormValidator } from '@app/shared/form-validators'
@@ -309,10 +309,10 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     for (const setting of this.pluginFields) {
       await this.pluginService.translateSetting(setting.pluginInfo.plugin.npmName, setting.commonOptions)
 
-      const validator = (control: AbstractControl): ValidationErrors | null => {
+      const validator = async (control: AbstractControl) => {
         if (!setting.commonOptions.error) return null
 
-        const error = setting.commonOptions.error({ formValues: this.form.value, value: control.value })
+        const error = await setting.commonOptions.error({ formValues: this.form.value, value: control.value })
 
         return error?.error ? { [setting.commonOptions.name]: error.text } : null
       }
@@ -320,7 +320,8 @@ export class VideoEditComponent implements OnInit, OnDestroy {
       const name = setting.commonOptions.name
 
       pluginObj[name] = {
-        VALIDATORS: [ validator ],
+        ASYNC_VALIDATORS: [ validator ],
+        VALIDATORS: [],
         MESSAGES: {}
       }
 
@@ -342,6 +343,9 @@ export class VideoEditComponent implements OnInit, OnDestroy {
 
     this.cd.detectChanges()
     this.pluginFieldsAdded.emit()
+
+    // Plugins may need other control values to calculate potential errors
+    this.form.valueChanges.subscribe(() => this.formValidatorService.updateTreeValidity(this.pluginDataFormGroup))
   }
 
   private trackPrivacyChange () {
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts
index 46a7ebb0b..fde8c884b 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts
@@ -110,10 +110,8 @@ export class VideoGoLiveComponent extends VideoSend implements OnInit, AfterView
       })
   }
 
-  updateSecondStep () {
-    if (this.checkForm() === false) {
-      return
-    }
+  async updateSecondStep () {
+    if (!await this.isFormValid()) return
 
     const video = new VideoEdit()
     video.patch(this.form.value)
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-import-torrent.component.ts b/client/src/app/+videos/+video-edit/video-add-components/video-import-torrent.component.ts
index 5e758910e..c369ba2b7 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-import-torrent.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-import-torrent.component.ts
@@ -123,10 +123,8 @@ export class VideoImportTorrentComponent extends VideoSend implements OnInit, Af
       })
   }
 
-  updateSecondStep () {
-    if (this.checkForm() === false) {
-      return
-    }
+  async updateSecondStep () {
+    if (!await this.isFormValid()) return
 
     this.video.patch(this.form.value)
 
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-import-url.component.ts b/client/src/app/+videos/+video-edit/video-add-components/video-import-url.component.ts
index 2ea70ed55..0c78669c1 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-import-url.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-import-url.component.ts
@@ -124,10 +124,8 @@ export class VideoImportUrlComponent extends VideoSend implements OnInit, AfterV
         })
   }
 
-  updateSecondStep () {
-    if (this.checkForm() === false) {
-      return
-    }
+  async updateSecondStep () {
+    if (!await this.isFormValid()) return
 
     this.video.patch(this.form.value)
 
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-send.ts b/client/src/app/+videos/+video-edit/video-add-components/video-send.ts
index 5e086ef42..3d0e1bf2a 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-send.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-send.ts
@@ -60,12 +60,6 @@ export abstract class VideoSend extends FormReactive implements OnInit {
           })
   }
 
-  checkForm () {
-    this.forceCheck()
-
-    return this.form.valid
-  }
-
   protected updateVideoAndCaptions (video: VideoEdit) {
     this.loadingBar.useRef().start()
 
@@ -80,4 +74,11 @@ export abstract class VideoSend extends FormReactive implements OnInit {
           })
         )
   }
+
+  protected async isFormValid () {
+    await this.waitPendingCheck()
+    this.forceCheck()
+
+    return this.form.valid
+  }
 }
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-upload.component.ts b/client/src/app/+videos/+video-edit/video-add-components/video-upload.component.ts
index fa5800897..2251b0511 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-upload.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-upload.component.ts
@@ -226,7 +226,7 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
   }
 
   isPublishingButtonDisabled () {
-    return !this.checkForm() ||
+    return !this.form.valid ||
       this.isUpdatingVideo === true ||
       this.videoUploaded !== true ||
       !this.videoUploadedIds.id
@@ -239,10 +239,9 @@ export class VideoUploadComponent extends VideoSend implements OnInit, OnDestroy
     return $localize`Upload ${videofile.name}`
   }
 
-  updateSecondStep () {
-    if (this.isPublishingButtonDisabled()) {
-      return
-    }
+  async updateSecondStep () {
+    if (!await this.isFormValid()) return
+    if (this.isPublishingButtonDisabled()) return
 
     const video = new VideoEdit()
     video.patch(this.form.value)
diff --git a/client/src/app/+videos/+video-edit/video-update.component.ts b/client/src/app/+videos/+video-edit/video-update.component.ts
index e44aea10a..5e4955f6a 100644
--- a/client/src/app/+videos/+video-edit/video-update.component.ts
+++ b/client/src/app/+videos/+video-edit/video-update.component.ts
@@ -91,12 +91,6 @@ export class VideoUpdateComponent extends FormReactive implements OnInit {
     return { canDeactivate: this.formChanged === false, text }
   }
 
-  checkForm () {
-    this.forceCheck()
-
-    return this.form.valid
-  }
-
   isWaitTranscodingEnabled () {
     if (this.videoDetails.getFiles().length > 1) { // Already transcoded
       return false
@@ -109,8 +103,11 @@ export class VideoUpdateComponent extends FormReactive implements OnInit {
     return true
   }
 
-  update () {
-    if (this.checkForm() === false || this.isUpdatingVideo === true) {
+  async update () {
+    await this.waitPendingCheck()
+    this.forceCheck()
+
+    if (!this.form.valid || this.isUpdatingVideo === true) {
       return
     }
 
diff --git a/client/src/app/+videos/+video-watch/shared/comment/video-comment-add.component.ts b/client/src/app/+videos/+video-watch/shared/comment/video-comment-add.component.ts
index 71fb127f6..85da83a4c 100644
--- a/client/src/app/+videos/+video-watch/shared/comment/video-comment-add.component.ts
+++ b/client/src/app/+videos/+video-watch/shared/comment/video-comment-add.component.ts
@@ -97,7 +97,7 @@ export class VideoCommentAddComponent extends FormReactive implements OnChanges,
   }
 
   onValidKey () {
-    this.check()
+    this.forceCheck()
     if (!this.form.valid) return
 
     this.formValidated()