Merge pull request #24 from wordpress-mobile/fix/22-performance-issue…

…-in-RN-lifecycle Fix delayed update and weird output when typing fast in AztecRN
WordPress · Jun 29, 2018 · 873ae8f · 873ae8f
2 parents ed688d4 + a08d774
commit 873ae8f
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 4 deletions.
diff --git a/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java b/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java
@@ -9,6 +9,8 @@
 
 import com.facebook.infer.annotation.Assertions;
 import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.common.MapBuilder;
 import com.facebook.react.uimanager.PixelUtil;
 import com.facebook.react.uimanager.SimpleViewManager;
@@ -86,7 +88,20 @@ public Map<String, Object> getExportedCustomBubblingEventTypeConstants() {
     }
 
     @ReactProp(name = "text")
-    public void setText(ReactAztecText view, String text) {
+    public void setText(ReactAztecText view, ReadableMap inputMap) {
+        if (!inputMap.hasKey("eventCount")) {
+            setTextfromJS(view, inputMap.getString("text"));
+        } else {
+            // Don't think there is necessity of this branch, but justin case we want to
+            // force a 2nd setText from JS side to Native, just set a high eventCount
+            int eventCount = inputMap.getInt("eventCount");
+            if (view.mNativeEventCount < eventCount) {
+                setTextfromJS(view, inputMap.getString("text"));
+            }
+        }
+    }
+
+    private void setTextfromJS(ReactAztecText view, String text) {
         view.setIsSettingTextFromJS(true);
         view.fromHtml(text);
         view.setIsSettingTextFromJS(false);

diff --git a/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java b/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java
@@ -38,7 +38,7 @@ public class ReactAztecText extends AztecText {
 
     // FIXME: Used in `incrementAndGetEventCounter` but never read. I guess we can get rid of it, but before this
     // check when it's used in EditText in RN. (maybe tests?)
-    private int mNativeEventCount = 0;
+    int mNativeEventCount = 0;
 
     public ReactAztecText(ThemedReactContext reactContext) {
         super(reactContext);

diff --git a/example/App.js b/example/App.js
@@ -30,7 +30,7 @@ export default class example extends React.Component {
                     <RCTAztecView
                          {...this.props}
                          style={[styles.aztec_editor, {minHeight: myMinHeight}]}
-                         text = {this.state.text}
+                         text = {{text: this.state.text}}
                          onContentSizeChange= {(event) => {
                               this.setState({height: event.nativeEvent.contentSize.height});
                           }}

diff --git a/src/AztecView.js b/src/AztecView.js
@@ -4,7 +4,7 @@ import {requireNativeComponent, ViewPropTypes} from 'react-native';
 var aztex = {
   name: 'AztecView',
   propTypes: {
-    text: PropTypes.string,
+    text: PropTypes.object,
     color: PropTypes.string,
     maxImagesWidth: PropTypes.number,
     minImagesWidth: PropTypes.number,