From 8a6e43a3d4bc257eb0516af8a26a3fcbc6e2ae61 Mon Sep 17 00:00:00 2001
From: Alan Guo Xiang Tan <gxtan1990@gmail.com>
Date: Mon, 25 Mar 2024 16:06:32 +0800
Subject: [PATCH] FIX: Fix broken translation in tags input field objects
 setting editor (#26340)

Why this change?

When a property of `type: tags` is required, we should be displaying the
"at least 1 tag is required" validation error message when there are no
tags selected in the `TagChooser` compoment. However, we were passing
`this.min` as the `count` attribute when generating the translation
string which is incorrect as `this.min` is not always set.
---
 .../schema-theme-setting/types/tags.gjs       |  4 +-
 .../editor-test.gjs                           | 45 ++++++++++++++-----
 config/locales/client.en.yml                  |  2 +-
 3 files changed, 38 insertions(+), 13 deletions(-)

diff --git a/app/assets/javascripts/admin/addon/components/schema-theme-setting/types/tags.gjs b/app/assets/javascripts/admin/addon/components/schema-theme-setting/types/tags.gjs
index 5ccc04b009d..be3680ce921 100644
--- a/app/assets/javascripts/admin/addon/components/schema-theme-setting/types/tags.gjs
+++ b/app/assets/javascripts/admin/addon/components/schema-theme-setting/types/tags.gjs
@@ -36,8 +36,8 @@ export default class SchemaThemeSettingTypeTags extends Component {
       (this.min && this.value.length < this.min) ||
       (this.required && (!this.value || this.value.length === 0))
     ) {
-      return I18n.t("admin.customize.theme.schema.fields.tags.at_least_tag", {
-        count: this.min,
+      return I18n.t("admin.customize.theme.schema.fields.tags.at_least", {
+        count: this.min || 1,
       });
     }
   }
diff --git a/app/assets/javascripts/discourse/tests/integration/components/admin-schema-theme-setting/editor-test.gjs b/app/assets/javascripts/discourse/tests/integration/components/admin-schema-theme-setting/editor-test.gjs
index 9ae8eee39ca..2dfca2521dc 100644
--- a/app/assets/javascripts/discourse/tests/integration/components/admin-schema-theme-setting/editor-test.gjs
+++ b/app/assets/javascripts/discourse/tests/integration/components/admin-schema-theme-setting/editor-test.gjs
@@ -736,6 +736,10 @@ module(
             required_tags: {
               type: "tags",
               required: true,
+            },
+            required_tags_with_validations: {
+              type: "tags",
+              required: true,
               validations: {
                 min: 2,
                 max: 3,
@@ -745,7 +749,8 @@ module(
         },
         value: [
           {
-            required_tags: ["gazelle", "cat"],
+            required_tags: ["gazelle"],
+            required_tags_with_validations: ["gazelle", "cat"],
           },
         ],
       });
@@ -756,8 +761,8 @@ module(
 
       const inputFields = new InputFieldsFromDOM();
 
-      const tagSelector = selectKit(
-        `${inputFields.fields.required_tags.selector} .select-kit`
+      let tagSelector = selectKit(
+        `${inputFields.fields.required_tags_with_validations.selector} .select-kit`
       );
 
       assert.strictEqual(tagSelector.header().value(), "gazelle,cat");
@@ -778,11 +783,13 @@ module(
 
       inputFields.refresh();
 
-      assert.dom(inputFields.fields.required_tags.errorElement).hasText(
-        I18n.t("admin.customize.theme.schema.fields.tags.at_least_tag", {
-          count: 2,
-        })
-      );
+      assert
+        .dom(inputFields.fields.required_tags_with_validations.errorElement)
+        .hasText(
+          I18n.t("admin.customize.theme.schema.fields.tags.at_least", {
+            count: 2,
+          })
+        );
 
       await tagSelector.expand();
       await tagSelector.selectRowByIndex(1);
@@ -791,9 +798,27 @@ module(
 
       inputFields.refresh();
 
+      assert
+        .dom(inputFields.fields.required_tags_with_validations.errorElement)
+        .hasText(
+          I18n.t("admin.customize.theme.schema.fields.tags.at_least", {
+            count: 2,
+          })
+        );
+
+      tagSelector = selectKit(
+        `${inputFields.fields.required_tags.selector} .select-kit`
+      );
+
+      await tagSelector.expand();
+      await tagSelector.deselectItemByName("gazelle");
+      await tagSelector.collapse();
+
+      inputFields.refresh();
+
       assert.dom(inputFields.fields.required_tags.errorElement).hasText(
-        I18n.t("admin.customize.theme.schema.fields.tags.at_least_tag", {
-          count: 2,
+        I18n.t("admin.customize.theme.schema.fields.tags.at_least", {
+          count: 1,
         })
       );
     });
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 0d0761b3973..8fd60ff999a 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -5653,7 +5653,7 @@ en:
             fields:
               required: "*required"
               tags:
-                at_least_tag:
+                at_least:
                   one: "at least %{count} tag is required"
                   other: "at least %{count} tags are required"
               string: