From 71e0150d270cc0bfdec4331872ab2aff6f4d66a1 Mon Sep 17 00:00:00 2001
From: Elias Nahum <nahumhbl@gmail.com>
Date: Mon, 10 May 2021 15:13:51 -0400
Subject: [PATCH] MM-35320 Fix race condition when saving draft on tablets
 (#5379)

---
 .../post_draft/post_input/post_input.js       | 10 ++++--
 .../post_draft/post_input/post_input.test.js  | 36 ++++++++++++++++++-
 app/constants/device.js                       |  2 +-
 3 files changed, 43 insertions(+), 5 deletions(-)

diff --git a/app/components/post_draft/post_input/post_input.js b/app/components/post_draft/post_input/post_input.js
index 7b9802584..6e9ad5240 100644
--- a/app/components/post_draft/post_input/post_input.js
+++ b/app/components/post_draft/post_input/post_input.js
@@ -10,6 +10,7 @@ import PasteableTextInput from '@components/pasteable_text_input';
 import {NavigationTypes} from '@constants';
 import DEVICE from '@constants/device';
 import {INSERT_TO_COMMENT, INSERT_TO_DRAFT} from '@constants/post_draft';
+import {debounce} from '@mm-redux/actions/helpers';
 import EventEmitter from '@mm-redux/utils/event_emitter';
 import {t} from '@utils/i18n';
 import {switchKeyboardForCodeBlocks} from '@utils/markdown';
@@ -86,7 +87,7 @@ export default class PostInput extends PureComponent {
         }
     };
 
-    changeDraft = (text) => {
+    changeDraft = debounce((text) => {
         const {
             channelId,
             handleCommentDraftChanged,
@@ -99,7 +100,7 @@ export default class PostInput extends PureComponent {
         } else {
             handlePostDraftChanged(channelId, text);
         }
-    };
+    }, 200);
 
     checkMessageLength = (value) => {
         const {intl} = this.context;
@@ -163,7 +164,7 @@ export default class PostInput extends PureComponent {
     };
 
     handleEndEditing = (e) => {
-        if (e && e.nativeEvent) {
+        if (e && e.nativeEvent && !DEVICE.IS_TABLET) {
             this.changeDraft(e.nativeEvent.text || '');
         }
     };
@@ -196,6 +197,9 @@ export default class PostInput extends PureComponent {
         } = this.props;
         this.value = value;
         updateInitialValue(value);
+        if (DEVICE.IS_TABLET) {
+            this.changeDraft(value);
+        }
 
         if (inputEventType) {
             EventEmitter.emit(inputEventType, value);
diff --git a/app/components/post_draft/post_input/post_input.test.js b/app/components/post_draft/post_input/post_input.test.js
index fceff1de5..025bb6c19 100644
--- a/app/components/post_draft/post_input/post_input.test.js
+++ b/app/components/post_draft/post_input/post_input.test.js
@@ -4,7 +4,9 @@
 import React from 'react';
 import {Alert} from 'react-native';
 import {shallowWithIntl} from 'test/intl-test-helper';
+import TestHelper from 'test/test_helper';
 
+import Device from '@constants/device';
 import Preferences from '@mm-redux/constants/preferences';
 
 import PostInput from './post_input';
@@ -48,7 +50,7 @@ describe('PostInput', () => {
         expect(instance.changeDraft).not.toBeCalled();
     });
 
-    test('should emit the event and text is save to draft', () => {
+    test('should emit the event and text is save to draft', async () => {
         const wrapper = shallowWithIntl(
             <PostInput {...baseProps}/>,
         );
@@ -58,6 +60,7 @@ describe('PostInput', () => {
 
         instance.setValue(value);
         instance.handleAppStateChange('background');
+        await TestHelper.wait(200);
         expect(baseProps.handlePostDraftChanged).toHaveBeenCalledWith(baseProps.channelId, value);
         expect(baseProps.handlePostDraftChanged).toHaveBeenCalledTimes(1);
     });
@@ -76,5 +79,36 @@ describe('PostInput', () => {
         expect(Alert.alert).toBeCalled();
         expect(Alert.alert).toHaveBeenCalledTimes(1);
     });
+
+    test('should save the draft onChangeText for tablets', async () => {
+        Device.IS_TABLET = true;
+        const wrapper = shallowWithIntl(
+            <PostInput {...baseProps}/>,
+        );
+
+        const instance = wrapper.instance();
+        const value = 'some text';
+
+        instance.handleTextChange(value);
+        await TestHelper.wait(200);
+
+        expect(baseProps.handlePostDraftChanged).toBeCalled();
+        expect(baseProps.handlePostDraftChanged).toHaveBeenCalledTimes(1);
+    });
+
+    test('should not save the draft onEndEditing for tablets', async () => {
+        Device.IS_TABLET = true;
+        const wrapper = shallowWithIntl(
+            <PostInput {...baseProps}/>,
+        );
+
+        const instance = wrapper.instance();
+        const value = 'some text';
+
+        instance.handleEndEditing(value);
+        await TestHelper.wait(200);
+
+        expect(baseProps.handlePostDraftChanged).not.toBeCalled();
+    });
 });
 
diff --git a/app/constants/device.js b/app/constants/device.js
index d052a81d0..2988f2822 100644
--- a/app/constants/device.js
+++ b/app/constants/device.js
@@ -23,7 +23,7 @@ export default {
     DOCUMENTS_PATH: `${RNFetchBlobFS.dirs.CacheDir}/Documents`,
     IMAGES_PATH: `${RNFetchBlobFS.dirs.CacheDir}/Images`,
     IS_IPHONE_WITH_INSETS: isPhoneWithInsets,
-    IS_TABLET: DeviceInfo.isTablet(),
+    IS_TABLET: isTablet,
     VIDEOS_PATH: `${RNFetchBlobFS.dirs.CacheDir}/Videos`,
     PERMANENT_SIDEBAR_SETTINGS: '@PERMANENT_SIDEBAR_SETTINGS',
     TABLET_WIDTH: 250,