MM-17692 execute callback after closing post options (#3107)

* MM-17692 execute callback after closing post options

* Fix unit tests

app/components/slide_up_panel/slide_up_panel.js

@@ -130,12 +130,12 @@ export default class SlideUpPanel extends PureComponent {
         }).start();
     }
 
-    closeWithAnimation = () => {
+    closeWithAnimation = (cb) => {
         Animated.timing(this.translateYOffset, {
             duration: 200,
             toValue: this.snapPoints[2],
             useNativeDriver: true,
-        }).start(() => this.props.onRequestClose());
+        }).start(() => this.props.onRequestClose(cb));
     };
 
     onHeaderHandlerStateChange = ({nativeEvent}) => {

app/screens/post_options/post_options.js

@@ -50,15 +50,19 @@ export default class PostOptions extends PureComponent {
         intl: intlShape.isRequired,
     };
 
-    close = () => {
-        this.props.actions.dismissModal();
+    close = async (cb) => {
+        await this.props.actions.dismissModal();
+
+        if (typeof cb === 'function') {
+            setTimeout(cb, 300);
+        }
     };
 
-    closeWithAnimation = () => {
+    closeWithAnimation = (cb) => {
         if (this.slideUpPanel) {
-            this.slideUpPanel.closeWithAnimation();
+            this.slideUpPanel.closeWithAnimation(cb);
         } else {
-            this.close();
+            this.close(cb);
         }
     };
 
@@ -279,8 +283,7 @@ export default class PostOptions extends PureComponent {
         const {actions, theme} = this.props;
         const {formatMessage} = this.context.intl;
 
-        this.close();
-        setTimeout(() => {
+        this.close(() => {
             MaterialIcon.getImageSource('close', 20, theme.sidebarHeaderTextColor).then((source) => {
                 const screen = 'AddReaction';
                 const title = formatMessage({id: 'mobile.post_info.add_reaction', defaultMessage: 'Add Reaction'});
@@ -291,15 +294,14 @@ export default class PostOptions extends PureComponent {
 
                 actions.showModal(screen, title, passProps);
             });
-        }, 300);
+        });
     };
 
     handleReply = () => {
         const {post} = this.props;
-        this.closeWithAnimation();
-        setTimeout(() => {
+        this.closeWithAnimation(() => {
             EventEmitter.emit('goToThread', post);
-        }, 250);
+        });
     };
 
     handleAddReactionToPost = (emoji) => {
@@ -370,8 +372,7 @@ export default class PostOptions extends PureComponent {
         const {actions, theme, post} = this.props;
         const {intl} = this.context;
 
-        this.close();
-        setTimeout(() => {
+        this.close(() => {
             MaterialIcon.getImageSource('close', 20, theme.sidebarHeaderTextColor).then((source) => {
                 const screen = 'EditPost';
                 const title = intl.formatMessage({id: 'mobile.edit_post.title', defaultMessage: 'Editing Message'});
@@ -382,7 +383,7 @@ export default class PostOptions extends PureComponent {
 
                 actions.showModal(screen, title, passProps);
             });
-        }, 300);
+        });
     };
 
     handleUnflagPost = () => {

app/screens/settings/notification_settings_mentions_keywords/__snapshots__/notification_settings_mentions_keywords.test.js.snap

@@ -39,6 +39,7 @@ NotificationSettingsMentionsKeywords {
       "textComponent": "span",
       "timeZone": null,
     },
+    "isLandscape": false,
     "keywords": "",
     "onBack": [MockFunction],
     "theme": Object {
@@ -125,6 +126,7 @@ NotificationSettingsMentionsKeywords {
             "timeZone": null,
           }
         }
+        isLandscape={false}
         keywords=""
         onBack={[MockFunction]}
         theme={
@@ -211,23 +213,28 @@ NotificationSettingsMentionsKeywords {
               placeholderTextColor="rgba(61,60,64,0.4)"
               returnKeyType="done"
               style={
-                Object {
-                  "color": "#3d3c40",
-                  "fontSize": 15,
-                  "height": 150,
-                  "paddingHorizontal": 15,
-                  "paddingVertical": 10,
-                }
+                Array [
+                  Object {
+                    "color": "#3d3c40",
+                    "fontSize": 15,
+                    "height": 150,
+                    "paddingVertical": 10,
+                  },
+                  null,
+                ]
               }
               value=""
             />
           </View>
           <View
             style={
-              Object {
-                "marginTop": 10,
-                "paddingHorizontal": 15,
-              }
+              Array [
+                Object {
+                  "marginTop": 10,
+                  "paddingHorizontal": 15,
+                },
+                null,
+              ]
             }
           >
             <FormattedText

app/screens/settings/notification_settings_mentions_keywords/notification_settings_mentions_keywords.test.js

@@ -16,6 +16,7 @@ describe('NotificationSettingsMentionsKeywords', () => {
         },
         componentId: 'component-id',
         keywords: '',
+        isLandscape: false,
         onBack: jest.fn(),
         theme: Preferences.THEMES.default,
     };