From 2adcdcb2c5c8751dc55cd3e34a8246a93b377fb6 Mon Sep 17 00:00:00 2001
From: VH <hoangzinhvn@gmail.com>
Date: Mon, 3 Jul 2023 18:26:43 +0700
Subject: [PATCH 1/3] Get first error object to show in validate code form

---
 src/libs/ErrorUtils.js                        | 23 ++++++++++++++++++-
 .../ValidateCodeForm/BaseValidateCodeForm.js  |  2 +-
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/libs/ErrorUtils.js b/src/libs/ErrorUtils.js
index fdeae7809f58..d358105477a2 100644
--- a/src/libs/ErrorUtils.js
+++ b/src/libs/ErrorUtils.js
@@ -88,6 +88,27 @@ function getLatestErrorField(onyxData, fieldName) {
         .value();
 }
 
+/**
+ * Get the first error in the errorFields ordering by its key
+ *
+ * @param {Object} onyxData
+ * @param {String} fieldName
+ * @returns {Object}
+ */
+function getFirstErrorField(onyxData, fieldName) {
+    const errorsForField = lodashGet(onyxData, ['errorFields', fieldName], {});
+
+    if (_.isEmpty(errorsForField)) {
+        return {};
+    }
+    return _.chain(errorsForField)
+        .keys()
+        .sortBy()
+        .map((key) => ({[key]: errorsForField[key]}))
+        .first()
+        .value();
+}
+
 /**
  * Method used to generate error message for given inputID
  * @param {Object} errors - An object containing current errors in the form
@@ -112,4 +133,4 @@ function addErrorMessage(errors, inputID, message) {
     }
 }
 
-export {getAuthenticateErrorMessage, getMicroSecondOnyxError, getLatestErrorMessage, getLatestErrorField, addErrorMessage};
+export {getAuthenticateErrorMessage, getMicroSecondOnyxError, getLatestErrorMessage, getLatestErrorField, getFirstErrorField, addErrorMessage};
diff --git a/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js b/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js
index 5b1aa87cea80..57a195b53db8 100644
--- a/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js
+++ b/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js
@@ -165,7 +165,7 @@ function BaseValidateCodeForm(props) {
             </OfflineWithFeedback>
             <OfflineWithFeedback
                 pendingAction={lodashGet(loginData, 'pendingFields.validateLogin', null)}
-                errors={ErrorUtils.getLatestErrorField(loginData, 'validateLogin')}
+                errors={ErrorUtils.getFirstErrorField(loginData, 'validateLogin')}
                 errorRowStyles={[styles.mt2]}
                 onClose={() => User.clearContactMethodErrors(props.contactMethod, 'validateLogin')}
             >

From cc29b60a90b82eaf20721ff1f0a1bb22e720f542 Mon Sep 17 00:00:00 2001
From: VH <hoangzinhvn@gmail.com>
Date: Thu, 6 Jul 2023 00:21:31 +0700
Subject: [PATCH 2/3] Update JSDoc

---
 src/libs/ErrorUtils.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/libs/ErrorUtils.js b/src/libs/ErrorUtils.js
index d358105477a2..81899cb7c849 100644
--- a/src/libs/ErrorUtils.js
+++ b/src/libs/ErrorUtils.js
@@ -89,9 +89,8 @@ function getLatestErrorField(onyxData, fieldName) {
 }
 
 /**
- * Get the first error in the errorFields ordering by its key
- *
  * @param {Object} onyxData
+ * @param {Object} onyxData.errorFields
  * @param {String} fieldName
  * @returns {Object}
  */

From 910780cca2517fb7737282b4e64e7a6687e0d82f Mon Sep 17 00:00:00 2001
From: VH <hoangzinhvn@gmail.com>
Date: Thu, 6 Jul 2023 17:27:47 +0700
Subject: [PATCH 3/3] Rename method as feedback

---
 src/libs/ErrorUtils.js                                        | 4 ++--
 .../Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/libs/ErrorUtils.js b/src/libs/ErrorUtils.js
index 81899cb7c849..95bbad5f5409 100644
--- a/src/libs/ErrorUtils.js
+++ b/src/libs/ErrorUtils.js
@@ -94,7 +94,7 @@ function getLatestErrorField(onyxData, fieldName) {
  * @param {String} fieldName
  * @returns {Object}
  */
-function getFirstErrorField(onyxData, fieldName) {
+function getEarliestErrorField(onyxData, fieldName) {
     const errorsForField = lodashGet(onyxData, ['errorFields', fieldName], {});
 
     if (_.isEmpty(errorsForField)) {
@@ -132,4 +132,4 @@ function addErrorMessage(errors, inputID, message) {
     }
 }
 
-export {getAuthenticateErrorMessage, getMicroSecondOnyxError, getLatestErrorMessage, getLatestErrorField, getFirstErrorField, addErrorMessage};
+export {getAuthenticateErrorMessage, getMicroSecondOnyxError, getLatestErrorMessage, getLatestErrorField, getEarliestErrorField, addErrorMessage};
diff --git a/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js b/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js
index 57a195b53db8..a24b7036bd48 100644
--- a/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js
+++ b/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js
@@ -165,7 +165,7 @@ function BaseValidateCodeForm(props) {
             </OfflineWithFeedback>
             <OfflineWithFeedback
                 pendingAction={lodashGet(loginData, 'pendingFields.validateLogin', null)}
-                errors={ErrorUtils.getFirstErrorField(loginData, 'validateLogin')}
+                errors={ErrorUtils.getEarliestErrorField(loginData, 'validateLogin')}
                 errorRowStyles={[styles.mt2]}
                 onClose={() => User.clearContactMethodErrors(props.contactMethod, 'validateLogin')}
             >