fix(file): add error cleanup on file removal

ref: MANAGER-15030

Signed-off-by: Jacques Larique <jacques.larique.ext@ovhcloud.com>

Author: JacquesLarique

packages/apps/workshop/stories/design-system/components/file/file-webcomponent.stories.js

@@ -129,7 +129,7 @@ DragDropWithPreview.storyName = 'Drag & Drop with preview';
 export const Validation = forModule(moduleName).createElement(
   () => compileTemplate(
     `
-    <form novalidate name="form">
+    <form novalidate name="$ctrl.form">
       <oui-field label="Upload file" help-text="image/jpeg, image/png, image/gif (max size 150 KB)">
         <oui-file name="fileUpload"
           accept="image/jpeg,image/png,image/gif"
@@ -140,7 +140,7 @@ export const Validation = forModule(moduleName).createElement(
         </oui-file>
       </oui-field>
 
-      <oui-form-actions></oui-form-actions>
+      <oui-form-actions disabled="$ctrl.form.fileUpload.$invalid"></oui-form-actions>
     </form>`,
     {
       $ctrl: {

packages/components/file/src/js/file.controller.js

@@ -103,6 +103,10 @@ export default class {
   removeFile(file) {
     if (angular.isArray(this.model)) {
       remove(this.model, (item) => item === file);
+      if (file.errors && this.model.every((item) => !item.errors)
+        && this.form && this.form[this.name]) {
+        this.form[this.name].$setValidity('maxsize', true);
+      }
       this.onRemove({ modelValue: this.model });
     }
   }

packages/components/file/src/js/file.spec.js

@@ -196,16 +196,18 @@ describe('ouiFile', () => {
         onSelectSpy = jasmine.createSpy('onSelectSpy');
         onRemoveSpy = jasmine.createSpy('onRemoveSpy');
         element = TestUtils.compileTemplate(`
-                <oui-file
-                    model="$ctrl.model"
-                    on-select="$ctrl.onSelectSpy(modelValue)"
-                    on-remove="$ctrl.onRemoveSpy(modelValue)"
-                >
-                </oui-file>`, {
+            <form name="form">
+              <oui-file
+                model="$ctrl.model"
+                on-select="$ctrl.onSelectSpy(modelValue)"
+                on-remove="$ctrl.onRemoveSpy(modelValue)"
+              >
+              </oui-file>
+            </form>`, {
           onSelectSpy,
           onRemoveSpy,
         });
-        controller = element.controller('ouiFile');
+        controller = element.find('oui-file').controller('ouiFile');
 
         $timeout.flush();
       });
@@ -261,6 +263,14 @@ describe('ouiFile', () => {
         expect(controller.model.length).toBe(0);
         expect(onRemoveSpy).toHaveBeenCalledWith(controller.model);
       });
+
+      it('should clear errors after file removal', () => {
+        controller.maxsize = 100000;
+        controller.addFiles(mockFiles);
+        expect(controller.form[controller.name].$invalid).toBe(true);
+        controller.removeFile(mockFile);
+        expect(controller.form[controller.name].$invalid).toBe(false);
+      });
     });
 
     describe('Form controls', () => {