@energycap/components 0.39.21-ECAP-25650-file-upload-validation-support.20240805-1706 → 0.39.21-ECAP-25650-file-upload-validation-support.20240806-0942

package/fesm2020/energycap-components.mjs

@@ -4108,8 +4108,8 @@ class FileUploadComponent extends FormControlBase {
     // static class to create the form group from a parent component
     static getFormModel(validators, disabled = false, fileValidators) {
         let formGroup = new FormGroup({
-            file: new FormControl({ value: null, disabled: disabled }, validators),
-            name: new FormControl({ value: null, disabled: disabled }, { validators: validators, asyncValidators: fileValidators }),
+            file: new FormControl({ value: null, disabled: disabled }, { validators: validators, asyncValidators: fileValidators }),
+            name: new FormControl({ value: null, disabled: disabled }, validators),
             base64FileString: new FormControl(null),
             uploadResult: new FormControl(null),
         });
@@ -4119,10 +4119,10 @@ class FileUploadComponent extends FormControlBase {
         return formGroup;
     }
     static getFileValidator(callback) {
-        return async (nameControl) => {
-            if (nameControl.value && nameControl.parent && nameControl.parent.get('file')?.value) {
-                let file = nameControl.parent.get('file')?.value;
-                let base64 = nameControl.parent.get('base64FileString')?.value;
+        return async (control) => {
+            if (control.value && control.parent) {
+                let file = control.value;
+                let base64 = control.parent.get('base64FileString')?.value;
                 return await callback(file, base64);
             }
             return null;
@@ -4173,6 +4173,11 @@ class FileUploadComponent extends FormControlBase {
                 });
             }
         });
+        // Sync errors from the file control to the name control whenever the file control status changes
+        this.formModel.get('file')?.statusChanges.pipe(takeUntil(this.componentDestroyed)).subscribe(() => {
+            const errors = this.formModel.get('file')?.errors ?? null;
+            this.formModel.get('name')?.setErrors(errors);
+        });
     }
     async fileChange(files) {
         if (this.multiSelect) {