From 27f08a5c28b0b5f3dccf3ef9f4acda77ee089f43 Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Mon, 26 Aug 2024 20:32:46 +0200
Subject: [PATCH] FIX: allows to manually remove error for virtual fields
 (#28555)

In FormKit you can add error on an existing field existing in the DOM, but you can also set an arbitrary error on a virtual field not existing in the DOM.

When revalidating existing data, we are only resetting real fields. This commit adds `removeError(name)` to allow you to manually manage virtual fields. `removeError` is available in the same helpers where `addError` is available.

<!-- NOTE: All pull requests should have tests (rspec in Ruby, qunit in JavaScript). If your code does not include test coverage, please include an explanation of why it was omitted. -->
---
 .../addon/controllers/admin-badges/show.js    |  5 +++-
 .../app/form-kit/components/fk/form.gjs       |  7 +++++
 .../components/form-kit/form-test.gjs         | 27 +++++++++++++++++++
 3 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js b/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js
index fdb7204d527..caa4f632694 100644
--- a/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js
+++ b/app/assets/javascripts/admin/addon/controllers/admin-badges/show.js
@@ -131,7 +131,7 @@ export default class AdminBadgesShowController extends Controller {
   }
 
   @action
-  validateForm(data, { addError }) {
+  validateForm(data, { addError, removeError }) {
     if (!data.icon && !data.image_url) {
       addError("icon", {
         title: "Icon",
@@ -141,6 +141,9 @@ export default class AdminBadgesShowController extends Controller {
         title: "Image",
         message: I18n.t("admin.badges.icon_or_image"),
       });
+    } else {
+      removeError("image_url");
+      removeError("icon");
     }
   }
 
diff --git a/app/assets/javascripts/discourse/app/form-kit/components/fk/form.gjs b/app/assets/javascripts/discourse/app/form-kit/components/fk/form.gjs
index 124e70eb173..9abf212e077 100644
--- a/app/assets/javascripts/discourse/app/form-kit/components/fk/form.gjs
+++ b/app/assets/javascripts/discourse/app/form-kit/components/fk/form.gjs
@@ -43,6 +43,7 @@ class FKForm extends Component {
       submit: this.onSubmit,
       reset: this.onReset,
       addError: this.addError,
+      removeError: this.removeError,
     });
 
     this.router.on("routeWillChange", this.checkIsDirty);
@@ -95,6 +96,11 @@ class FKForm extends Component {
     });
   }
 
+  @action
+  removeError(name) {
+    this.formData.removeError(name);
+  }
+
   @action
   async addItemToCollection(name, value = {}) {
     const current = this.formData.get(name) ?? [];
@@ -221,6 +227,7 @@ class FKForm extends Component {
 
       await this.args.validate?.(this.formData.draftData, {
         addError: this.addError,
+        removeError: this.removeError,
       });
     } finally {
       this.isValidating = false;
diff --git a/app/assets/javascripts/discourse/tests/integration/components/form-kit/form-test.gjs b/app/assets/javascripts/discourse/tests/integration/components/form-kit/form-test.gjs
index 52784b3e06e..d030dfc9cae 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/form-kit/form-test.gjs
+++ b/app/assets/javascripts/discourse/tests/integration/components/form-kit/form-test.gjs
@@ -237,4 +237,31 @@ module("Integration | Component | FormKit | Form", function (hooks) {
     assert.dom(".foo").hasText("2");
     assert.dom(".bar").hasText("2");
   });
+
+  test("reset virtual errors", async function (assert) {
+    let validatedOnce = false;
+    const validate = async (data, { removeError, addError }) => {
+      if (!validatedOnce) {
+        addError("foo", { title: "Foo", message: "error" });
+
+        validatedOnce = true;
+      } else {
+        removeError("foo");
+      }
+    };
+
+    await render(<template>
+      <Form @validate={{validate}} as |form|>
+        <form.Submit />
+      </Form>
+    </template>);
+
+    await formKit().submit();
+
+    assert.form().hasErrors({ foo: "error" });
+
+    await formKit().submit();
+
+    assert.form().hasNoErrors();
+  });
 });