From 364d86af40c76ca180b46ce8c3cf5f799985341a Mon Sep 17 00:00:00 2001
From: Peter Velkov <kidroca@gmail.com>
Date: Fri, 30 Apr 2021 19:41:01 +0300
Subject: [PATCH 1/2] fix: Attachment Picker briefly displayed after taking a
 picture

---
 .../AttachmentPicker/index.native.js          | 55 ++++++++++---------
 1 file changed, 30 insertions(+), 25 deletions(-)

diff --git a/src/components/AttachmentPicker/index.native.js b/src/components/AttachmentPicker/index.native.js
index 085a4061ce2..060448abd2e 100644
--- a/src/components/AttachmentPicker/index.native.js
+++ b/src/components/AttachmentPicker/index.native.js
@@ -135,7 +135,6 @@ class AttachmentPicker extends Component {
 
         this.state = {
             isVisible: false,
-            result: null,
             onPicked: () => {},
         };
 
@@ -157,29 +156,20 @@ class AttachmentPicker extends Component {
             },
         ];
 
-        this.setResult = this.setResult.bind(this);
         this.close = this.close.bind(this);
-        this.completeAttachmentSelection = this.completeAttachmentSelection.bind(this);
+        this.pickAttachment = this.pickAttachment.bind(this);
     }
 
     /**
-     * Store the selected attachment mapped to an appropriate file interface
+     * Handles the image/document picker result and
+     * sends the selected attachment to the caller (parent component)
      *
      * @param {ImagePickerResponse|DocumentPickerResponse} attachment
      */
-    setResult(attachment) {
+    pickAttachment(attachment) {
         if (attachment && !attachment.didCancel && !attachment.error) {
             const result = getDataForUpload(attachment);
-            this.setState({result});
-        }
-    }
-
-    /**
-     * Triggers the `onPicked` callback with the selected attachment
-     */
-    completeAttachmentSelection() {
-        if (this.state.result) {
-            this.state.onPicked(this.state.result);
+            this.state.onPicked(result);
         }
     }
 
@@ -191,7 +181,6 @@ class AttachmentPicker extends Component {
     open(onPicked) {
         this.setState({
             isVisible: true,
-            result: null,
             onPicked,
         });
     }
@@ -203,6 +192,25 @@ class AttachmentPicker extends Component {
         this.setState({isVisible: false});
     }
 
+    /**
+     * Setup native attachment selection to start after this popover closes
+     *
+     * @param {{pickAttachment: function}} item - an item from this.menuItemData
+     */
+    selectItem(item) {
+        /* setTimeout delays execution to the frame after the modal closes
+        * without this on iOS closing the modal closes the gallery/camera as well */
+        this.onModalHide = () => setTimeout(
+            () => item.pickAttachment()
+                .then(this.pickAttachment)
+                .catch(console.error)
+                .finally(() => delete this.onModalHide),
+            10,
+        );
+
+        this.close();
+    }
+
     /**
      * Call the `children` renderProp with the interface defined in propTypes
      *
@@ -221,19 +229,16 @@ class AttachmentPicker extends Component {
                     onClose={this.close}
                     isVisible={this.state.isVisible}
                     anchorPosition={styles.createMenuPosition}
-                    onModalHide={this.completeAttachmentSelection}
+                    onModalHide={this.onModalHide}
                 >
                     <View style={this.props.isSmallScreenWidth ? {} : styles.createMenuContainer}>
                         {
-                            this.menuItemData.map(({icon, text, pickAttachment}) => (
+                            this.menuItemData.map(item => (
                                 <MenuItem
-                                    key={text}
-                                    icon={icon}
-                                    title={text}
-                                    onPress={() => pickAttachment()
-                                        .then(this.setResult)
-                                        .then(this.close)
-                                        .catch(console.error)}
+                                    key={item.text}
+                                    icon={item.icon}
+                                    title={item.text}
+                                    onPress={() => this.selectItem(item)}
                                 />
                             ))
                         }

From 6964c607eb70548fe815ae22a19657b672b0f2ac Mon Sep 17 00:00:00 2001
From: Peter Velkov <kidroca@gmail.com>
Date: Thu, 6 May 2021 20:22:24 +0300
Subject: [PATCH 2/2] refactor: Move `onPicked` to be an instance member and
 not in component state

---
 src/components/AttachmentPicker/index.native.js | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/components/AttachmentPicker/index.native.js b/src/components/AttachmentPicker/index.native.js
index 060448abd2e..687baceaecd 100644
--- a/src/components/AttachmentPicker/index.native.js
+++ b/src/components/AttachmentPicker/index.native.js
@@ -135,7 +135,6 @@ class AttachmentPicker extends Component {
 
         this.state = {
             isVisible: false,
-            onPicked: () => {},
         };
 
         this.menuItemData = [
@@ -169,7 +168,7 @@ class AttachmentPicker extends Component {
     pickAttachment(attachment) {
         if (attachment && !attachment.didCancel && !attachment.error) {
             const result = getDataForUpload(attachment);
-            this.state.onPicked(result);
+            this.completeAttachmentSelection(result);
         }
     }
 
@@ -179,10 +178,8 @@ class AttachmentPicker extends Component {
      * @param {function} onPicked A callback that will be called with the selected attachment
      */
     open(onPicked) {
-        this.setState({
-            isVisible: true,
-            onPicked,
-        });
+        this.completeAttachmentSelection = onPicked;
+        this.setState({isVisible: true});
     }
 
     /**