From 5b22af6af8abc7e8c494dffc08ab92d35b00b084 Mon Sep 17 00:00:00 2001
From: Shivam Mishra <scm.mymail@gmail.com>
Date: Fri, 4 Oct 2024 20:34:56 +0530
Subject: [PATCH] fix: Update input event bindings to use blur events (#10216)

---
 .../modules/contact/components/AddCustomAttribute.vue          | 1 +
 .../helpcenter/components/PortalSettingsBasicForm.vue          | 2 +-
 .../dashboard/helpcenter/pages/categories/AddCategory.vue      | 1 +
 .../dashboard/helpcenter/pages/categories/EditCategory.vue     | 1 +
 .../routes/dashboard/settings/attributes/AddAttribute.vue      | 2 +-
 .../settings/integrations/DashboardApps/DashboardAppModal.vue  | 2 ++
 .../dashboard/routes/dashboard/settings/labels/AddLabel.vue    | 2 ++
 .../dashboard/routes/dashboard/settings/labels/EditLabel.vue   | 2 ++
 .../routes/dashboard/settings/profile/ChangePassword.vue       | 3 +++
 .../routes/dashboard/settings/profile/UserBasicDetails.vue     | 3 +++
 .../dashboard/routes/dashboard/settings/sla/SlaForm.vue        | 1 +
 11 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/app/javascript/dashboard/modules/contact/components/AddCustomAttribute.vue b/app/javascript/dashboard/modules/contact/components/AddCustomAttribute.vue
index 892b9d5c0..ec32c5381 100644
--- a/app/javascript/dashboard/modules/contact/components/AddCustomAttribute.vue
+++ b/app/javascript/dashboard/modules/contact/components/AddCustomAttribute.vue
@@ -84,6 +84,7 @@ export default {
         :error="attributeNameError"
         :label="$t('CUSTOM_ATTRIBUTES.FORM.NAME.LABEL')"
         :placeholder="$t('CUSTOM_ATTRIBUTES.FORM.NAME.PLACEHOLDER')"
+        @blur="v$.attributeName.$touch"
         @input="v$.attributeName.$touch"
       />
       <woot-input
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalSettingsBasicForm.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalSettingsBasicForm.vue
index 62b97a175..038023dde 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalSettingsBasicForm.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/PortalSettingsBasicForm.vue
@@ -201,7 +201,7 @@ function onFileChange({ file }) {
           :placeholder="$t('HELP_CENTER.PORTAL.ADD.NAME.PLACEHOLDER')"
           :help-text="$t('HELP_CENTER.PORTAL.ADD.NAME.HELP_TEXT')"
           @blur="v$.name.$touch"
-          @input="onNameChange"
+          @update:model-value="onNameChange"
         />
       </div>
       <div class="mb-4">
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/AddCategory.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/AddCategory.vue
index 72342b98d..91d3be0b0 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/AddCategory.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/AddCategory.vue
@@ -160,6 +160,7 @@ export default {
           :placeholder="$t('HELP_CENTER.CATEGORY.ADD.SLUG.PLACEHOLDER')"
           :help-text="$t('HELP_CENTER.CATEGORY.ADD.SLUG.HELP_TEXT')"
           @input="v$.slug.$touch"
+          @blur="v$.slug.$touch"
         />
         <label>
           {{ $t('HELP_CENTER.CATEGORY.ADD.DESCRIPTION.LABEL') }}
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/EditCategory.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/EditCategory.vue
index f8d99d587..4a3620bca 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/EditCategory.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/categories/EditCategory.vue
@@ -171,6 +171,7 @@ export default {
           :placeholder="$t('HELP_CENTER.CATEGORY.EDIT.SLUG.PLACEHOLDER')"
           :help-text="$t('HELP_CENTER.CATEGORY.EDIT.SLUG.HELP_TEXT')"
           @input="v$.slug.$touch"
+          @blur="v$.slug.$touch"
         />
         <label>
           {{ $t('HELP_CENTER.CATEGORY.EDIT.DESCRIPTION.LABEL') }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
index 8e3d16193..0cff0c448 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
@@ -186,7 +186,7 @@ export default {
                 : ''
             "
             :placeholder="$t('ATTRIBUTES_MGMT.ADD.FORM.NAME.PLACEHOLDER')"
-            @input="onDisplayNameChange"
+            @update:model-value="onDisplayNameChange"
             @blur="v$.displayName.$touch"
           />
           <woot-input
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/DashboardAppModal.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/DashboardAppModal.vue
index d07941f01..68f3c7a43 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/DashboardAppModal.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/DashboardAppModal.vue
@@ -125,6 +125,7 @@ export default {
           "
           data-testid="app-title"
           @input="v$.app.title.$touch"
+          @blur="v$.slug.$touch"
         />
         <woot-input
           v-model="app.content.url"
@@ -141,6 +142,7 @@ export default {
           "
           data-testid="app-url"
           @input="v$.app.content.url.$touch"
+          @blur="v$.app.content.url.$touch"
         />
         <div class="flex flex-row justify-end w-full gap-2 px-0 py-2">
           <woot-button
diff --git a/app/javascript/dashboard/routes/dashboard/settings/labels/AddLabel.vue b/app/javascript/dashboard/routes/dashboard/settings/labels/AddLabel.vue
index 8dbcf9a1c..63ea64e7d 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/labels/AddLabel.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/labels/AddLabel.vue
@@ -78,6 +78,7 @@ export default {
         :error="labelTitleErrorMessage"
         data-testid="label-title"
         @input="v$.title.$touch"
+        @blur="v$.title.$touch"
       />
 
       <woot-input
@@ -88,6 +89,7 @@ export default {
         :placeholder="$t('LABEL_MGMT.FORM.DESCRIPTION.PLACEHOLDER')"
         data-testid="label-description"
         @input="v$.description.$touch"
+        @blur="v$.description.$touch"
       />
 
       <div class="w-full">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/labels/EditLabel.vue b/app/javascript/dashboard/routes/dashboard/settings/labels/EditLabel.vue
index 51e0d09bd..67b6ef5e4 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/labels/EditLabel.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/labels/EditLabel.vue
@@ -84,6 +84,7 @@ export default {
         :placeholder="$t('LABEL_MGMT.FORM.NAME.PLACEHOLDER')"
         :error="labelTitleErrorMessage"
         @input="v$.title.$touch"
+        @blur="v$.title.$touch"
       />
       <woot-input
         v-model="description"
@@ -92,6 +93,7 @@ export default {
         :label="$t('LABEL_MGMT.FORM.DESCRIPTION.LABEL')"
         :placeholder="$t('LABEL_MGMT.FORM.DESCRIPTION.PLACEHOLDER')"
         @input="v$.description.$touch"
+        @blur="v$.description.$touch"
       />
 
       <div class="w-full">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue
index b6c93a126..6ac4bcbf8 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue
@@ -95,6 +95,7 @@ export default {
             : ''
         }`"
         @input="v$.currentPassword.$touch"
+        @blur="v$.currentPassword.$touch"
       />
 
       <woot-input
@@ -108,6 +109,7 @@ export default {
           v$.password.$error ? $t('PROFILE_SETTINGS.FORM.PASSWORD.ERROR') : ''
         }`"
         @input="v$.password.$touch"
+        @blur="v$.password.$touch"
       />
 
       <woot-input
@@ -125,6 +127,7 @@ export default {
             : ''
         }`"
         @input="v$.passwordConfirmation.$touch"
+        @blur="v$.passwordConfirmation.$touch"
       />
 
       <FormButton
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue
index d4662444c..f4ca75033 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue
@@ -102,6 +102,7 @@ export default {
         v$.userName.$error ? $t('PROFILE_SETTINGS.FORM.NAME.ERROR') : ''
       }`"
       @input="v$.userName.$touch"
+      @blur="v$.userName.$touch"
     />
     <woot-input
       v-model="userDisplayName"
@@ -115,6 +116,7 @@ export default {
           : ''
       }`"
       @input="v$.userDisplayName.$touch"
+      @blur="v$.userDisplayName.$touch"
     />
     <woot-input
       v-if="emailEnabled"
@@ -127,6 +129,7 @@ export default {
         v$.userEmail.$error ? $t('PROFILE_SETTINGS.FORM.EMAIL.ERROR') : ''
       }`"
       @input="v$.userEmail.$touch"
+      @blur="v$.userEmail.$touch"
     />
     <FormButton
       type="submit"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue b/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue
index cf1627c6f..de5098ac4 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue
@@ -169,6 +169,7 @@ export default {
         :placeholder="$t('SLA.FORM.NAME.PLACEHOLDER')"
         :error="slaNameErrorMessage"
         @input="v$.name.$touch"
+        @blur="v$.name.$touch"
       />
       <woot-input
         v-model="description"