From 4c7775ca19a9bc1c1516172a2faa13893f429c7c Mon Sep 17 00:00:00 2001
From: Wojciech Boman <wojciechboman@gmail.com>
Date: Fri, 12 Jul 2024 10:09:43 +0200
Subject: [PATCH] Fix displaying delete modal on iOS

---
 src/pages/Search/SearchSelectedNarrow.tsx | 34 +++++++++++++++++------
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/src/pages/Search/SearchSelectedNarrow.tsx b/src/pages/Search/SearchSelectedNarrow.tsx
index 11b0e376c77b..4de6ee1eef57 100644
--- a/src/pages/Search/SearchSelectedNarrow.tsx
+++ b/src/pages/Search/SearchSelectedNarrow.tsx
@@ -15,6 +15,7 @@ type SearchSelectedNarrowProps = {options: Array<DropdownOption<SearchHeaderOpti
 function SearchSelectedNarrow({options, itemsLength}: SearchSelectedNarrowProps) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
+    const selectedOptionIndexRef = useRef(-1);
 
     const [isModalVisible, setIsModalVisible] = useState(false);
     const buttonRef = useRef<View>(null);
@@ -22,6 +23,27 @@ function SearchSelectedNarrow({options, itemsLength}: SearchSelectedNarrowProps)
     const openMenu = () => setIsModalVisible(true);
     const closeMenu = () => setIsModalVisible(false);
 
+    const handleOnModalHide = () => {
+        if (selectedOptionIndexRef.current === -1) {
+            return;
+        }
+        options[selectedOptionIndexRef.current]?.onSelected?.();
+    };
+
+    const handleOnMenuItemPress = (option: DropdownOption<SearchHeaderOptionValue>, index: number) => {
+        if (option?.shouldCloseModalOnSelect) {
+            selectedOptionIndexRef.current = index;
+            closeMenu();
+            return;
+        }
+        option?.onSelected?.();
+    };
+
+    const handleOnCloseMenu = () => {
+        selectedOptionIndexRef.current = -1;
+        closeMenu();
+    };
+
     return (
         <View style={[styles.pb4]}>
             <Button
@@ -37,18 +59,14 @@ function SearchSelectedNarrow({options, itemsLength}: SearchSelectedNarrowProps)
             <Modal
                 isVisible={isModalVisible}
                 type={CONST.MODAL.MODAL_TYPE.BOTTOM_DOCKED}
-                onClose={closeMenu}
+                onClose={handleOnCloseMenu}
+                onModalHide={handleOnModalHide}
             >
-                {options.map((option) => (
+                {options.map((option, index) => (
                     <MenuItem
                         title={option.text}
                         icon={option.icon}
-                        onPress={() => {
-                            if (option?.shouldCloseModalOnSelect) {
-                                closeMenu();
-                            }
-                            option?.onSelected?.();
-                        }}
+                        onPress={() => handleOnMenuItemPress(option, index)}
                         key={option.value}
                     />
                 ))}