From 95efb3344474e3cf78aad972fac3e5700110222d Mon Sep 17 00:00:00 2001
From: DylanDylann <dylandylan9112@gmail.com>
Date: Thu, 4 Jan 2024 14:55:44 +0700
Subject: [PATCH 1/2] fix no required field validation state picker

---
 src/components/StatePicker/index.js | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/StatePicker/index.js b/src/components/StatePicker/index.js
index 6fa60fbba947..3ec37b5a308d 100644
--- a/src/components/StatePicker/index.js
+++ b/src/components/StatePicker/index.js
@@ -25,6 +25,9 @@ const propTypes = {
 
     /** Label to display on field */
     label: PropTypes.string,
+
+    /**  Callback to call when the picker modal is dismissed */
+    onBlur: PropTypes.func,
 };
 
 const defaultProps = {
@@ -33,9 +36,10 @@ const defaultProps = {
     errorText: '',
     onInputChange: () => {},
     label: undefined,
+    onBlur: () => {},
 };
 
-function StatePicker({value, errorText, onInputChange, forwardedRef, label}) {
+function StatePicker({value, errorText, onInputChange, forwardedRef, label, onBlur}) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
     const [isPickerVisible, setIsPickerVisible] = useState(false);
@@ -45,7 +49,10 @@ function StatePicker({value, errorText, onInputChange, forwardedRef, label}) {
         setIsPickerVisible(true);
     };
 
-    const hidePickerModal = () => {
+    const hidePickerModal = (isUpdateStateInput = false) => {
+        if (!isUpdateStateInput) {
+            onBlur();
+        }
         setIsPickerVisible(false);
     };
 
@@ -53,7 +60,7 @@ function StatePicker({value, errorText, onInputChange, forwardedRef, label}) {
         if (state.value !== value) {
             onInputChange(state.value);
         }
-        hidePickerModal();
+        hidePickerModal(true);
     };
 
     const title = value && _.keys(COMMON_CONST.STATES).includes(value) ? translate(`allStates.${value}.stateName`) : '';

From cb544b7031d1cb09cf7e301de4238a64608906b0 Mon Sep 17 00:00:00 2001
From: DylanDylann <dylandylan9112@gmail.com>
Date: Tue, 9 Jan 2024 02:18:33 +0700
Subject: [PATCH 2/2] fix rename param to shouldBlur

---
 src/components/StatePicker/index.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/StatePicker/index.js b/src/components/StatePicker/index.js
index 3ec37b5a308d..a2a8af1635eb 100644
--- a/src/components/StatePicker/index.js
+++ b/src/components/StatePicker/index.js
@@ -49,8 +49,8 @@ function StatePicker({value, errorText, onInputChange, forwardedRef, label, onBl
         setIsPickerVisible(true);
     };
 
-    const hidePickerModal = (isUpdateStateInput = false) => {
-        if (!isUpdateStateInput) {
+    const hidePickerModal = (shouldBlur = true) => {
+        if (shouldBlur) {
             onBlur();
         }
         setIsPickerVisible(false);
@@ -60,7 +60,9 @@ function StatePicker({value, errorText, onInputChange, forwardedRef, label, onBl
         if (state.value !== value) {
             onInputChange(state.value);
         }
-        hidePickerModal(true);
+        // If the user selects any state, call the hidePickerModal function with shouldBlur = false
+        // to prevent the onBlur function from being called.
+        hidePickerModal(false);
     };
 
     const title = value && _.keys(COMMON_CONST.STATES).includes(value) ? translate(`allStates.${value}.stateName`) : '';